configurable Dashboard.tsx

src/components/Dashboard/Dashboard.models.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+
+export type DashboardMode = "expense" | "income";
+export type DashboardPeriod = "rolling" | "calendar";
+
+export interface DashboardState {
+  mode: DashboardMode;
+  period: DashboardPeriod;
+  comparison: boolean;
+}
+
+export interface DashboardSection {
+  id: string;
+  title?: string;
+  summary?: string;
+  component: React.ComponentType<any>;
+  dataKey?: string;
+  settings?: Record<string, any>;
+  isList?: boolean;
+  style?: {
+    size?: number;
+    [key: string]: any;
+  };
+}
+
+export interface DashboardConfig {
+  sections: DashboardSection[];
+  style?: {
+    palette: Record<DashboardMode, {
+      primary: string;
+      light: string;
+      dark: string;
+      text: string;
+    }>;
+  };
+}
+
+export interface DashboardProps {
+  config: DashboardConfig;
+  data: any; // Aggregated data from features
+  latest: any[]; // Latest items from features
+  onModeChange?: (mode: DashboardMode) => void;
+}