729 lines
25 KiB
TypeScript
729 lines
25 KiB
TypeScript
import { useState, useEffect } from 'react';
|
|
import { BrowserRouter, Routes, Route, useNavigate, Outlet } from 'react-router-dom';
|
|
import { PageLayout } from '@/components/layout/PageLayout';
|
|
import { Dashboard } from '@/pages/Dashboard';
|
|
import { OpenRequests } from '@/pages/OpenRequests';
|
|
import { ClosedRequests } from '@/pages/ClosedRequests';
|
|
import { RequestDetail } from '@/pages/RequestDetail';
|
|
import { SharedSummaries } from '@/pages/SharedSummaries/SharedSummaries';
|
|
import { SharedSummaryDetail } from '@/pages/SharedSummaries/SharedSummaryDetail';
|
|
import { WorkNotes } from '@/pages/WorkNotes';
|
|
import { CreateRequest } from '@/pages/CreateRequest';
|
|
import { ClaimManagementWizard } from '@/components/workflow/ClaimManagementWizard';
|
|
import { MyRequests } from '@/pages/MyRequests';
|
|
import { Requests } from '@/pages/Requests/Requests';
|
|
import { UserAllRequests } from '@/pages/Requests/UserAllRequests';
|
|
import { useAuth, hasManagementAccess } from '@/contexts/AuthContext';
|
|
import { ApproverPerformance } from '@/pages/ApproverPerformance/ApproverPerformance';
|
|
import { Profile } from '@/pages/Profile';
|
|
import { Settings } from '@/pages/Settings';
|
|
import { Notifications } from '@/pages/Notifications';
|
|
import { DetailedReports } from '@/pages/DetailedReports';
|
|
import { Admin } from '@/pages/Admin';
|
|
import { AdminTemplatesList } from '@/pages/Admin/Templates/AdminTemplatesList';
|
|
import { CreateTemplate } from '@/pages/Admin/Templates/CreateTemplate';
|
|
import { CreateAdminRequest } from '@/pages/CreateAdminRequest/CreateAdminRequest';
|
|
import { ApprovalActionModal } from '@/components/modals/ApprovalActionModal';
|
|
import { Toaster } from '@/components/ui/sonner';
|
|
import { toast } from 'sonner';
|
|
import { CUSTOM_REQUEST_DATABASE } from '@/utils/customRequestDatabase';
|
|
import { CLAIM_MANAGEMENT_DATABASE } from '@/utils/claimManagementDatabase';
|
|
import { AuthCallback } from '@/pages/Auth/AuthCallback';
|
|
|
|
// Combined Request Database for backward compatibility
|
|
// This combines both custom and claim management requests
|
|
export const REQUEST_DATABASE: any = {
|
|
...CUSTOM_REQUEST_DATABASE,
|
|
...CLAIM_MANAGEMENT_DATABASE
|
|
};
|
|
|
|
interface AppProps {
|
|
onLogout?: () => void;
|
|
}
|
|
|
|
// Component to conditionally render Admin or User All Requests screen
|
|
// This ensures that when navigating from the sidebar, the correct screen is shown based on user role
|
|
function RequestsRoute({ onViewRequest }: { onViewRequest: (requestId: string) => void }) {
|
|
const { user } = useAuth();
|
|
const isAdmin = hasManagementAccess(user);
|
|
|
|
// Render separate screens based on user role
|
|
// Admin/Management users see all organization requests
|
|
// Regular users see only their participant requests (approver/spectator, NOT initiator)
|
|
if (isAdmin) {
|
|
return <Requests onViewRequest={onViewRequest} />;
|
|
} else {
|
|
return <UserAllRequests onViewRequest={onViewRequest} />;
|
|
}
|
|
}
|
|
|
|
// Main Application Routes Component
|
|
function AppRoutes({ onLogout }: AppProps) {
|
|
const navigate = useNavigate();
|
|
const [approvalAction, setApprovalAction] = useState<'approve' | 'reject' | null>(null);
|
|
const [dynamicRequests, setDynamicRequests] = useState<any[]>([]);
|
|
const [selectedRequestId, setSelectedRequestId] = useState<string>('');
|
|
const [selectedRequestTitle, setSelectedRequestTitle] = useState<string>('');
|
|
|
|
// Retrieve dynamic requests from localStorage on mount
|
|
useEffect(() => {
|
|
const storedRequests = localStorage.getItem('dynamicRequests');
|
|
if (storedRequests) {
|
|
try {
|
|
const parsed = JSON.parse(storedRequests);
|
|
setDynamicRequests(parsed);
|
|
} catch (error) {
|
|
console.error('Error parsing dynamic requests:', error);
|
|
}
|
|
}
|
|
}, []);
|
|
|
|
// Sync dynamic requests to localStorage whenever they change
|
|
useEffect(() => {
|
|
if (dynamicRequests.length > 0) {
|
|
localStorage.setItem('dynamicRequests', JSON.stringify(dynamicRequests));
|
|
}
|
|
}, [dynamicRequests]);
|
|
|
|
const handleNavigate = (page: string) => {
|
|
// Handle special routes
|
|
if (page === 'profile') {
|
|
navigate('/profile');
|
|
return;
|
|
}
|
|
if (page === 'settings') {
|
|
navigate('/settings');
|
|
return;
|
|
}
|
|
// If page already starts with '/', use it directly (e.g., '/requests?status=approved')
|
|
// Otherwise, add leading slash (e.g., 'open-requests' -> '/open-requests')
|
|
if (page.startsWith('/')) {
|
|
navigate(page);
|
|
} else {
|
|
navigate(`/${page}`);
|
|
}
|
|
};
|
|
|
|
const handleViewRequest = async (requestId: string, requestTitle?: string, status?: string) => {
|
|
setSelectedRequestId(requestId);
|
|
setSelectedRequestTitle(requestTitle || 'Unknown Request');
|
|
|
|
// Check if request is a draft - if so, route to edit form instead of detail view
|
|
const isDraft = status?.toLowerCase() === 'draft' || status === 'DRAFT';
|
|
if (isDraft) {
|
|
navigate(`/edit-request/${requestId}`);
|
|
} else {
|
|
navigate(`/request/${requestId}`);
|
|
}
|
|
};
|
|
|
|
const handleBack = () => {
|
|
navigate(-1);
|
|
};
|
|
|
|
const handleNewRequest = () => {
|
|
navigate('/new-request');
|
|
};
|
|
|
|
const handleNewRequestSubmit = (requestData: any) => {
|
|
// Check if this is a template selection (from Existing Template button)
|
|
if (requestData.templateType) {
|
|
// Navigate to the specific template wizard
|
|
if (requestData.templateType === 'claim-management') {
|
|
navigate('/claim-management');
|
|
}
|
|
return;
|
|
}
|
|
|
|
// Regular custom request submission
|
|
// Generate unique ID for the new custom request
|
|
const requestId = `RE-REQ-2024-${String(Object.keys(CUSTOM_REQUEST_DATABASE).length + dynamicRequests.length + 1).padStart(3, '0')}`;
|
|
|
|
// Create full custom request object
|
|
const newCustomRequest = {
|
|
id: requestId,
|
|
title: requestData.title,
|
|
description: requestData.description || '',
|
|
category: requestData.category || 'General',
|
|
subcategory: requestData.subcategory || '',
|
|
status: 'pending',
|
|
priority: requestData.priority || 'standard',
|
|
amount: requestData.budget || 'N/A',
|
|
slaProgress: 0,
|
|
slaRemaining: '5 days',
|
|
slaEndDate: new Date(Date.now() + 5 * 24 * 60 * 60 * 1000).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true }),
|
|
currentStep: 1,
|
|
totalSteps: requestData.approvers?.length || 1,
|
|
currentApprover: requestData.approvers?.[0]?.name || requestData.approvers?.[0]?.email?.split('@')[0] || 'Pending Assignment',
|
|
approverLevel: `1 of ${requestData.approvers?.length || 1}`,
|
|
template: 'custom',
|
|
initiator: {
|
|
name: 'Current User',
|
|
role: requestData.initiatorRole || 'Employee',
|
|
department: requestData.department || 'General',
|
|
email: 'current.user@royalenfield.com',
|
|
phone: '+91 98765 43290',
|
|
avatar: 'CU'
|
|
},
|
|
department: requestData.department || 'General',
|
|
createdAt: new Date().toLocaleDateString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: true
|
|
}),
|
|
updatedAt: new Date().toLocaleDateString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: true
|
|
}),
|
|
dueDate: new Date(Date.now() + 5 * 24 * 60 * 60 * 1000).toISOString(),
|
|
submittedDate: new Date().toISOString(),
|
|
estimatedCompletion: new Date(Date.now() + 5 * 24 * 60 * 60 * 1000).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }),
|
|
conclusionRemark: '',
|
|
approvalFlow: (requestData.approvers || []).filter((a: any) => a).map((approver: any, index: number) => {
|
|
// Extract name from email if name is not available
|
|
const approverName = approver?.name || approver?.email?.split('@')[0] || `Approver ${index + 1}`;
|
|
const approverEmail = approver?.email || '';
|
|
|
|
return {
|
|
step: index + 1,
|
|
approver: `${approverName}${approverEmail ? ` (${approverEmail})` : ''}`,
|
|
role: approver?.role || `Level ${approver?.level || index + 1} Approver`,
|
|
status: index === 0 ? 'pending' : 'waiting',
|
|
tatHours: approver?.tat ? (typeof approver.tat === 'string' ? parseInt(approver.tat) : approver.tat) : 48,
|
|
elapsedHours: index === 0 ? 0 : 0,
|
|
assignedAt: index === 0 ? new Date().toISOString() : null,
|
|
comment: null,
|
|
timestamp: null
|
|
};
|
|
}),
|
|
documents: [],
|
|
spectators: (requestData.spectators || [])
|
|
.filter((s: any) => s && (s.name || s.email))
|
|
.map((spectator: any) => {
|
|
const name = spectator?.name || spectator?.email?.split('@')[0] || 'Observer';
|
|
return {
|
|
name: name,
|
|
role: spectator?.role || spectator?.department || 'Observer',
|
|
avatar: name.split(' ').map((n: string) => n[0]).join('').toUpperCase().slice(0, 2) || 'OB'
|
|
};
|
|
}),
|
|
auditTrail: [
|
|
{
|
|
type: 'created',
|
|
action: 'Request Created',
|
|
details: `Custom request "${requestData.title}" created`,
|
|
user: 'Current User',
|
|
timestamp: new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true })
|
|
},
|
|
{
|
|
type: 'assignment',
|
|
action: 'Assigned to Approver',
|
|
details: `Request assigned to ${requestData.approvers?.[0]?.name || requestData.approvers?.[0]?.email || 'first approver'}`,
|
|
user: 'System',
|
|
timestamp: new Date().toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true })
|
|
}
|
|
],
|
|
tags: requestData.tags || ['custom-request']
|
|
};
|
|
|
|
// Add to dynamic requests
|
|
setDynamicRequests([...dynamicRequests, newCustomRequest]);
|
|
|
|
navigate('/my-requests');
|
|
};
|
|
|
|
const handleApprovalSubmit = (action: 'approve' | 'reject', _comment: string) => {
|
|
return new Promise((resolve) => {
|
|
setTimeout(() => {
|
|
if (action === 'approve') {
|
|
toast.success('Request Approved', {
|
|
description: 'The request has been approved and forwarded to the next step.',
|
|
duration: 5000,
|
|
});
|
|
} else {
|
|
toast.error('Request Rejected', {
|
|
description: 'The request has been rejected and returned to the initiator.',
|
|
duration: 5000,
|
|
});
|
|
}
|
|
|
|
setApprovalAction(null);
|
|
resolve(true);
|
|
}, 1000);
|
|
});
|
|
};
|
|
|
|
const handleCloseApprovalModal = () => {
|
|
setApprovalAction(null);
|
|
};
|
|
|
|
const handleClaimManagementSubmit = (claimData: any) => {
|
|
// Generate unique ID for the new claim request
|
|
const requestId = `RE-REQ-2024-CM-${String(dynamicRequests.length + 2).padStart(3, '0')}`;
|
|
|
|
// Create full request object
|
|
const newRequest = {
|
|
id: requestId,
|
|
title: `${claimData.activityName} - Claim Request`,
|
|
description: claimData.requestDescription,
|
|
category: 'Dealer Operations',
|
|
subcategory: 'Claim Management',
|
|
status: 'pending',
|
|
priority: 'standard',
|
|
amount: 'TBD',
|
|
slaProgress: 0,
|
|
slaRemaining: '7 days',
|
|
slaEndDate: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString(),
|
|
currentStep: 1,
|
|
totalSteps: 8,
|
|
templateType: 'claim-management',
|
|
templateName: 'Claim Management',
|
|
initiator: {
|
|
name: 'Current User',
|
|
role: 'Regional Marketing Coordinator',
|
|
department: 'Marketing',
|
|
email: 'current.user@royalenfield.com',
|
|
phone: '+91 98765 43290',
|
|
avatar: 'CU'
|
|
},
|
|
department: 'Marketing',
|
|
createdAt: new Date().toLocaleString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: true
|
|
}),
|
|
updatedAt: new Date().toLocaleString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: true
|
|
}),
|
|
dueDate: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString(),
|
|
conclusionRemark: '',
|
|
claimDetails: {
|
|
activityName: claimData.activityName,
|
|
activityType: claimData.activityType,
|
|
activityDate: claimData.activityDate ? new Date(claimData.activityDate).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }) : '',
|
|
location: claimData.location,
|
|
dealerCode: claimData.dealerCode,
|
|
dealerName: claimData.dealerName,
|
|
dealerEmail: claimData.dealerEmail || 'N/A',
|
|
dealerPhone: claimData.dealerPhone || 'N/A',
|
|
dealerAddress: claimData.dealerAddress || 'N/A',
|
|
requestDescription: claimData.requestDescription,
|
|
estimatedBudget: claimData.estimatedBudget || 'TBD',
|
|
periodStart: claimData.periodStartDate ? new Date(claimData.periodStartDate).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }) : '',
|
|
periodEnd: claimData.periodEndDate ? new Date(claimData.periodEndDate).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' }) : ''
|
|
},
|
|
approvalFlow: claimData.workflowSteps || [
|
|
{
|
|
step: 1,
|
|
approver: `${claimData.dealerName} (Dealer)`,
|
|
role: 'Dealer - Document Upload',
|
|
status: 'pending',
|
|
tatHours: 72,
|
|
elapsedHours: 0,
|
|
assignedAt: new Date().toISOString(),
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Dealer uploads proposal document, cost breakup, timeline for closure, and other supporting documents'
|
|
},
|
|
{
|
|
step: 2,
|
|
approver: 'Current User (Initiator)',
|
|
role: 'Initiator Evaluation',
|
|
status: 'waiting',
|
|
tatHours: 48,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Initiator reviews dealer documents and approves or requests modifications'
|
|
},
|
|
{
|
|
step: 3,
|
|
approver: 'System Auto-Process',
|
|
role: 'IO Confirmation',
|
|
status: 'waiting',
|
|
tatHours: 1,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Automatic IO (Internal Order) confirmation generated upon initiator approval'
|
|
},
|
|
{
|
|
step: 4,
|
|
approver: 'Rajesh Kumar',
|
|
role: 'Department Lead Approval',
|
|
status: 'waiting',
|
|
tatHours: 72,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Department head approves and blocks budget in IO for this activity'
|
|
},
|
|
{
|
|
step: 5,
|
|
approver: `${claimData.dealerName} (Dealer)`,
|
|
role: 'Dealer - Completion Documents',
|
|
status: 'waiting',
|
|
tatHours: 120,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Dealer submits activity completion documents and description'
|
|
},
|
|
{
|
|
step: 6,
|
|
approver: 'Current User (Initiator)',
|
|
role: 'Initiator Verification',
|
|
status: 'waiting',
|
|
tatHours: 48,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Initiator verifies completion documents and can modify approved amount'
|
|
},
|
|
{
|
|
step: 7,
|
|
approver: 'System Auto-Process',
|
|
role: 'E-Invoice Generation',
|
|
status: 'waiting',
|
|
tatHours: 1,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Auto-generate e-invoice based on final approved amount'
|
|
},
|
|
{
|
|
step: 8,
|
|
approver: 'Finance Team',
|
|
role: 'Credit Note Issuance',
|
|
status: 'waiting',
|
|
tatHours: 48,
|
|
elapsedHours: 0,
|
|
assignedAt: null,
|
|
comment: null,
|
|
timestamp: null,
|
|
description: 'Finance team issues credit note to dealer'
|
|
}
|
|
],
|
|
documents: [],
|
|
spectators: [],
|
|
auditTrail: [
|
|
{
|
|
type: 'created',
|
|
action: 'Request Created',
|
|
details: `Claim request for ${claimData.activityName} created`,
|
|
user: 'Current User',
|
|
timestamp: new Date().toLocaleString('en-US', {
|
|
month: 'short',
|
|
day: 'numeric',
|
|
year: 'numeric',
|
|
hour: 'numeric',
|
|
minute: 'numeric',
|
|
hour12: true
|
|
})
|
|
}
|
|
],
|
|
tags: ['claim-management', 'new-request', claimData.activityType?.toLowerCase().replace(/\s+/g, '-')]
|
|
};
|
|
|
|
// Add to dynamic requests
|
|
setDynamicRequests(prev => [...prev, newRequest]);
|
|
|
|
// Also add to REQUEST_DATABASE for immediate viewing
|
|
(REQUEST_DATABASE as any)[requestId] = newRequest;
|
|
|
|
toast.success('Claim Request Submitted', {
|
|
description: 'Your claim management request has been created successfully.',
|
|
});
|
|
navigate('/my-requests');
|
|
};
|
|
|
|
return (
|
|
<div className="min-h-screen h-screen flex flex-col overflow-hidden bg-background">
|
|
<Routes>
|
|
{/* Auth Callback - Must be before other routes */}
|
|
<Route
|
|
path="/login/callback"
|
|
element={<AuthCallback />}
|
|
/>
|
|
|
|
{/* Dashboard */}
|
|
<Route
|
|
path="/"
|
|
element={
|
|
<PageLayout currentPage="dashboard" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Dashboard onNavigate={handleNavigate} onNewRequest={handleNewRequest} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
<Route
|
|
path="/dashboard"
|
|
element={
|
|
<PageLayout currentPage="dashboard" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Dashboard onNavigate={handleNavigate} onNewRequest={handleNewRequest} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Admin Routes Group with Shared Layout */}
|
|
<Route
|
|
element={
|
|
<PageLayout currentPage="admin-templates" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Outlet />
|
|
</PageLayout>
|
|
}
|
|
>
|
|
<Route path="/admin/create-template" element={<CreateTemplate />} />
|
|
<Route path="/admin/edit-template/:templateId" element={<CreateTemplate />} />
|
|
<Route path="/admin/templates" element={<AdminTemplatesList />} />
|
|
</Route>
|
|
|
|
{/* Create Request from Admin Template (Dedicated Flow) */}
|
|
<Route
|
|
path="/create-admin-request/:templateId"
|
|
element={
|
|
<CreateAdminRequest />
|
|
}
|
|
/>
|
|
|
|
<Route
|
|
path="/admin"
|
|
element={
|
|
<PageLayout currentPage="admin" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Admin />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Open Requests */}
|
|
<Route
|
|
path="/open-requests"
|
|
element={
|
|
<PageLayout currentPage="open-requests" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<OpenRequests onViewRequest={handleViewRequest} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Closed Requests */}
|
|
<Route
|
|
path="/closed-requests"
|
|
element={
|
|
<PageLayout currentPage="closed-requests" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<ClosedRequests onViewRequest={handleViewRequest} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Shared Summaries */}
|
|
<Route
|
|
path="/shared-summaries"
|
|
element={
|
|
<PageLayout currentPage="shared-summaries" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<SharedSummaries />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Shared Summary Detail */}
|
|
<Route
|
|
path="/shared-summaries/:sharedSummaryId"
|
|
element={
|
|
<PageLayout currentPage="shared-summaries" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<SharedSummaryDetail />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* My Requests */}
|
|
<Route
|
|
path="/my-requests"
|
|
element={
|
|
<PageLayout currentPage="my-requests" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<MyRequests onViewRequest={handleViewRequest} dynamicRequests={dynamicRequests} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Requests - Separate screens for Admin and Regular Users */}
|
|
<Route
|
|
path="/requests"
|
|
element={
|
|
<PageLayout currentPage="requests" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<RequestsRoute onViewRequest={handleViewRequest} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Approver Performance - Detailed Performance Analysis */}
|
|
<Route
|
|
path="/approver-performance"
|
|
element={
|
|
<PageLayout currentPage="approver-performance" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<ApproverPerformance />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Request Detail - requestId will be read from URL params */}
|
|
<Route
|
|
path="/request/:requestId"
|
|
element={
|
|
<PageLayout currentPage="request-detail" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<RequestDetail
|
|
requestId=""
|
|
onBack={handleBack}
|
|
dynamicRequests={dynamicRequests}
|
|
/>
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Work Notes - Dedicated Full-Screen Page */}
|
|
<Route
|
|
path="/work-notes/:requestId"
|
|
element={<WorkNotes />}
|
|
/>
|
|
|
|
{/* New Request (Custom) */}
|
|
<Route
|
|
path="/new-request"
|
|
element={
|
|
<CreateRequest
|
|
onBack={handleBack}
|
|
onSubmit={handleNewRequestSubmit}
|
|
/>
|
|
}
|
|
/>
|
|
|
|
{/* Edit Draft Request */}
|
|
<Route
|
|
path="/edit-request/:requestId"
|
|
element={
|
|
<CreateRequest
|
|
onBack={handleBack}
|
|
onSubmit={handleNewRequestSubmit}
|
|
requestId={undefined} // Will be read from URL params
|
|
isEditMode={true}
|
|
/>
|
|
}
|
|
/>
|
|
|
|
{/* Claim Management Wizard */}
|
|
<Route
|
|
path="/claim-management"
|
|
element={
|
|
<ClaimManagementWizard
|
|
onBack={handleBack}
|
|
onSubmit={handleClaimManagementSubmit}
|
|
/>
|
|
}
|
|
/>
|
|
|
|
{/* Profile */}
|
|
<Route
|
|
path="/profile"
|
|
element={
|
|
<PageLayout currentPage="profile" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Profile />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Settings */}
|
|
<Route
|
|
path="/settings"
|
|
element={
|
|
<PageLayout currentPage="settings" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Settings />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Notifications */}
|
|
<Route
|
|
path="/notifications"
|
|
element={
|
|
<PageLayout currentPage="notifications" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<Notifications onNavigate={handleNavigate} />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
{/* Detailed Reports */}
|
|
<Route
|
|
path="/detailed-reports"
|
|
element={
|
|
<PageLayout currentPage="detailed-reports" onNavigate={handleNavigate} onNewRequest={handleNewRequest} onLogout={onLogout}>
|
|
<DetailedReports />
|
|
</PageLayout>
|
|
}
|
|
/>
|
|
|
|
|
|
|
|
|
|
</Routes>
|
|
|
|
<Toaster
|
|
position="top-right"
|
|
toastOptions={{
|
|
style: {
|
|
background: 'var(--card)',
|
|
color: 'var(--card-foreground)',
|
|
border: '1px solid var(--border)',
|
|
},
|
|
}}
|
|
/>
|
|
|
|
{/* Approval Action Modal */}
|
|
{approvalAction && (
|
|
<ApprovalActionModal
|
|
isOpen={!!approvalAction}
|
|
onClose={handleCloseApprovalModal}
|
|
action={approvalAction}
|
|
requestId={selectedRequestId}
|
|
requestTitle={selectedRequestTitle}
|
|
onSubmit={handleApprovalSubmit}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// Main App Component with Router
|
|
interface MainAppProps {
|
|
onLogout?: () => void;
|
|
}
|
|
|
|
export default function App(props?: MainAppProps) {
|
|
const { onLogout } = props || {};
|
|
|
|
return (
|
|
<BrowserRouter>
|
|
<AppRoutes onLogout={onLogout} />
|
|
</BrowserRouter>
|
|
);
|
|
}
|