fix(work-orders): scope keyword search to the week and keep filters global

Show the Searching within [week] indicator while a keyword is typed and
stop sending the week-scoped keyword to Advanced Filters search. Refs SH-194.
This commit is contained in:
Codex Review Integration 2026-09-16 11:01:34 -03:00
parent fc3e7591dc
commit aa583858ba
5 changed files with 146 additions and 9 deletions

View file

@ -5,6 +5,8 @@ import { ToolbarButton } from "@/components/ui/toolbar-button";
type WorkOrdersListHeaderProps = {
search: string;
/** Compact label of the active board week (e.g. "5/4–5/8"). */
weekLabel: string;
onSearchChange: (value: string) => void;
/** Omit until Advanced Search slice mounts the sheet. */
onOpenAdvancedFilters?: () => void;
@ -16,6 +18,7 @@ type WorkOrdersListHeaderProps = {
export function WorkOrdersListHeader({
search,
weekLabel,
onSearchChange,
onOpenAdvancedFilters,
onNewWorkOrder,
@ -24,12 +27,24 @@ export function WorkOrdersListHeader({
}: WorkOrdersListHeaderProps) {
return (
<>
<SearchInput
value={search}
onChange={onSearchChange}
placeholder="Search this week…"
aria-label="Search work orders"
/>
<div className="relative">
<SearchInput
value={search}
onChange={onSearchChange}
placeholder="Search this week…"
aria-label="Search work orders"
/>
{/* SH-194: keyword search is scoped to the active week; make that scope visible. */}
{search.trim() !== "" && Boolean(weekLabel) && (
<span
role="status"
className="absolute left-0 whitespace-nowrap"
style={{ top: "calc(100% + 4px)", fontSize: 11, color: "var(--muted-foreground)" }}
>
Searching within {weekLabel}
</span>
)}
</div>
{Boolean(onOpenAdvancedFilters) && (
<ToolbarButton

View file

@ -33,7 +33,8 @@ export function useWorkOrdersBoardSource(filters: FiltersReturn): WorkOrdersBoar
() =>
buildResolvedBoardSearchParams({
advApplied: filters.advApplied,
search: filters.search,
// SH-194: Advanced Filters are global by design; the week-scoped keyword box has no effect.
search: "",
page: filters.page,
pageSize: filters.pageSize,
sortBy: filters.sortBy,
@ -43,7 +44,6 @@ export function useWorkOrdersBoardSource(filters: FiltersReturn): WorkOrdersBoar
}),
[
filters.advApplied,
filters.search,
filters.page,
filters.pageSize,
filters.sortBy,

View file

@ -43,6 +43,7 @@ export default function WorkOrdersListPage() {
actions={
<WorkOrdersListHeader
search={filters.search}
weekLabel={filters.weekLabel}
onSearchChange={filters.handleSearchChange}
onOpenAdvancedFilters={() => filters.setAdvOpen(true)}
onNewWorkOrder={() => page.setWizardOpen(true)}

View file

@ -189,7 +189,12 @@ vi.mock("@/app/(protected)/workorders/_components/list/table/wo-table", () => ({
describe("WorkOrdersListHeader slice affordances", () => {
it("hides New WO and Advanced Filters when callbacks are omitted", () => {
renderWithProviders(
<WorkOrdersListHeader search="" onSearchChange={vi.fn()} activeFilterCount={0} />,
<WorkOrdersListHeader
search=""
weekLabel="5/4–5/8"
onSearchChange={vi.fn()}
activeFilterCount={0}
/>,
{ withAuth: false },
);
@ -202,6 +207,7 @@ describe("WorkOrdersListHeader slice affordances", () => {
renderWithProviders(
<WorkOrdersListHeader
search=""
weekLabel="5/4–5/8"
onSearchChange={vi.fn()}
onNewWorkOrder={vi.fn()}
onOpenAdvancedFilters={vi.fn()}

View file

@ -0,0 +1,115 @@
import { act, renderHook, screen, waitFor } from "@testing-library/react";
import { QueryClientProvider } from "@tanstack/react-query";
import type { ReactNode } from "react";
import { beforeEach, describe, expect, it, vi } from "vitest";
import { EMPTY_ADVANCED_FILTERS } from "@/domain/work-orders/types/work-order-advanced-filters";
import { createTestQueryClient, renderWithProviders } from "@/test/test-utils";
const { searchBoard, getBoard, emptyList } = vi.hoisted(() => ({
searchBoard: vi.fn(),
getBoard: vi.fn(),
emptyList: [] as const,
}));
vi.mock("@/hooks/use-debounce", () => ({
useDebounce: <T,>(value: T) => value,
}));
vi.mock("@/domain/work-orders/api/work-orders-api", () => ({
workOrdersApi: {
searchBoard: (...args: unknown[]) => searchBoard(...args),
getBoard: (...args: unknown[]) => getBoard(...args),
},
}));
vi.mock("@/domain/work-orders/use-cases/use-work-order-detail", () => ({
useWorkOrderLocations: () => ({ data: emptyList }),
useWorkOrderVendors: () => ({ data: emptyList }),
}));
import { WorkOrdersListHeader } from "@/app/(protected)/workorders/_components/list/work-orders-list-header";
import { useWorkOrdersBoardSource } from "@/app/(protected)/workorders/_hooks/use-work-orders-board-source";
import { useWorkOrdersListFilters } from "@/app/(protected)/workorders/_hooks/use-work-orders-list-filters";
const EMPTY_RESULT = { items: [], totalCount: 0, page: 0, pageSize: 25 };
function useBoardWithFilters() {
const filters = useWorkOrdersListFilters();
useWorkOrdersBoardSource(filters);
return filters;
}
function renderBoardSource() {
const client = createTestQueryClient();
const wrapper = ({ children }: { children: ReactNode }) => (
<QueryClientProvider client={client}>{children}</QueryClientProvider>
);
return renderHook(() => useBoardWithFilters(), { wrapper });
}
describe("SH-194 keyword search scope indicator", () => {
it("shows no scope badge while the search box is empty", () => {
renderWithProviders(
<WorkOrdersListHeader
search=""
weekLabel="5/4–5/8"
onSearchChange={vi.fn()}
activeFilterCount={0}
/>,
{ withAuth: false },
);
expect(screen.queryByText(/searching within/i)).not.toBeInTheDocument();
});
it("names the active week while a keyword is typed", () => {
renderWithProviders(
<WorkOrdersListHeader
search="hvac"
weekLabel="5/4–5/8"
onSearchChange={vi.fn()}
activeFilterCount={0}
/>,
{ withAuth: false },
);
expect(screen.getByText("Searching within 5/4–5/8")).toBeInTheDocument();
});
});
describe("SH-194 keyword search vs Advanced Filters scope", () => {
beforeEach(() => {
searchBoard.mockReset().mockResolvedValue(EMPTY_RESULT);
getBoard.mockReset().mockResolvedValue(EMPTY_RESULT);
});
it("scopes keyword search to the active week", async () => {
const { result } = renderBoardSource();
act(() => {
result.current.setWeekMonday("2026-05-04");
result.current.handleSearchChange("hvac");
});
await waitFor(() =>
expect(getBoard).toHaveBeenCalledWith(
expect.objectContaining({ weekStart: "2026-05-04", weekEnd: "2026-05-08", search: "hvac" }),
),
);
expect(searchBoard).not.toHaveBeenCalled();
});
it("keeps Advanced Filters global and ignores the week-scoped keyword", async () => {
const { result } = renderBoardSource();
act(() => {
result.current.handleSearchChange("hvac");
result.current.applyAdvancedFilters({ ...EMPTY_ADVANCED_FILTERS, rescheduled: true });
});
await waitFor(() => expect(searchBoard).toHaveBeenCalled());
const params = searchBoard.mock.lastCall?.[0] as Record<string, unknown>;
expect(params.search).toBeUndefined();
expect(params).not.toHaveProperty("weekStart");
});
});