diff --git a/src/App.tsx b/src/App.tsx
index 746bd4c..ce61bc6 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,61 +1,19 @@
import { BrowserRouter, Routes, Route } from 'react-router-dom'
import { Header } from './components/Header'
-import { ProxmoxWidget } from './components/widgets/ProxmoxWidget'
-import { NasWidget } from './components/widgets/NasWidget'
-import { AdGuardWidget } from './components/widgets/AdGuardWidget'
-import { CrowdSecWidget } from './components/widgets/CrowdSecWidget'
-import { HeadscaleWidget } from './components/widgets/HeadscaleWidget'
-import { KumaWidget } from './components/widgets/KumaWidget'
-import { FritzboxWidget } from './components/widgets/FritzboxWidget'
-import { AuthentikWidget } from './components/widgets/AuthentikWidget'
-import { VaultwardenWidget } from './components/widgets/VaultwardenWidget'
-import { ArrCalendarWidget } from './components/widgets/ArrCalendarWidget'
-import { ArrStatsWidget } from './components/widgets/ArrStatsWidget'
-import { QbittorrentWidget } from './components/widgets/QbittorrentWidget'
-import { GrafanaWidget } from './components/widgets/GrafanaWidget'
-import { PrometheusWidget } from './components/widgets/PrometheusWidget'
-import { LokiWidget } from './components/widgets/LokiWidget'
-import { JellyfinWidget } from './components/widgets/JellyfinWidget'
-import { NavidromeWidget } from './components/widgets/NavidromeWidget'
-import { RommWidget } from './components/widgets/RommWidget'
import { AppsPage } from './pages/AppsPage'
+import { dashboardSections } from './config/dashboard'
function DashboardPage() {
return (
<>
-
Infrastructure
-
-
- Media
-
-
- Monitoring
-
-
- Access
-
+ {dashboardSections.map(({ label, widgets }) => (
+
+
{label}
+
+ {widgets.map((Widget, i) => )}
+
+
+ ))}
>
)
}
diff --git a/src/config/dashboard.ts b/src/config/dashboard.ts
new file mode 100644
index 0000000..c269e9e
--- /dev/null
+++ b/src/config/dashboard.ts
@@ -0,0 +1,43 @@
+import { ComponentType } from 'react'
+import { ProxmoxWidget } from '../components/widgets/ProxmoxWidget'
+import { NasWidget } from '../components/widgets/NasWidget'
+import { AdGuardWidget } from '../components/widgets/AdGuardWidget'
+import { HeadscaleWidget } from '../components/widgets/HeadscaleWidget'
+import { FritzboxWidget } from '../components/widgets/FritzboxWidget'
+import { JellyfinWidget } from '../components/widgets/JellyfinWidget'
+import { NavidromeWidget } from '../components/widgets/NavidromeWidget'
+import { RommWidget } from '../components/widgets/RommWidget'
+import { ArrCalendarWidget } from '../components/widgets/ArrCalendarWidget'
+import { ArrStatsWidget } from '../components/widgets/ArrStatsWidget'
+import { QbittorrentWidget } from '../components/widgets/QbittorrentWidget'
+import { KumaWidget } from '../components/widgets/KumaWidget'
+import { CrowdSecWidget } from '../components/widgets/CrowdSecWidget'
+import { GrafanaWidget } from '../components/widgets/GrafanaWidget'
+import { PrometheusWidget } from '../components/widgets/PrometheusWidget'
+import { LokiWidget } from '../components/widgets/LokiWidget'
+import { AuthentikWidget } from '../components/widgets/AuthentikWidget'
+import { VaultwardenWidget } from '../components/widgets/VaultwardenWidget'
+
+export interface DashboardSection {
+ label: string
+ widgets: ComponentType[]
+}
+
+export const dashboardSections: DashboardSection[] = [
+ {
+ label: 'Infrastructure',
+ widgets: [ProxmoxWidget, NasWidget, AdGuardWidget, HeadscaleWidget, FritzboxWidget],
+ },
+ {
+ label: 'Monitoring',
+ widgets: [KumaWidget, CrowdSecWidget, GrafanaWidget, PrometheusWidget, LokiWidget],
+ },
+ {
+ label: 'Media',
+ widgets: [JellyfinWidget, NavidromeWidget, RommWidget, ArrCalendarWidget, ArrStatsWidget, QbittorrentWidget],
+ },
+ {
+ label: 'Access',
+ widgets: [AuthentikWidget, VaultwardenWidget],
+ },
+]