import { Store, Phone, ShoppingCart, ClipboardList, type LucideIcon } from 'lucide-react';
import {
  OrdersView,
  CallsView,
  StoresView,
  DailyLogsView,
  type WiredRecordViewProps,
} from '../components/rv';
import {
  OrderDetail,
  CallDetail,
  StoreDetail,
  DailyLogDetail,
  type WiredDetailViewProps,
} from '../components/dv';

export type ScreenKey = 'orders' | 'calls' | 'stores' | 'daily';

export interface ScreenDef {
  key: ScreenKey;
  label: string;
  icon: LucideIcon;
  View: (p: WiredRecordViewProps) => React.JSX.Element;
  Detail: (p: WiredDetailViewProps) => React.JSX.Element;
  /** Singular noun for the detail title. */
  noun: string;
}

export const SCREENS: ScreenDef[] = [
  { key: 'orders', label: 'Orders', icon: ShoppingCart, View: OrdersView, Detail: OrderDetail, noun: 'Order' },
  { key: 'calls', label: 'Calls', icon: Phone, View: CallsView, Detail: CallDetail, noun: 'Call' },
  { key: 'stores', label: 'Stores', icon: Store, View: StoresView, Detail: StoreDetail, noun: 'Store' },
  { key: 'daily', label: 'Daily Logs', icon: ClipboardList, View: DailyLogsView, Detail: DailyLogDetail, noun: 'Daily Log' },
];

export function screenByKey(key: string | undefined): ScreenDef | undefined {
  return SCREENS.find((t) => t.key === key);
}