feat: adding choice for recent qso in main tab

frontend/src/App.tsx

@@ -817,11 +817,11 @@ export default function App() {
   // map ("map1"), the locator street map ("map2"), the cluster grid or the
   // worked-before grid. Per-profile (stored via SetUIPref → profile-prefixed),
   // so it's loaded async on mount and re-read on profile:changed below.
-  type MainPaneKind = 'map1' | 'map2' | 'cluster' | 'worked' | 'flex';
+  type MainPaneKind = 'map1' | 'map2' | 'cluster' | 'worked' | 'flex' | 'recent';
   const [mainPaneLeft, setMainPaneLeft] = useState<MainPaneKind>('map1');
   const [mainPaneRight, setMainPaneRight] = useState<MainPaneKind>('map2');
   const loadMainPanes = useCallback(async () => {
-    const valid = (v: string): v is MainPaneKind => v === 'map1' || v === 'map2' || v === 'cluster' || v === 'worked' || v === 'flex';
+    const valid = (v: string): v is MainPaneKind => v === 'map1' || v === 'map2' || v === 'cluster' || v === 'worked' || v === 'flex' || v === 'recent';
     const [l, r] = await Promise.all([
       GetUIPref('mainPaneLeft').catch(() => ''),
       GetUIPref('mainPaneRight').catch(() => ''),
@@ -2837,6 +2837,28 @@ export default function App() {
             <FlexPanel />
           </div>
         );
+      case 'recent':
+        return (
+          <div className="h-full w-full min-h-0 flex flex-col bg-card border border-border rounded-lg overflow-hidden">
+            <RecentQSOsGrid
+              rows={qsosWithAwards as any}
+              total={total}
+              awardCols={awardCols}
+              onRowDoubleClicked={(q) => openEdit(q.id as number)}
+              onUpdateFromCty={bulkUpdateFromCty}
+              onUpdateFromQRZ={bulkUpdateFromQRZ}
+              onUpdateFromClublog={bulkUpdateFromClublog}
+              onSendTo={bulkSendTo}
+              onSendRecording={bulkSendRecording}
+              onSendEQSL={(ids) => setEqslQsoId(ids[0] ?? null)}
+              onBulkEdit={openBulkEdit}
+              onExportSelected={exportSelectedADIF}
+              onExportFiltered={exportFilteredADIF}
+              onDelete={(ids) => setDeletingIds(ids)}
+              onRowSelected={(ids) => { setSelectedIds(ids); setSelectedId(ids[0] ?? null); }}
+            />
+          </div>
+        );
     }
   };