From 83e78a6f14882719334f1f4dbf15d067bfb89555 Mon Sep 17 00:00:00 2001 From: pacholoamit Date: Sun, 13 Oct 2024 14:53:11 +0800 Subject: [PATCH] feat: Update tauri version to 2.0.3 and sysinfo to 0.30.12 --- src-tauri/Cargo.lock | 148 +++++++++++++++--- src-tauri/Cargo.toml | 6 +- src/components/area-chart.tsx | 6 +- src/components/numeric-stats-ring.tsx | 0 src/contants.ts | 9 ++ .../components/disks/disk.area-chart.tsx | 80 ++++++++++ src/features/metrics/pages/dashboard.page.tsx | 24 ++- 7 files changed, 240 insertions(+), 33 deletions(-) delete mode 100644 src/components/numeric-stats-ring.tsx create mode 100644 src/features/metrics/components/disks/disk.area-chart.tsx diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock index 80f69215..5d972a88 100644 --- a/src-tauri/Cargo.lock +++ b/src-tauri/Cargo.lock @@ -3157,7 +3157,6 @@ source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "915b1b472bc21c53464d6c8461c9d3af805ba1ef837e1cac254428f4a77177b1" dependencies = [ "malloc_buf", - "objc_exception", ] [[package]] @@ -3165,6 +3164,9 @@ name = "objc-sys" version = "0.3.5" source = "registry+https://github.com/rust-lang/crates.io-index" checksum = "cdb91bdd390c7ce1a8607f35f3ca7151b65afc0ff5ff3b34fa350f7d7c7e4310" +dependencies = [ + "cc", +] [[package]] name = "objc2" @@ -3192,6 +3194,30 @@ dependencies = [ "objc2-quartz-core", ] +[[package]] +name = "objc2-cloud-kit" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "74dd3b56391c7a0596a295029734d3c1c5e7e510a4cb30245f8221ccea96b009" +dependencies = [ + "bitflags 2.6.0", + "block2", + "objc2", + "objc2-core-location", + "objc2-foundation", +] + +[[package]] +name = "objc2-contacts" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a5ff520e9c33812fd374d8deecef01d4a840e7b41862d849513de77e44aa4889" +dependencies = [ + "block2", + "objc2", + "objc2-foundation", +] + [[package]] name = "objc2-core-data" version = "0.2.2" @@ -3216,6 +3242,18 @@ dependencies = [ "objc2-metal", ] +[[package]] +name = "objc2-core-location" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "000cfee34e683244f284252ee206a27953279d370e309649dc3ee317b37e5781" +dependencies = [ + "block2", + "objc2", + "objc2-contacts", + "objc2-foundation", +] + [[package]] name = "objc2-encode" version = "4.0.3" @@ -3234,6 +3272,18 @@ dependencies = [ "objc2", ] +[[package]] +name = "objc2-link-presentation" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "a1a1ae721c5e35be65f01a03b6d2ac13a54cb4fa70d8a5da293d7b0020261398" +dependencies = [ + "block2", + "objc2", + "objc2-app-kit", + "objc2-foundation", +] + [[package]] name = "objc2-metal" version = "0.2.2" @@ -3260,21 +3310,71 @@ dependencies = [ ] [[package]] -name = "objc_exception" -version = "0.1.2" +name = "objc2-symbols" +version = "0.2.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "ad970fb455818ad6cba4c122ad012fae53ae8b4795f86378bce65e4f6bab2ca4" +checksum = "0a684efe3dec1b305badae1a28f6555f6ddd3bb2c2267896782858d5a78404dc" dependencies = [ - "cc", + "objc2", + "objc2-foundation", ] [[package]] -name = "objc_id" -version = "0.1.1" +name = "objc2-ui-kit" +version = "0.2.2" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "c92d4ddb4bd7b50d730c215ff871754d0da6b2178849f8a2a2ab69712d0c073b" +checksum = "b8bb46798b20cd6b91cbd113524c490f1686f4c4e8f49502431415f3512e2b6f" dependencies = [ - "objc", + "bitflags 2.6.0", + "block2", + "objc2", + "objc2-cloud-kit", + "objc2-core-data", + "objc2-core-image", + "objc2-core-location", + "objc2-foundation", + "objc2-link-presentation", + "objc2-quartz-core", + "objc2-symbols", + "objc2-uniform-type-identifiers", + "objc2-user-notifications", +] + +[[package]] +name = "objc2-uniform-type-identifiers" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "44fa5f9748dbfe1ca6c0b79ad20725a11eca7c2218bceb4b005cb1be26273bfe" +dependencies = [ + "block2", + "objc2", + "objc2-foundation", +] + +[[package]] +name = "objc2-user-notifications" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "76cfcbf642358e8689af64cee815d139339f3ed8ad05103ed5eaf73db8d84cb3" +dependencies = [ + "bitflags 2.6.0", + "block2", + "objc2", + "objc2-core-location", + "objc2-foundation", +] + +[[package]] +name = "objc2-web-kit" +version = "0.2.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +checksum = "68bc69301064cebefc6c4c90ce9cba69225239e4b8ff99d445a2b5563797da65" +dependencies = [ + "bitflags 2.6.0", + "block2", + "objc2", + "objc2-app-kit", + "objc2-foundation", ] [[package]] @@ -3366,7 +3466,7 @@ dependencies = [ "anyhow", "base64 0.22.1", "chrono", - "cocoa 0.25.0", + "cocoa 0.26.0", "fs_extra", "hex_color", "log", @@ -4832,7 +4932,6 @@ dependencies = [ "libc", "ntapi 0.4.1", "once_cell", - "rayon", "windows 0.52.0", ] @@ -4945,9 +5044,9 @@ checksum = "61c41af27dd6d1e27b1b16b489db798443478cef1f06a660c96db617ba5de3b1" [[package]] name = "tauri" -version = "2.0.2" +version = "2.0.3" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "5920aad0804ea5e86808d4b6e8753d3bcbae7efc8f4e41a4da00b45427559868" +checksum = "fd96d46534b10765ce0c6208f9451d98ea38636364a41b272d3610c70dd0e4c3" dependencies = [ "anyhow", "bytes", @@ -5266,9 +5365,9 @@ dependencies = [ [[package]] name = "tauri-runtime" -version = "2.0.1" +version = "2.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "af12ad1af974b274ef1d32a94e6eba27a312b429ef28fcb98abc710df7f9151d" +checksum = "c8f437293d6f5e5dce829250f4dbdce4e0b52905e297a6689cc2963eb53ac728" dependencies = [ "dpi", "gtk", @@ -5285,9 +5384,9 @@ dependencies = [ [[package]] name = "tauri-runtime-wry" -version = "2.0.1" +version = "2.1.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "e45e88aa0b11b302d836e6ea3e507a6359044c4a8bc86b865ba99868c695753d" +checksum = "aaac63b65df8e85570993eaf93ae1dd73a6fb66d8bd99674ce65f41dc3c63e7d" dependencies = [ "gtk", "http 1.1.0", @@ -6688,14 +6787,12 @@ dependencies = [ [[package]] name = "wry" -version = "0.44.1" +version = "0.46.0" source = "registry+https://github.com/rust-lang/crates.io-index" -checksum = "440600584cfbd8b0d28eace95c1f2c253db05dae43780b79380aa1e868f04c73" +checksum = "469a3765ecc3e8aa9ccdf3c5a52c82697ec03037cd60494488763880d31a1b3a" dependencies = [ "base64 0.22.1", - "block", - "cocoa 0.26.0", - "core-graphics 0.24.0", + "block2", "crossbeam-channel", "dpi", "dunce", @@ -6708,8 +6805,11 @@ dependencies = [ "kuchikiki", "libc", "ndk 0.9.0", - "objc", - "objc_id", + "objc2", + "objc2-app-kit", + "objc2-foundation", + "objc2-ui-kit", + "objc2-web-kit", "once_cell", "percent-encoding", "raw-window-handle 0.6.2", diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml index f3ed22d5..6c939d87 100644 --- a/src-tauri/Cargo.toml +++ b/src-tauri/Cargo.toml @@ -22,8 +22,8 @@ systemicons = { path = "./ws-systemicons" } chrono = { version = "0.4.23", features = ["serde"] } serde_json = "1.0" serde = { version = "1.0", features = ["derive"] } -tauri = { version = "2.0.2", features = ["tray-icon", "devtools"] } -sysinfo = "0.30.12" +tauri = { version = "2.0.3", features = ["tray-icon", "devtools"] } +sysinfo = {version = "0.30.12", default-features = false } log = "^0.4" @@ -51,7 +51,7 @@ tauri-plugin-shell = { git = "https://github.com/tauri-apps/plugins-workspace", [target.'cfg(target_os = "macos")'.dependencies] -cocoa = "0.25.0" +cocoa = "0.26.0" objc = "0.2.7" [target.'cfg(target_os = "windows")'.dependencies] diff --git a/src/components/area-chart.tsx b/src/components/area-chart.tsx index 626d1281..3f256fd3 100644 --- a/src/components/area-chart.tsx +++ b/src/components/area-chart.tsx @@ -97,10 +97,13 @@ export const useAreaChartState = ( yAxis: { max: opts.yAxis.max, + title: { text: null, }, - startOnTick: true, + + endOnTick: true, + gridLineColor: other.charts.area.default.gridLineColor, lineColor: other.charts.area.default.lineColor, labels: { @@ -123,6 +126,7 @@ export const useAreaChartState = ( }, // Scrollbar at the bottom of the chart scrollbar: { + enabled: false, rifleColor: other.charts.area.default.scrollbar.rifleColor, barBackgroundColor: other.charts.area.default.scrollbar.barBackgroundColor, buttonBackgroundColor: other.charts.area.default.scrollbar.buttonBackgroundColor, diff --git a/src/components/numeric-stats-ring.tsx b/src/components/numeric-stats-ring.tsx deleted file mode 100644 index e69de29b..00000000 diff --git a/src/contants.ts b/src/contants.ts index 3b12949f..d9026e08 100644 --- a/src/contants.ts +++ b/src/contants.ts @@ -84,6 +84,15 @@ const areaChartThemeOptions = { ], }, }, + disk: { + color: { + linearGradient: { x1: 0, x2: 0, y1: 0, y2: 1 }, + stops: [ + [0, "rgba(116, 52, 235, 0.75)"], + [1, "rgba(116, 52, 235, 0)"], + ], + }, + }, }; export const themes: Record = { diff --git a/src/features/metrics/components/disks/disk.area-chart.tsx b/src/features/metrics/components/disks/disk.area-chart.tsx new file mode 100644 index 00000000..3ca3b8da --- /dev/null +++ b/src/features/metrics/components/disks/disk.area-chart.tsx @@ -0,0 +1,80 @@ +import { useEffect, useState } from "react"; + +import AreaChart, { useAreaChartState } from "@/components/area-chart"; +import Card from "@/components/card"; +import StatsRing from "@/components/stats-ring2"; +import { VIEWABLE_ELEMENT_COUNT } from "@/contants"; +import useDisksSelectors, { FormattedDisk } from "@/features/metrics/stores/disk.store"; +import formatBytes from "@/features/metrics/utils/format-bytes"; +import { Disk } from "@/lib"; +import { Grid, useMantineTheme } from "@mantine/core"; +import { IconCpu } from "@tabler/icons-react"; + +interface DiskAreaChartProps { + disk: Disk; +} + +interface DiskMetricsState { + timestamp: number; + used: number; +} + +const DiskAreaChart = ({ disk }: DiskAreaChartProps) => { + const { other } = useMantineTheme(); + //! TODO: Use `useEnumerableStore` hook here , currently just a hack + const [diskMetrics, setDiskMetrics] = useState([]); + const [chartOptions, setChartOptions] = useAreaChartState({ + title: { + text: `Disk Usage`, + }, + yAxis: { + labels: { + formatter: (x) => `${formatBytes(x.value as number)}`, + }, + }, + tooltip: { + pointFormatter: function () { + return `\u25CF ${this.series.name}: ${formatBytes( + this.y as number + )}
`; + }, + }, + }); + + useEffect(() => { + setDiskMetrics((prev) => { + if (prev.length > VIEWABLE_ELEMENT_COUNT) prev.shift(); + return [...prev, { timestamp: disk.timestamp, used: disk.used } as DiskMetricsState]; + }); + + setChartOptions({ + series: [ + { + name: `Disk Usage`, + type: "area", + data: diskMetrics.map((disk) => [disk.timestamp, disk.used]), + color: other.charts.area.disk.color, + }, + ], + }); + }, [disk]); + + const stats = formatBytes(disk.used); + const progress = disk.usedPercentage; + + return ( + + + + + + + + + + + + ); +}; + +export default DiskAreaChart; diff --git a/src/features/metrics/pages/dashboard.page.tsx b/src/features/metrics/pages/dashboard.page.tsx index 2de8871e..bced9e32 100644 --- a/src/features/metrics/pages/dashboard.page.tsx +++ b/src/features/metrics/pages/dashboard.page.tsx @@ -3,6 +3,7 @@ import { useShallow } from "zustand/react/shallow"; import PageWrapper from "@/components/page-wrapper"; import SystemInformationWidget from "@/components/system-information-widget"; import CpusBarChart from "@/features/metrics/components/cpus/cpus.bar-charts"; +import DiskAreaChart from "@/features/metrics/components/disks/disk.area-chart"; import DiskStatsRing from "@/features/metrics/components/disks/disk.stats-ring"; import GlobalCpuAreaChart from "@/features/metrics/components/global-cpu/global-cpu.area-chart"; import GlobalCpuStatsRing from "@/features/metrics/components/global-cpu/global-cpu.stats-ring"; @@ -12,6 +13,7 @@ import NetworksReceivedAreaChart from "@/features/metrics/components/networks/ne import NetworksTransmittedAreaChart from "@/features/metrics/components/networks/networks-transmitted.area-chart"; import SwapAreaChart from "@/features/metrics/components/swap/swap.area-chart"; import SwapStatsRing from "@/features/metrics/components/swap/swap.stats-ring"; +import useDisksSelectors from "@/features/metrics/stores/disk.store"; import useSystemStoreSelectors from "@/features/metrics/stores/system.store"; import useRandomGreeting from "@/hooks/useRandomGreeting"; import { Grid } from "@mantine/core"; @@ -41,9 +43,6 @@ const MemorySection = () => { - - - ); }; @@ -62,7 +61,7 @@ const CpuSection = () => { ); }; -const DisksSection = () => { +const NetworksSection = () => { return ( <> @@ -75,6 +74,20 @@ const DisksSection = () => { ); }; +const DiskSection = () => { + const disks = useDisksSelectors.use.disks(); + + return ( + <> + {disks.map((disk) => ( + + + + ))} + + ); +}; + const DashboardPage = () => { const hostname = useSystemStoreSelectors(useShallow((state) => state.info.hostname)); const greeting = useRandomGreeting(hostname); @@ -84,7 +97,8 @@ const DashboardPage = () => { - + + );