up

frontend/src/components/ClusterGrid.tsx

@@ -113,6 +113,19 @@ function statusFor(p: any): SpotStatusEntry | undefined {
   ];
 }
 
+// statusBadge maps a resolved spot status to a short labelled badge for the
+// Status column, using the same colours as the per-cell fills (NEW DXCC =
+// call cell, NEW BAND = band cell, NEW SLOT = mode cell). Returns null when
+// there's nothing notable to show.
+function statusBadge(s: SpotStatusEntry | undefined): { text: string; fg: string; bg: string } | null {
+  switch (s?.status) {
+    case 'new':      return { text: 'NEW DXCC', fg: '#be123c', bg: '#ffe4e6' };
+    case 'new-band': return { text: 'NEW BAND', fg: '#92400e', bg: '#fde68a' };
+    case 'new-slot': return { text: 'NEW SLOT', fg: '#854d0e', bg: '#fef08a' };
+    default:         return s?.worked_call ? { text: 'WKD CALL', fg: '#0369a1', bg: '#e0f2fe' } : null;
+  }
+}
+
 const COL_CATALOG: ColEntry[] = [
   {
     group: 'Spot', label: 'Time',  colId: 'time',
@@ -136,6 +149,38 @@ const COL_CATALOG: ColEntry[] = [
       return s?.status === 'new' ? `NEW DXCC: ${s?.country ?? ''}` : s?.worked_call ? 'Already worked this call' : undefined;
     },
   },
+  {
+    group: 'Spot', label: 'Status', colId: 'status',
+    headerName: 'Status', width: 96, sortable: true,
+    defaultVisible: true,
+    // Spells out the slot status as a text badge so NEW SLOT (and the others)
+    // is obvious at the row level, not just a single coloured cell.
+    valueGetter: (p: any) => {
+      const s = statusFor(p);
+      if (s?.status === 'new') return 'NEW DXCC';
+      if (s?.status === 'new-band') return 'NEW BAND';
+      if (s?.status === 'new-slot') return 'NEW SLOT';
+      return s?.worked_call ? 'WKD CALL' : '';
+    },
+    cellRenderer: (p: any) => {
+      const b = statusBadge(statusFor(p));
+      if (!b) return <span style={{ color: '#a8a29e', fontSize: 10 }}>—</span>;
+      return (
+        <span style={{
+          backgroundColor: b.bg, color: b.fg, fontWeight: 700, fontSize: 10,
+          padding: '1px 6px', borderRadius: 4, letterSpacing: 0.3, whiteSpace: 'nowrap',
+        }}>{b.text}</span>
+      );
+    },
+    tooltipValueGetter: (p: any) => {
+      const s = statusFor(p);
+      if (s?.status === 'new') return `NEW DXCC: ${s?.country ?? ''}`;
+      if (s?.status === 'new-band') return 'NEW BAND for this entity';
+      if (s?.status === 'new-slot') return 'NEW SLOT (mode not yet worked on this band)';
+      if (s?.worked_call) return 'Already worked this call';
+      return undefined;
+    },
+  },
   {
     group: 'Spot', label: 'POTA', colId: 'pota',
     headerName: 'POTA', field: 'pota_ref' as any, width: 92, cellClass: 'font-mono',