feat: improve driver submission UX across both Add-Ins

Portal Add-In:
- Add 'Driver Submissions' tab showing all submissions with status
- Show linked submission badge in Requests table
- Allow creating report requests directly from submission list
- Add CSS for request options badges

Drive Add-In:
- Show detailed status descriptions (Awaiting Merge, Report Created, etc)
- Display report ID when submission is merged/converted
- Add periodic status refresh from AddInData (60s interval)
- Add 'converted' status type for standalone reports

Author: Steve Hansen

src/FleetClaim.AddIn.React/app/components/App.tsx

@@ -11,13 +11,14 @@ import { useGeotab } from '@/contexts';
 import { useToast } from '@/hooks';
 import { ReportsTab } from './ReportsTab';
 import { RequestsTab } from './RequestsTab';
+import { SubmissionsTab } from './SubmissionsTab';
 import { SettingsTab } from './SettingsTab';
 import { AboutTab } from './AboutTab';
 import { ToastContainer } from './ToastContainer';
 import { NewRequestModal } from './NewRequestModal';
 import '../styles/app.css';
 
-type TabId = 'reports' | 'requests' | 'settings' | 'about';
+type TabId = 'reports' | 'requests' | 'submissions' | 'settings' | 'about';
 
 const App: React.FC = () => {
     const isMobile = useMobile();
@@ -45,13 +46,20 @@ const App: React.FC = () => {
     const [activeTab, setActiveTab] = useState<TabId>('reports');
     const [isNewRequestOpen, setIsNewRequestOpen] = useState(false);
     const [requestsRefreshKey, setRequestsRefreshKey] = useState(0);
+    const [preselectedSubmissionId, setPreselectedSubmissionId] = useState<string | null>(null);
 
     const handleRefresh = useCallback(() => {
         // Will be passed to child components
         toast.info('Refreshing...', 2000);
     }, [toast]);
 
     const handleNewRequest = useCallback(() => {
+        setPreselectedSubmissionId(null);
+        setIsNewRequestOpen(true);
+    }, []);
+
+    const handleCreateRequestFromSubmission = useCallback((submissionId: string) => {
+        setPreselectedSubmissionId(submissionId);
         setIsNewRequestOpen(true);
     }, []);
 
@@ -65,6 +73,7 @@ const App: React.FC = () => {
     const tabs = [
         { id: 'reports', name: 'Reports' },
         { id: 'requests', name: 'Requests' },
+        { id: 'submissions', name: 'Driver Submissions' },
         { id: 'settings', name: 'Settings' },
         { id: 'about', name: 'About' }
     ];
@@ -108,6 +117,9 @@ const App: React.FC = () => {
                 {activeTab === 'requests' && (
                     <RequestsTab key={requestsRefreshKey} onRefresh={handleRefresh} toast={toast} />
                 )}
+                {activeTab === 'submissions' && (
+                    <SubmissionsTab onCreateRequest={handleCreateRequestFromSubmission} toast={toast} />
+                )}
                 {activeTab === 'settings' && (
                     <SettingsTab toast={toast} />
                 )}
@@ -120,6 +132,7 @@ const App: React.FC = () => {
                 isOpen={isNewRequestOpen}
                 onClose={() => setIsNewRequestOpen(false)}
                 onSubmit={handleRequestSubmitted}
+                preselectedSubmissionId={preselectedSubmissionId}
                 toast={toast}
             />
 

src/FleetClaim.AddIn.React/app/components/NewRequestModal.tsx

@@ -15,6 +15,7 @@ interface NewRequestModalProps {
     isOpen: boolean;
     onClose: () => void;
     onSubmit: () => void;
+    preselectedSubmissionId?: string | null;
     toast: {
         success: (msg: string) => void;
         error: (msg: string) => void;
@@ -112,6 +113,7 @@ export const NewRequestModal: React.FC<NewRequestModalProps> = ({
     isOpen,
     onClose,
     onSubmit,
+    preselectedSubmissionId,
     toast
 }) => {
     const { api, devices, loadDevices } = useGeotab();
@@ -145,14 +147,23 @@ export const NewRequestModal: React.FC<NewRequestModalProps> = ({
         if (isOpen && api) {
             setLoadingSubmissions(true);
             loadUnmergedSubmissions(api)
-                .then(setSubmissions)
+                .then(loaded => {
+                    setSubmissions(loaded);
+                    // Auto-select preselected submission
+                    if (preselectedSubmissionId) {
+                        const match = loaded.find(s => s.submission.id === preselectedSubmissionId);
+                        if (match) {
+                            handleSubmissionSelect(preselectedSubmissionId);
+                        }
+                    }
+                })
                 .catch(err => {
                     console.warn('Failed to load submissions:', err);
                     setSubmissions([]);
                 })
                 .finally(() => setLoadingSubmissions(false));
         }
-    }, [isOpen, api]);
+    }, [isOpen, api, preselectedSubmissionId]);
 
     const deviceOptions = useMemo(() => 
         devices.map(d => ({

src/FleetClaim.AddIn.React/app/components/RequestsTab.tsx

@@ -116,14 +116,17 @@ export const RequestsTab: React.FC<RequestsTabProps> = ({ onRefresh, toast }) =>
         {
             id: 'options',
             title: 'Options',
-            meta: { defaultWidth: 100 },
+            meta: { defaultWidth: 140 },
             sortable: false,
             columnComponent: {
                 render: (entity) => (
                     <span className="request-options">
                         {entity.request.forceReport && (
                             <span className="badge" title="Force Report">⚡</span>
                         )}
+                        {entity.request.linkedSubmissionId && (
+                            <span className="badge linked" title={`Linked to driver submission: ${entity.request.linkedSubmissionId}`}>🔗 Driver</span>
+                        )}
                     </span>
                 ),
                 renderHeader: (title) => title