diff --git a/frontend/src/screens/Inbox.jsx b/frontend/src/screens/Inbox.jsx index 0c8e999..1bf403e 100644 --- a/frontend/src/screens/Inbox.jsx +++ b/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}` : ''}`} + {/* Same switch as the Per-page "All" entry below, surfaced at the top of + the queue where the eye actually is. */} + {onToggleShowAll && n === 0 && ( + + )}
{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() + }} /> )}
diff --git a/frontend/src/styles/styles.css b/frontend/src/styles/styles.css index 9969733..5c1803a 100644 --- a/frontend/src/styles/styles.css +++ b/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 {