fankes/beszel
2
0
Fork 0
mirror of https://github.com/fankes/beszel.git synced 2025-10-18 17:29:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Minor UI changes (#1110)

Browse Source 
* ui: add devices count from #1078

* ux: save sortMode in localStorage from #1024

* fix: reload component when system switch to "up"

* ux: move running systems to desc field
This commit is contained in:
Augustin ROLET
2025-09-01 00:16:25 +02:00
committed by GitHub
parent 57a1a8b39e
commit 3dbcb5d7da
2 changed files with 15 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
beszel/site/package.json
View File

@@ -4,7 +4,7 @@
"version": "0.12.6",
"type": "module",
"scripts": {
"dev": "vite",
"dev": "vite --host",
"build": "lingui extract --overwrite && lingui compile && vite build",
"preview": "vite preview",
"sync": "lingui extract --overwrite && lingui compile",

19
beszel/site/src/components/systems-table/systems-table.tsx
View File

@@ -59,7 +59,7 @@ export default function SystemsTable() {
const { i18n, t } = useLingui()
const [filter, setFilter] = useState<string>()
const [statusFilter, setStatusFilter] = useState<StatusFilter>("all")
const [sorting, setSorting] = useState<SortingState>([{ id: "system", desc: false }])
const [sorting, setSorting] = useLocalStorage<SortingState>("sortMode",[{ id: "system", desc: false }])
const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])
const [columnVisibility, setColumnVisibility] = useLocalStorage<VisibilityState>("cols", {})
const [viewMode, setViewMode] = useLocalStorage<ViewMode>(
@@ -78,6 +78,14 @@ export default function SystemsTable() {
return data.filter((system) => system.status === statusFilter)
}, [data, statusFilter])
const runningRecords = useMemo(() => {
return data.filter((record) => record.status === "up").length
}, [data])
const totalRecords = useMemo(() => {
return data.length
}, [data])
useEffect(() => {
if (filter !== undefined) {
table.getColumn("system")?.setFilterValue(filter)
@@ -121,9 +129,10 @@ export default function SystemsTable() {
<div className="px-2 sm:px-1">
<CardTitle className="mb-2.5">
<Trans>All Systems</Trans>
</CardTitle>
<CardDescription>
<Trans>Updated in real time. Click on a system to view information.</Trans>
</CardTitle>
<CardDescription className="flex">
<Trans>Click on a system to view information - {runningRecords} / {totalRecords}</Trans>
<p className={"ml-2 text-" + (runningRecords === totalRecords ? "emerald" : "red") + "-600"}>Online</p>
</CardDescription>
</div>
@@ -252,7 +261,7 @@ export default function SystemsTable() {
</div>
</CardHeader>
)
}, [visibleColumns.length, sorting, viewMode, locale, statusFilter])
}, [visibleColumns.length, sorting, viewMode, locale, statusFilter, runningRecords, totalRecords])
return (
<Card>