Merge pull request 'Inbox: surface the All toggle at the top of the queue' (#52) from Talha into main

frontend/src/screens/Inbox.jsx

@@ -607,7 +607,7 @@ const READ_TICK_MS = 1000
  * `rows` rather than a count, because the bar needs each row's read state, and
  * `selectedIds` narrows it to what the selected pair of buttons would touch.
  */
-function BulkReadBar({ rows, selection, onSetRead, onSetAllRead, busy, canEdit, scopeLabel }) {
+function BulkReadBar({ rows, selection, onSetRead, onSetAllRead, busy, canEdit, scopeLabel, showAll, onToggleShowAll, tabTotal }) {
   const { selectedIds, toggleAll, clear, allSelected } = selection
   const n = selectedIds.size
   const total = rows.length
@@ -658,6 +658,17 @@ function BulkReadBar({ rows, selection, onSetRead, onSetAllRead, busy, canEdit,
           ? `${n} selected`
           : `${total}${unreadCount ? ` · ${unreadCount}` : ''}`}
       </span>
+      {/* Same switch as the Per-page "All" entry below, surfaced at the top of
+          the queue where the eye actually is. */}
+      {onToggleShowAll && n === 0 && (
+        <button
+          className={`btn btn-sm ${showAll ? 'btn-primary' : 'btn-secondary'}`}
+          title={showAll ? 'Back to paged view' : `Show all ${tabTotal || ''} in one list`}
+          onClick={onToggleShowAll}
+        >
+          {showAll ? 'Show paged' : `Show all${tabTotal ? ` (${tabTotal})` : ''}`}
+        </button>
+      )}
       <div className="inbox-bulk-actions">
         {n > 0 ? (
           <>
@@ -1112,6 +1123,14 @@ export default function Inbox() {
                   busy={setRead.isPending || setReadAll.isPending}
                   canEdit={canEdit}
                   scopeLabel={scopeLabel}
+                  showAll={showAll}
+                  tabTotal={total}
+                  onToggleShowAll={() => {
+                    setPageSize(showAll ? DEFAULT_PAGE_SIZE : 'all')
+                    setSkip(0)
+                    setSelectedId(null)
+                    selection.clear()
+                  }}
                 />
               )}
               <div style={{ padding: '12px 16px', borderBottom: '1px solid var(--border)' }}>

frontend/src/styles/styles.css

@@ -1084,7 +1084,10 @@ canvas { width: 100%; max-width: 100%; display: block; }
   gap: 8px;
   padding: 8px 12px;
   border-bottom: 1px solid var(--border);
-  flex-wrap: nowrap;
+  /* wrap: the Show all toggle joined the row, and in the 34%-wide split
+     column the four controls no longer fit on one line at laptop widths. */
+  flex-wrap: wrap;
+  row-gap: 6px;
   min-width: 0;
 }
 .inbox-bulk-count {
@@ -1582,6 +1585,7 @@ canvas { width: 100%; max-width: 100%; display: block; }
   /* When the Ask button wraps under the input, let it take the full row. */
   .ask-form .btn { flex: 1 1 auto; }
 
+
   /* Find Talent: stack the toolbar controls edge to edge. */
   .talent-controls .tc-job, .talent-controls .tc-loc,
   .talent-controls .tc-custom, .talent-controls .btn {