Kalana B. Thilakarathna
29f181d5e1
- Added `react-grid-layout` for drag-and-drop functionality. - Created `DashboardCanvas` component to manage layout and widget interactions. - Introduced `WidgetContainer` and `WidgetPicker` components for widget management. - Implemented various widgets: Active Rides, Today Sales, Pending Purchase Orders, Stock Alerts, Recent Orders, and Loading Sheets. - Integrated API calls for fetching and saving dashboard preferences. - Defined default layouts for different user roles. - Created a card component for consistent widget styling.
98 lines
2.8 KiB
TypeScript
98 lines
2.8 KiB
TypeScript
import type { ComponentType } from 'react'
|
|
import type { Role } from '@/contexts/auth-context'
|
|
|
|
import { ActiveRidesWidget } from '@/components/dashboard/widgets/active-rides-widget'
|
|
import { TodaySalesWidget } from '@/components/dashboard/widgets/today-sales-widget'
|
|
import { PendingPOsWidget } from '@/components/dashboard/widgets/pending-pos-widget'
|
|
import { StockAlertsWidget } from '@/components/dashboard/widgets/stock-alerts-widget'
|
|
import { RecentOrdersWidget } from '@/components/dashboard/widgets/recent-orders-widget'
|
|
import { LoadingSheetsWidget } from '@/components/dashboard/widgets/loading-sheets-widget'
|
|
|
|
export interface WidgetDefinition {
|
|
type: string
|
|
label: string
|
|
description: string
|
|
defaultW: number
|
|
defaultH: number
|
|
minW: number
|
|
minH: number
|
|
maxW?: number
|
|
allowedRoles: Role[] | '*'
|
|
component: ComponentType
|
|
}
|
|
|
|
export const WIDGET_REGISTRY: Record<string, WidgetDefinition> = {
|
|
'active-rides': {
|
|
type: 'active-rides',
|
|
label: 'Active Rides',
|
|
description: 'Live view of all currently active rides with driver and route info.',
|
|
defaultW: 4,
|
|
defaultH: 4,
|
|
minW: 3,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'warehouse'],
|
|
component: ActiveRidesWidget,
|
|
},
|
|
'today-sales': {
|
|
type: 'today-sales',
|
|
label: "Today's Sales",
|
|
description: "Total revenue and sales counts for today.",
|
|
defaultW: 4,
|
|
defaultH: 4,
|
|
minW: 2,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'sales'],
|
|
component: TodaySalesWidget,
|
|
},
|
|
'pending-purchase-orders': {
|
|
type: 'pending-purchase-orders',
|
|
label: 'Pending Purchase Orders',
|
|
description: 'Purchase orders that have been issued but not yet fully received.',
|
|
defaultW: 4,
|
|
defaultH: 4,
|
|
minW: 3,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'warehouse'],
|
|
component: PendingPOsWidget,
|
|
},
|
|
'stock-alerts': {
|
|
type: 'stock-alerts',
|
|
label: 'Stock Alerts',
|
|
description: 'Items at zero or critically low stock levels across all locations.',
|
|
defaultW: 4,
|
|
defaultH: 4,
|
|
minW: 3,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'warehouse'],
|
|
component: StockAlertsWidget,
|
|
},
|
|
'recent-orders': {
|
|
type: 'recent-orders',
|
|
label: 'Recent Orders',
|
|
description: 'Latest customer orders with status and value.',
|
|
defaultW: 5,
|
|
defaultH: 4,
|
|
minW: 4,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'sales'],
|
|
component: RecentOrdersWidget,
|
|
},
|
|
'loading-sheets': {
|
|
type: 'loading-sheets',
|
|
label: 'Pending Loading Sheets',
|
|
description: 'Loading sheets awaiting dispatch confirmation.',
|
|
defaultW: 4,
|
|
defaultH: 4,
|
|
minW: 3,
|
|
minH: 3,
|
|
allowedRoles: ['admin', 'warehouse'],
|
|
component: LoadingSheetsWidget,
|
|
},
|
|
}
|
|
|
|
export function getWidgetsForRole(role: Role): WidgetDefinition[] {
|
|
return Object.values(WIDGET_REGISTRY).filter(def =>
|
|
def.allowedRoles === '*' || def.allowedRoles.includes(role)
|
|
)
|
|
}
|