+
+ {val.toFixed(2)}%
) {
style={{ transform: `scalex(${val}%)` }}
>
- {val.toFixed(2)}%
)
}
diff --git a/site/src/index.css b/site/src/index.css
index 922d8ed..984c65f 100644
--- a/site/src/index.css
+++ b/site/src/index.css
@@ -3,7 +3,7 @@
@tailwind utilities;
@layer base {
:root {
- --background: 30 8% 97.45%;
+ --background: 30 8% 98.5%;
--foreground: 30 0% 0%;
--card: 30 0% 100%;
--card-foreground: 240 6.67% 2.94%;
diff --git a/site/src/lib/stores.ts b/site/src/lib/stores.ts
index 59a8cc6..161e5e7 100644
--- a/site/src/lib/stores.ts
+++ b/site/src/lib/stores.ts
@@ -25,8 +25,14 @@ export const $authenticated = atom(pb.authStore.isValid)
/** List of system records */
export const $systems = atom([] as SystemRecord[])
+/** Last updated system record (realtime) */
+export const $updatedSystem = atom({} as SystemRecord)
+
/** List of alert records */
export const $alerts = atom([] as AlertRecord[])
/** SSH public key */
export const $publicKey = atom('')
+
+/** Chart time period */
+export const $chartTime = atom('1h')
diff --git a/site/src/lib/utils.ts b/site/src/lib/utils.ts
index dcd8875..dcf7b88 100644
--- a/site/src/lib/utils.ts
+++ b/site/src/lib/utils.ts
@@ -96,3 +96,25 @@ export function updateRecordList
(
}
$store.set(newRecords)
}
+
+export function getPbTimestamp(timeString: string) {
+ const now = new Date()
+ let timeValue = parseInt(timeString.slice(0, -1))
+ let unit = timeString.slice(-1)
+
+ if (unit === 'h') {
+ now.setUTCHours(now.getUTCHours() - timeValue)
+ } else {
+ // d
+ now.setUTCDate(now.getUTCDate() - timeValue)
+ }
+
+ const year = now.getUTCFullYear()
+ const month = String(now.getUTCMonth() + 1).padStart(2, '0')
+ const day = String(now.getUTCDate()).padStart(2, '0')
+ const hours = String(now.getUTCHours()).padStart(2, '0')
+ const minutes = String(now.getUTCMinutes()).padStart(2, '0')
+ const seconds = String(now.getUTCSeconds()).padStart(2, '0')
+
+ return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
+}
diff --git a/site/src/main.tsx b/site/src/main.tsx
index b1de0e2..609e387 100644
--- a/site/src/main.tsx
+++ b/site/src/main.tsx
@@ -3,7 +3,15 @@ import React, { Suspense, lazy, useEffect } from 'react'
import ReactDOM from 'react-dom/client'
import Home from './components/routes/home.tsx'
import { ThemeProvider } from './components/theme-provider.tsx'
-import { $alerts, $authenticated, $router, $systems, navigate, pb } from './lib/stores.ts'
+import {
+ $alerts,
+ $authenticated,
+ $updatedSystem,
+ $router,
+ $systems,
+ navigate,
+ pb,
+} from './lib/stores.ts'
import { ModeToggle } from './components/mode-toggle.tsx'
import {
cn,
@@ -53,6 +61,7 @@ const App = () => {
// subscribe to real time updates for systems / alerts
pb.collection('systems').subscribe('*', (e) => {
updateRecordList(e, $systems)
+ $updatedSystem.set(e.record)
})
pb.collection('alerts').subscribe('*', (e) => {
updateRecordList(e, $alerts)
diff --git a/types.go b/types.go
index 8c599b5..0574ae5 100644
--- a/types.go
+++ b/types.go
@@ -18,14 +18,14 @@ type SystemData struct {
}
type SystemInfo struct {
- Cores int `json:"c"`
- Threads int `json:"t"`
- CpuModel string `json:"m"`
- Os string `json:"o"`
- Uptime uint64 `json:"u"`
- Cpu float64 `json:"cpu"`
- MemPct float64 `json:"mp"`
- DiskPct float64 `json:"dp"`
+ Cores int `json:"c"`
+ Threads int `json:"t"`
+ CpuModel string `json:"m"`
+ // Os string `json:"o"`
+ Uptime uint64 `json:"u"`
+ Cpu float64 `json:"cpu"`
+ MemPct float64 `json:"mp"`
+ DiskPct float64 `json:"dp"`
}
type SystemStats struct {