diff --git a/src/App.tsx b/src/App.tsx index fe5cf2c..86b4e99 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -2,7 +2,10 @@ import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom' import { AuthProvider } from './auth/AuthProvider' import { LoginPage } from './screens/LoginPage' import { ConsoleLayout } from './screens/ConsoleLayout' -import { WorkflowPage } from './screens/WorkflowPage' +import { OrdersPage } from './screens/OrdersPage' +import { CallsPage } from './screens/CallsPage' +import { StoresPage } from './screens/StoresPage' +import { DailyLogsPage } from './screens/DailyLogsPage' function App() { return ( @@ -11,8 +14,17 @@ function App() { } /> }> - } /> - } /> + } /> + } /> + + } /> + } /> + + } /> + } /> + + } /> + } /> } /> diff --git a/src/screens/CallsPage.tsx b/src/screens/CallsPage.tsx new file mode 100644 index 0000000..791c2c3 --- /dev/null +++ b/src/screens/CallsPage.tsx @@ -0,0 +1,27 @@ +import { useNavigate, useParams } from 'react-router-dom'; +import { Modal } from '../components/reusable'; +import { CallsView } from '../components/rv'; +import { CallDetail } from '../components/dv'; + +export function CallsPage() { + const { instanceId } = useParams(); + const navigate = useNavigate(); + + return ( + <> + { + const id = row.instance_id as number | string | undefined; + if (id != null) navigate(`/calls/${id}`); + }} /> + + navigate(`/calls`)} + title={instanceId != null ? `Call #${instanceId}` : undefined} + width="lg" + > + {instanceId != null && } + + + ); +} diff --git a/src/screens/ConsoleLayout.tsx b/src/screens/ConsoleLayout.tsx index c4f0e9d..33980f1 100644 --- a/src/screens/ConsoleLayout.tsx +++ b/src/screens/ConsoleLayout.tsx @@ -6,7 +6,7 @@ import { useAuth } from '../auth/context'; import { onAuthErrorAll, orderBookingClient } from '../api/clients'; import { APP_ID } from '../api/config'; import { Button } from '../components/buttons'; -import { TABS } from './tabs'; +import { SCREENS } from './tabs'; /** Auth-guarded shell: navy top bar + tab nav + routed . */ export function ConsoleLayout() { @@ -25,12 +25,32 @@ export function ConsoleLayout() { if (!authed) return ; return ( -
-
+
+
Krishna Sales Field Sales · Sandbox {APP_ID}
+
{user?.name && {user.name}}
-
- - - +
+
+ +
); diff --git a/src/screens/DailyLogsPage.tsx b/src/screens/DailyLogsPage.tsx new file mode 100644 index 0000000..026a26b --- /dev/null +++ b/src/screens/DailyLogsPage.tsx @@ -0,0 +1,27 @@ +import { useNavigate, useParams } from 'react-router-dom'; +import { Modal } from '../components/reusable'; +import { DailyLogsView } from '../components/rv'; +import { DailyLogDetail } from '../components/dv'; + +export function DailyLogsPage() { + const { instanceId } = useParams(); + const navigate = useNavigate(); + + return ( + <> + { + const id = row.instance_id as number | string | undefined; + if (id != null) navigate(`/daily/${id}`); + }} /> + + navigate(`/daily`)} + title={instanceId != null ? `Daily Log #${instanceId}` : undefined} + width="lg" + > + {instanceId != null && } + + + ); +} diff --git a/src/screens/OrdersPage.tsx b/src/screens/OrdersPage.tsx new file mode 100644 index 0000000..434afb5 --- /dev/null +++ b/src/screens/OrdersPage.tsx @@ -0,0 +1,27 @@ +import { useNavigate, useParams } from 'react-router-dom'; +import { Modal } from '../components/reusable'; +import { OrdersView } from '../components/rv'; +import { OrderDetail } from '../components/dv'; + +export function OrdersPage() { + const { instanceId } = useParams(); + const navigate = useNavigate(); + + return ( + <> + { + const id = row.instance_id as number | string | undefined; + if (id != null) navigate(`/orders/${id}`); + }} /> + + navigate(`/orders`)} + title={instanceId != null ? `Order #${instanceId}` : undefined} + width="lg" + > + {instanceId != null && } + + + ); +} diff --git a/src/screens/StoresPage.tsx b/src/screens/StoresPage.tsx new file mode 100644 index 0000000..53e0f39 --- /dev/null +++ b/src/screens/StoresPage.tsx @@ -0,0 +1,27 @@ +import { useNavigate, useParams } from 'react-router-dom'; +import { Modal } from '../components/reusable'; +import { StoresView } from '../components/rv'; +import { StoreDetail } from '../components/dv'; + +export function StoresPage() { + const { instanceId } = useParams(); + const navigate = useNavigate(); + + return ( + <> + { + const id = row.instance_id as number | string | undefined; + if (id != null) navigate(`/stores/${id}`); + }} /> + + navigate(`/stores`)} + title={instanceId != null ? `Store #${instanceId}` : undefined} + width="lg" + > + {instanceId != null && } + + + ); +} diff --git a/src/screens/WorkflowPage.tsx b/src/screens/WorkflowPage.tsx deleted file mode 100644 index 9e7e7ca..0000000 --- a/src/screens/WorkflowPage.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import { Navigate, useNavigate, useParams } from 'react-router-dom'; -import { Modal } from '../components/reusable'; -import { tabByKey } from './tabs'; - -/** Record view for /:tab, with a deep-linkable detail modal at /:tab/:instanceId. */ -export function WorkflowPage() { - const { tab, instanceId } = useParams(); - const navigate = useNavigate(); - const def = tabByKey(tab); - - // Unknown tab → default to orders. - if (!def) return ; - - const { View, Detail, noun, key } = def; - - return ( - <> - { - const id = row.instance_id as number | string | undefined; - if (id != null) navigate(`/${key}/${id}`); - }} /> - - navigate(`/${key}`)} - title={instanceId != null ? `${noun} #${instanceId}` : undefined} - width="lg" - > - {instanceId != null && } - - - ); -} diff --git a/src/screens/tabs.ts b/src/screens/tabs.ts index 7e7e035..2912e2b 100644 --- a/src/screens/tabs.ts +++ b/src/screens/tabs.ts @@ -14,10 +14,10 @@ import { type WiredDetailViewProps, } from '../components/dv'; -export type TabKey = 'orders' | 'calls' | 'stores' | 'daily'; +export type ScreenKey = 'orders' | 'calls' | 'stores' | 'daily'; -export interface TabDef { - key: TabKey; +export interface ScreenDef { + key: ScreenKey; label: string; icon: LucideIcon; View: (p: WiredRecordViewProps) => React.JSX.Element; @@ -26,13 +26,13 @@ export interface TabDef { noun: string; } -export const TABS: TabDef[] = [ +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 tabByKey(key: string | undefined): TabDef | undefined { - return TABS.find((t) => t.key === key); +export function screenByKey(key: string | undefined): ScreenDef | undefined { + return SCREENS.find((t) => t.key === key); }