@remit/web-client 0.0.17 → 0.0.19

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.17",
+  "version": "0.0.19",
   "type": "module",
   "description": "Remit web client, published as composable primitives — the app shell, auth shells, and runtime config. A distributor imports what it composes and bundles it.",
   "exports": {

package/src/components/layout/MailTopBar.tsx

@@ -9,6 +9,13 @@
  * The actions here are the ones that belong to the app rather than to whatever
  * is currently listed or open — compose, bug report, account. Reply, delete,
  * move and the rest stay on the reading pane's own toolbar, under this bar.
+ *
+ * The field carries one chip: the scope of the view the user navigated into
+ * (`in:spam` in Spam, nothing on the brief). Removing it goes to the brief and
+ * searches everything. Typed `in:`/`from:` terms are not chipped here — they
+ * are already visible as the text the user typed, and chipping them would show
+ * the same term twice in one field; they render as chips over the result
+ * sections instead, where the text is not repeated.
  */
 import type { RemitImapAccountResponse } from "@remit/api-http-client/types.gen.ts";
 import { AppTopBar, Button, SearchBar } from "@remit/ui";
@@ -16,8 +23,16 @@ import { SquarePen } from "lucide-react";
 import { AccountMenu } from "@/auth/AccountMenu";
 import { BugReportButton } from "@/components/ui/BugReportButton";
 import { useGlobalCompose } from "@/hooks/useComposeTarget";
+import { useSearchScope } from "@/hooks/useSearchScope";
 import { tooltipForAction } from "@/lib/keymap";
 import { useMailContext } from "@/lib/mail-context";
+import type { SearchScopeState } from "@/lib/search-scope";
+
+const SEARCH_PLACEHOLDER: Record<SearchScopeState["kind"], string> = {
+	global: "Search all mail",
+	pending: "Search mail",
+	scoped: "Search this folder",
+};
 
 interface MailTopBarProps {
 	accounts: RemitImapAccountResponse[];
@@ -27,6 +42,15 @@ export function MailTopBar({ accounts }: MailTopBarProps) {
 	const { searchInput, onSearchChange, onSearchClear, onSearchClearQuery } =
 		useMailContext();
 	const compose = useGlobalCompose(accounts);
+	const { scope, clearScope } = useSearchScope(accounts);
+	const chips =
+		scope.kind === "scoped"
+			? [{ id: scope.chip.id, label: scope.chip.label, tone: "scope" as const }]
+			: undefined;
+	// Only the brief may claim to search all mail. A mailbox route whose name has
+	// not loaded yet has no chip to show but is already narrowed, so it gets the
+	// neutral wording rather than a placeholder that asserts the wrong scope.
+	const placeholder = SEARCH_PLACEHOLDER[scope.kind];
 
 	return (
 		<AppTopBar
@@ -41,7 +65,9 @@ export function MailTopBar({ accounts }: MailTopBarProps) {
 					onChange={onSearchChange}
 					onClear={onSearchClear}
 					onClearQuery={onSearchClearQuery}
-					placeholder="Search all mail"
+					chips={chips}
+					onRemoveChip={clearScope}
+					placeholder={placeholder}
 					size="lg"
 				/>
 			}

package/src/components/mail/DailyBrief.tsx

@@ -40,6 +40,7 @@ import { useNavigate } from "@tanstack/react-router";
 import { AlertCircle, RefreshCw, Sparkles } from "lucide-react";
 import { useCallback, useMemo, useState } from "react";
 import { useIsDesktop } from "@/hooks/useMediaQuery";
+import { useSearchTokenContext } from "@/hooks/useSearchTokenContext";
 import { useSemanticSearch } from "@/hooks/useSemanticSearch";
 import { sortAccountsByCreatedAt } from "@/lib/account-order";
 import {
@@ -168,7 +169,8 @@ export function DailyBrief({
 	onSelectMessage,
 	onSelectSearchResult,
 }: DailyBriefProps) {
-	const { searchQuery, mailboxNameIndex, accountNameIndex } = useMailContext();
+	const { searchQuery } = useMailContext();
+	const tokenContext = useSearchTokenContext();
 	const isDesktop = useIsDesktop();
 
 	const nonMuted = useMemo(
@@ -259,7 +261,7 @@ export function DailyBrief({
 
 	const { freeText: sq, tokens: queryTokens } = parseSearchTokens(
 		searchQuery.trim().toLowerCase(),
-		{ mailboxesByName: mailboxNameIndex, accountsByName: accountNameIndex },
+		tokenContext,
 	);
 
 	// Convert API rows to ThreadRowData, narrowing only by the selected account

package/src/components/mail/FlaggedList.tsx

@@ -22,6 +22,7 @@ import {
 import { useCallback, useMemo, useState } from "react";
 import { formatErrorMessage } from "@/components/ui/ErrorState";
 import { useIsDesktop } from "@/hooks/useMediaQuery";
+import { useSearchTokenContext } from "@/hooks/useSearchTokenContext";
 import { useStarredThreads } from "@/hooks/useStarredThreads";
 import {
 	matchesBriefSearch,
@@ -49,7 +50,8 @@ export function FlaggedList({
 	selectedMessageId,
 	onSelectMessage,
 }: FlaggedListProps) {
-	const { searchQuery, mailboxNameIndex, accountNameIndex } = useMailContext();
+	const { searchQuery } = useMailContext();
+	const tokenContext = useSearchTokenContext();
 	const isDesktop = useIsDesktop();
 
 	const [selectedCategory, setSelectedCategory] = useState("all");
@@ -84,7 +86,7 @@ export function FlaggedList({
 
 	const { freeText: sq, tokens: queryTokens } = parseSearchTokens(
 		searchQuery.trim().toLowerCase(),
-		{ mailboxesByName: mailboxNameIndex, accountsByName: accountNameIndex },
+		tokenContext,
 	);
 
 	const rows = useMemo<ThreadRowData[]>(() => {

package/src/components/mail/MailListHeader.tsx

@@ -14,11 +14,13 @@
  * `SearchResults` sections under the shared `FilterSheet`. Consumers feed the
  * filter chrome and query-narrowed results; both tiers render identical rows.
  *
- * Results split into two sections: "Top matches" (literal/instant search) and
- * "Related" (semantic). The consumer dedupes them — a thread in both appears
- * only under "Top matches". Each loads independently; an empty section drops out
- * kit-side, so a "Related"-only result still shows when the literal search finds
- * nothing. The hamburger opens the nav drawer via the enclosing `AppShellSlotted`.
+ * Results split into two sections, one per engine: literal/instant and semantic.
+ * The consumer dedupes them — a thread in both appears only under the literal
+ * section — and names them, so a view whose engines reach different mail says so
+ * ("In Archive" / "Everywhere"). Each loads independently; an empty section
+ * drops out kit-side, so a semantic-only result still shows when the literal
+ * search finds nothing. The hamburger opens the nav drawer via the enclosing
+ * `AppShellSlotted`.
  */
 import {
 	FilterSheet,
@@ -30,8 +32,9 @@ import {
 	SearchResults,
 	useAppShellLayout,
 } from "@remit/ui";
-import { type ReactNode, useState } from "react";
+import { type ReactNode, useEffect, useRef, useState } from "react";
 import { isSinglePaneTier, useLayoutTier } from "@/hooks/useLayoutTier";
+import { useSearchTokenContext } from "@/hooks/useSearchTokenContext";
 import { useMailContext } from "@/lib/mail-context";
 import { loadRecentSearches, saveRecentSearch } from "@/lib/recent-searches";
 import {
@@ -56,6 +59,13 @@ interface MailListHeaderProps {
 	relatedResults?: SearchResult[];
 	relatedLoading?: boolean;
 	onSelectSearchResult?: (result: SearchResult) => void;
+	/**
+	 * Section headings. A view whose two engines cover different ground names
+	 * them by that ground ("In Archive" / "Everywhere") so the reach of a result
+	 * is on screen rather than inferred.
+	 */
+	searchResultsLabel?: string;
+	relatedResultsLabel?: string;
 }
 
 export function MailListHeader({
@@ -69,32 +79,40 @@ export function MailListHeader({
 	relatedResults,
 	relatedLoading,
 	onSelectSearchResult,
+	searchResultsLabel = "Top matches",
+	relatedResultsLabel = "Related",
 }: MailListHeaderProps) {
-	const {
-		searchInput,
-		onSearchChange,
-		onSearchClear,
-		mailboxNameIndex,
-		accountNameIndex,
-	} = useMailContext();
+	const { searchInput, onSearchChange, onSearchClear, searchViewKey } =
+		useMailContext();
+	const tokenContext = useSearchTokenContext();
 	const layout = useAppShellLayout();
 	const tier = useLayoutTier();
 	const [searchOpen, setSearchOpen] = useState(false);
 	const [recentSearches, setRecentSearches] = useState(loadRecentSearches);
 
+	// Leaving the view ends the search: the shell drops the query, and the chrome
+	// it opened — the phone takeover, the expanded tablet field — closes with it
+	// rather than sitting there empty over the new mailbox (#47).
+	const searchViewRef = useRef(searchViewKey);
+	useEffect(() => {
+		if (searchViewRef.current === searchViewKey) return;
+		searchViewRef.current = searchViewKey;
+		setSearchOpen(false);
+	}, [searchViewKey]);
+
 	const hasQuery = searchInput.trim().length > 0;
-	// Filter tokens (`from:`, `has:attachment`, `in:`, `account:`, …) parsed live
-	// from the typed query render as removable chips above the sections;
-	// removing one edits the query text directly, which re-parses on the next
-	// render. `in:`/`account:` resolve against the shared name indexes so a
-	// chip only appears for a name that actually matches a mailbox/account.
-	const tokenChips = parseSearchTokens(searchInput, {
-		mailboxesByName: mailboxNameIndex,
-		accountsByName: accountNameIndex,
-	}).tokens.map((token) => ({
-		label: searchTokenLabel(token),
-		onRemove: () => onSearchChange(removeSearchToken(searchInput, token)),
-	}));
+	// Filter tokens (`from:`, `has:attachment`, `account:`, …) parsed live from
+	// the typed query render as removable chips above the sections; removing one
+	// edits the query text directly, which re-parses on the next render. The
+	// parse runs through `useSearchTokenContext`, the same one the engines use,
+	// so a chip appears only for a term that is actually being applied — on a
+	// scoped view `in:` is not resolved and so is never chipped here.
+	const tokenChips = parseSearchTokens(searchInput, tokenContext).tokens.map(
+		(token) => ({
+			label: searchTokenLabel(token),
+			onRemove: () => onSearchChange(removeSearchToken(searchInput, token)),
+		}),
+	);
 	const topMatches = searchResults ?? [];
 	const related = relatedResults ?? [];
 	// Always offer both sections while a query is present; the kit drops the empty
@@ -102,8 +120,8 @@ export function MailListHeader({
 	// state. The empty-query case (recent searches) is the kit's job.
 	const sections: SearchResultSection[] = hasQuery
 		? [
-				{ id: "top", label: "Top matches", results: topMatches },
-				{ id: "related", label: "Related", results: related },
+				{ id: "top", label: searchResultsLabel, results: topMatches },
+				{ id: "related", label: relatedResultsLabel, results: related },
 			]
 		: [];
 	// Skeleton only while nothing is in yet — once either section has rows, show

package/src/components/mail/MailSidebarAdapter.tsx

@@ -291,8 +291,17 @@ export function MailSidebarAdapter({
 	};
 
 	const handleSelectNav = () => {
-		// Navigation is handled by the router <Link>; this only runs the
-		// post-selection side effect (drawer auto-close on mobile).
+		// Navigation is handled by the router <Link>; this runs the
+		// post-selection side effects.
+		//
+		// Clearing the field is one of them. Every link above drops `q`, and the
+		// shell re-seeds the field from the destination's `q` when the view
+		// changes — but picking the folder you are already in is the same view,
+		// so the shell leaves the field alone and the previous query would sit in
+		// the bar over a list that no longer has it in the URL. Selecting a nav
+		// entry is an unambiguous "show me this", so it clears here regardless.
+		// It is a user action, not a mirror, so it cannot race in-flight typing.
+		onSearchChange("");
 		onMailboxSelect?.();
 	};
 

package/src/components/mail/MailViewChrome.tsx

@@ -41,6 +41,9 @@ interface MailViewChromeProps {
 	relatedResults?: SearchResult[];
 	relatedLoading?: boolean;
 	onSelectSearchResult?: (result: SearchResult) => void;
+	/** Section headings; see `MailListHeader`. */
+	searchResultsLabel?: string;
+	relatedResultsLabel?: string;
 }
 
 export function MailViewChrome({
@@ -60,6 +63,8 @@ export function MailViewChrome({
 	relatedResults,
 	relatedLoading,
 	onSelectSearchResult,
+	searchResultsLabel,
+	relatedResultsLabel,
 }: MailViewChromeProps) {
 	const [expanded, setExpanded] = useState(false);
 
@@ -88,6 +93,8 @@ export function MailViewChrome({
 			relatedResults={relatedResults}
 			relatedLoading={relatedLoading}
 			onSelectSearchResult={onSelectSearchResult}
+			searchResultsLabel={searchResultsLabel}
+			relatedResultsLabel={relatedResultsLabel}
 		>
 			<FilterSheet {...filterConfig}>{children}</FilterSheet>
 		</MailListHeader>

package/src/components/mail/MailboxPane.tsx

@@ -88,6 +88,7 @@ import { useMailboxAccount } from "@/hooks/useMailboxAccount";
 import { useToggleReadFor } from "@/hooks/useMarkAsRead";
 import { useMoveMessages } from "@/hooks/useMoveMessages";
 import { useRescueCandidates } from "@/hooks/useRescueCandidates";
+import { useSearchTokenContext } from "@/hooks/useSearchTokenContext";
 import { useSemanticSearch } from "@/hooks/useSemanticSearch";
 import { useToggleStar } from "@/hooks/useToggleStar";
 import { useTriageKeyboard } from "@/hooks/useTriageKeyboard";
@@ -247,28 +248,25 @@ function MailboxPaneProvider({
 	const telemetry = useTelemetry();
 	const {
 		accounts,
-		mailboxNameIndex,
-		accountNameIndex,
 		searchQuery,
 		searchInput,
 		intelligenceOpen,
 		onToggleIntelligence,
 		onSetIntelligenceOpen,
 	} = useMailContext();
+	const tokenContext = useSearchTokenContext();
 
 	const normalizedSearchQuery = normalizeSearchQuery(searchQuery);
 	const hasSearchQuery = normalizedSearchQuery.length > 0;
 	// Filter tokens (`from:`, `has:attachment`, `is:unread`) narrow this literal
 	// search to the params `threadOperationsSearchThreads` supports; `before:`/
 	// `after:`/`account:` have no equivalent on this endpoint and are left for
-	// the semantic section only (see `useSemanticSearch`). `in:` is likewise not
-	// applied here — this view is already scoped to one mailbox by its route —
-	// but still needs the name-index context so a resolved `in:`/`account:`
-	// token is stripped from `freeText` instead of leaking into the literal
-	// query text as a stray word.
+	// the semantic section only (see `useSemanticSearch`). `in:` never reaches
+	// here at all: this view is scoped to one mailbox by its route, so
+	// `useSearchTokenContext` does not resolve the term and it stays free text.
 	const { freeText, tokens: searchTokens } = parseSearchTokens(
 		normalizedSearchQuery,
-		{ mailboxesByName: mailboxNameIndex, accountsByName: accountNameIndex },
+		tokenContext,
 	);
 	const fromToken = searchTokens.find((t) => t.type === "from");
 	const searchThreadsQuery = {
@@ -949,10 +947,14 @@ function MailboxList() {
 		() => threads.map(threadToSearchResult),
 		[threads],
 	);
-	// "Related" (semantic) is scoped to this mailbox and deduped against the
-	// literal "Top matches" by thread, so a thread never shows in both.
+	// The route scopes this view, and the top bar's chip says so. Both sections
+	// are named by the ground they cover so that scope is never overstated: the
+	// literal engine searches this mailbox and nothing else (there is no
+	// cross-mailbox thread search), while the semantic engine runs unscoped and
+	// its section says "Everywhere" (#47). Reaching past the folder is a labelled
+	// section, not a silent widening of the chip. Results are deduped by thread,
+	// so a thread never shows in both.
 	const { hits: semanticHits, isLoading: relatedLoading } = useSemanticSearch({
-		mailboxId,
 		filterCategory,
 	});
 	const relatedResults = useMemo(
@@ -967,7 +969,10 @@ function MailboxList() {
 		(result: SearchResult) =>
 			navigate({
 				to: "/mail/$mailboxId",
-				params: { mailboxId },
+				// A hit from the unscoped "Everywhere" section lives in another
+				// mailbox; open it there, so the list, the toolbar's verbs and the
+				// message all belong to the same mailbox.
+				params: { mailboxId: result.mailboxId ?? mailboxId },
 				search: (prev: Record<string, unknown>) => ({
 					...prev,
 					// Commit the active query alongside the selection. The debounced
@@ -1061,6 +1066,8 @@ function MailboxList() {
 			relatedResults={relatedResults}
 			relatedLoading={relatedLoading}
 			onSelectSearchResult={handleSelectSearchResult}
+			searchResultsLabel={`In ${listTitle}`}
+			relatedResultsLabel="Everywhere"
 		>
 			{body}
 		</MailViewChrome>

package/src/components/mail/OutboxPane.tsx

@@ -46,8 +46,16 @@ import { MessageBody } from "@/components/mail/MessageBody";
 import { NavMenuButton } from "@/components/mail/NavMenuButton";
 import { useErrorBanners } from "@/components/ui/ErrorBannerProvider";
 import { buildMutationErrorBanner } from "@/components/ui/error-banners";
+import { useSearchTokenContext } from "@/hooks/useSearchTokenContext";
 import { formatDate as formatLocaleDate, toDate } from "@/lib/format";
+import { useMailContext } from "@/lib/mail-context";
+import {
+	matchesOutboxSearch,
+	outboxQueryIsUnsupported,
+} from "@/lib/outbox-search";
 import { isOutboxListRow, isUnsendableStatus } from "@/lib/outbox-status";
+import { normalizeSearchQuery } from "@/lib/search-query";
+import { parseSearchTokens } from "@/lib/search-tokens";
 import { cn } from "@/lib/utils";
 
 /* ------------------------------------------------------------------ */
@@ -103,12 +111,31 @@ const formatRecipients = (message: RemitImapOutboxMessageResponse): string => {
 	return `${recipients[0]} +${recipients.length - 1}`;
 };
 
+/**
+ * What an empty outbox list says. A query that filtered everything out reads
+ * differently from an empty outbox, and a query the outbox cannot serve at all
+ * has to say so rather than look like a search that found nothing.
+ */
+const outboxEmptyMessage = (
+	hasQuery: boolean,
+	unsupportedQuery: boolean,
+): string => {
+	if (unsupportedQuery) return "The outbox cannot filter on those terms";
+	if (hasQuery) return "No matching outbox messages";
+	return "No outbox messages";
+};
+
 /* ------------------------------------------------------------------ */
 /* Context                                                              */
 /* ------------------------------------------------------------------ */
 
 interface OutboxPaneContextValue {
+	/** Outbox rows, narrowed by the search query when one is active. */
 	messages: RemitImapOutboxMessageResponse[];
+	/** True while a query is narrowing `messages` — the empty state differs. */
+	hasQuery: boolean;
+	/** True when that query asks for a filter the outbox cannot apply. */
+	unsupportedQuery: boolean;
 	isLoading: boolean;
 	selectedMessageId: string | undefined;
 	selectedMessage: RemitImapOutboxMessageResponse | undefined;
@@ -143,6 +170,20 @@ function OutboxPaneProvider({ children }: OutboxPaneProps) {
 		outboxOperationsListOutboxMessagesOptions(),
 	);
 
+	// The top bar's field scopes to this view (`in:outbox`), so a query typed
+	// here narrows these rows. The list is small and already fully loaded, so
+	// the narrowing is a filter over what is in hand — see lib/outbox-search.ts
+	// for which fields it matches and why the filter tokens are not honored.
+	// The query is parsed the same way every other engine parses it, and only
+	// the free text is used: `Q3 from:billing` still matches on "Q3" rather
+	// than searching the rows for the literal string "from:billing".
+	const { searchQuery } = useMailContext();
+	const tokenContext = useSearchTokenContext();
+	const normalizedQuery = normalizeSearchQuery(searchQuery);
+	const parsedQuery = parseSearchTokens(normalizedQuery, tokenContext);
+	const hasQuery = normalizedQuery.length > 0;
+	const unsupportedQuery = outboxQueryIsUnsupported(parsedQuery);
+
 	// Outbox surfaces in-flight + actionable rows only. `draft` lives in the
 	// Drafts view; `sent` rows are deleted by the IMAP append handler once
 	// the message lands in Sent (issue #178), but we filter defensively so a
@@ -150,10 +191,12 @@ function OutboxPaneProvider({ children }: OutboxPaneProps) {
 	// has not completed yet (issue #193).
 	const messages = useMemo(
 		() =>
-			(outboxResponse?.items ?? []).filter((item) =>
-				isOutboxListRow(item.status),
-			),
-		[outboxResponse],
+			unsupportedQuery
+				? []
+				: (outboxResponse?.items ?? [])
+						.filter((item) => isOutboxListRow(item.status))
+						.filter((item) => matchesOutboxSearch(item, parsedQuery.freeText)),
+		[outboxResponse, parsedQuery.freeText, unsupportedQuery],
 	);
 
 	const selectedMessage = useMemo(
@@ -176,6 +219,8 @@ function OutboxPaneProvider({ children }: OutboxPaneProps) {
 
 	const ctx: OutboxPaneContextValue = {
 		messages,
+		hasQuery,
+		unsupportedQuery,
 		isLoading,
 		selectedMessageId,
 		selectedMessage,
@@ -381,8 +426,14 @@ function OutboxMessageDetail({ message, onBack }: OutboxMessageDetailProps) {
  * Outbox list with datum bar header. Mount in the `list` slot of `AppShellSlotted`.
  */
 function OutboxList() {
-	const { messages, isLoading, selectedMessageId, onSelectMessage } =
-		useOutboxPane();
+	const {
+		messages,
+		hasQuery,
+		unsupportedQuery,
+		isLoading,
+		selectedMessageId,
+		onSelectMessage,
+	} = useOutboxPane();
 
 	if (isLoading) {
 		return (
@@ -395,7 +446,10 @@ function OutboxList() {
 	if (messages.length === 0) {
 		return (
 			<div className="flex h-full bg-surface">
-				<ReadingPaneEmpty message="No outbox messages" showHints={false} />
+				<ReadingPaneEmpty
+					message={outboxEmptyMessage(hasQuery, unsupportedQuery)}
+					showHints={false}
+				/>
 			</div>
 		);
 	}
@@ -462,6 +516,8 @@ function OutboxReading() {
 function OutboxPhone() {
 	const {
 		messages,
+		hasQuery,
+		unsupportedQuery,
 		isLoading,
 		selectedMessageId,
 		selectedMessage,
@@ -488,7 +544,10 @@ function OutboxPhone() {
 	if (messages.length === 0) {
 		return (
 			<div className="flex h-full bg-surface">
-				<ReadingPaneEmpty message="No outbox messages" showHints={false} />
+				<ReadingPaneEmpty
+					message={outboxEmptyMessage(hasQuery, unsupportedQuery)}
+					showHints={false}
+				/>
 			</div>
 		);
 	}

package/src/hooks/useSearchScope.ts

@@ -0,0 +1,49 @@
+import type { RemitImapAccountResponse } from "@remit/api-http-client/types.gen.ts";
+import { useNavigate, useRouterState } from "@tanstack/react-router";
+import { useCallback } from "react";
+import { useMailContext } from "@/lib/mail-context";
+import {
+	SEARCH_SCOPE_CHIP_ID,
+	type SearchScopeState,
+	searchScopeForRoute,
+} from "@/lib/search-scope";
+import { useCurrentMailboxName } from "./useCurrentMailboxName";
+
+/**
+ * The scope chip for the active route and the way off it.
+ *
+ * `clearScope` navigates to the daily brief carrying the current query, which
+ * is what "search everything" means here — the brief is the unscoped
+ * cross-account view. It is a navigation rather than a query edit because the
+ * chip mirrors the route (see `lib/search-scope.ts`); editing the text would
+ * leave the chip in place and the list still narrowed.
+ */
+export function useSearchScope(accounts: RemitImapAccountResponse[]): {
+	scope: SearchScopeState;
+	clearScope: (chipId: string) => void;
+} {
+	const navigate = useNavigate();
+	const { searchInput } = useMailContext();
+	const mailboxName = useCurrentMailboxName({ accounts });
+	// Select the matches, not the scope: a select closing over `mailboxName`
+	// only re-runs on router state changes, so the chip would keep reading the
+	// previous folder until the next navigation.
+	const matches = useRouterState({ select: (s) => s.matches });
+	const scope = searchScopeForRoute(matches, mailboxName);
+
+	// Takes the chip id the field removed rather than assuming which chip that
+	// was. The bar owns one chip today; keying on the id means a second one
+	// added later cannot silently drop the user out of their scope.
+	const clearScope = useCallback(
+		(chipId: string) => {
+			if (chipId !== SEARCH_SCOPE_CHIP_ID) return;
+			navigate({
+				to: "/mail",
+				search: { q: searchInput || undefined, selectedMessageId: undefined },
+			});
+		},
+		[navigate, searchInput],
+	);
+
+	return { scope, clearScope };
+}

package/src/hooks/useSearchTokenContext.ts

@@ -0,0 +1,28 @@
+import { useRouterState } from "@tanstack/react-router";
+import { useMailContext } from "@/lib/mail-context";
+import { isScopedRoute } from "@/lib/search-scope";
+import type { SearchTokenContext } from "@/lib/search-tokens";
+
+/**
+ * The one context every search engine parses the query through.
+ *
+ * `in:` is recognized only where the route carries no scope. On a scoped view
+ * the top bar's chip already answers "which mailbox", and a typed `in:` is a
+ * second, competing answer that no engine there acts on — the literal search is
+ * pinned to the route's mailbox and the semantic request takes the caller's
+ * scope. Leaving the term unresolved means it stays ordinary words: it is
+ * matched as text and never chipped, so the field can't advertise a filter that
+ * does nothing. To search another folder, drop the scope chip or go to it.
+ *
+ * Every call site takes this hook rather than building its own context, because
+ * the guarantee is that they agree. Two of them disagreeing is what made the
+ * same query behave one way on `/mail/flagged` and another on a mailbox.
+ */
+export function useSearchTokenContext(): SearchTokenContext {
+	const { mailboxNameIndex, accountNameIndex } = useMailContext();
+	const scoped = useRouterState({ select: (s) => isScopedRoute(s.matches) });
+	return {
+		...(scoped ? {} : { mailboxesByName: mailboxNameIndex }),
+		accountsByName: accountNameIndex,
+	};
+}

package/src/hooks/useSemanticSearch.ts

@@ -5,6 +5,7 @@ import { useQuery } from "@tanstack/react-query";
 import { useMailContext } from "@/lib/mail-context";
 import { normalizeSearchQuery } from "@/lib/search-query";
 import { parseSearchTokens } from "@/lib/search-tokens";
+import { useSearchTokenContext } from "./useSearchTokenContext";
 
 /** Cap the "Related" section; the literal "Top matches" is the primary surface. */
 const SEMANTIC_RESULT_LIMIT = 20;
@@ -44,9 +45,14 @@ interface UseSemanticSearchParams {
  * account filter) — both still render as chips and narrow the literal engine,
  * but never reach the semantic request (`account:` is a documented gap, see
  * doc/design/flows/06-search.md — the semantic index is per account config).
- * `in:` resolves to a mailboxId and, when present, overrides the caller's
- * `mailboxId` — so typing `in:archive` re-scopes the semantic search to that
- * mailbox even from the cross-account daily brief.
+ * `in:` resolves to a mailboxId, so typing `in:archive` re-scopes the search
+ * from the unscoped daily brief. It cannot contradict a scoped view because
+ * `useSearchTokenContext` does not resolve the term there at all — the term
+ * stays free text and no engine, and no chip, treats it as a filter.
+ *
+ * Without a `mailboxId` the request spans every mailbox of every account the
+ * caller owns: the backend partitions the vector index by accountConfigId (one
+ * per signed-in user, not per mail account), so unscoped is genuinely global.
  */
 export function useSemanticSearch({
 	mailboxId,
@@ -55,12 +61,10 @@ export function useSemanticSearch({
 	hits: RemitImapSemanticSearchResult[];
 	isLoading: boolean;
 } {
-	const { searchQuery, mailboxNameIndex, accountNameIndex } = useMailContext();
+	const { searchQuery } = useMailContext();
+	const tokenContext = useSearchTokenContext();
 	const normalizedQuery = normalizeSearchQuery(searchQuery);
-	const { freeText, tokens } = parseSearchTokens(normalizedQuery, {
-		mailboxesByName: mailboxNameIndex,
-		accountsByName: accountNameIndex,
-	});
+	const { freeText, tokens } = parseSearchTokens(normalizedQuery, tokenContext);
 	const enabled = normalizedQuery.length > 0;
 
 	const category = toCategoryParam(filterCategory);
@@ -71,7 +75,7 @@ export function useSemanticSearch({
 	const afterToken = tokens.find((t) => t.type === "after");
 	const beforeToken = tokens.find((t) => t.type === "before");
 	const inToken = tokens.find((t) => t.type === "in");
-	const effectiveMailboxId = inToken?.mailboxId ?? mailboxId;
+	const effectiveMailboxId = mailboxId ?? inToken?.mailboxId;
 
 	const { data, isLoading } = useQuery({
 		...semanticSearchOperationsSemanticSearchOptions({

package/src/lib/mail-context.ts

@@ -23,8 +23,14 @@ export interface MailContextValue {
 	mailboxNameIndex: ReadonlyMap<string, string>;
 	accountNameIndex: ReadonlyMap<string, string>;
 	searchQuery: string;
-	/** Live (pre-debounce) search input — the toolbar's search field binds this. */
+	/** Live (pre-debounce) search input — the search field binds this. */
 	searchInput: string;
+	/**
+	 * Identity of the view the current search belongs to (`lib/mail-route.ts`).
+	 * It changes when the user leaves that view, which is when search ends: the
+	 * query re-seeds from the new URL and any search chrome collapses (#47).
+	 */
+	searchViewKey: string;
 	onSearchChange: (query: string) => void;
 	/** Full clear (X button): drops the query and any selected thread (#538). */
 	onSearchClear: () => void;
@@ -53,6 +59,7 @@ export const useMailContext = (): MailContextValue => {
 			accountNameIndex: new Map(),
 			searchQuery: "",
 			searchInput: "",
+			searchViewKey: "",
 			onSearchChange: () => {},
 			onSearchClear: () => {},
 			onSearchClearQuery: () => {},