frontend

frontend / api/inventory/hooks / useItemSearchQuery

Function: useItemSearchQuery()

useItemSearchQuery(selectedSupplier, searchQuery): UseQueryResult<ItemRef[], Error>

Defined in: src/api/inventory/hooks/useItemSearchQuery.ts:61

Hook to search items with supplier-scoped filtering and type-ahead search. Applies client-side supplier filtering due to backend limitation.

Parameters

selectedSupplier

Currently selected supplier (required for filtering)

null | SupplierOption

searchQuery

string

User's search query (minimum 2 characters to trigger search)

Returns

UseQueryResult<ItemRef[], Error>

React Query result with filtered item options

Enterprise

  • Requires supplier selection first (prevents cross-supplier errors)
  • Minimum 2 characters to trigger search (reduces API load)
  • Client-side supplier filtering (backend doesn't filter properly)
  • Returns placeholder price/quantity (actual values fetched on selection)
  • 30-second cache improves UX during selection

@backend_limitation Backend /api/inventory endpoint ignores supplierId parameter, so we:

  1. Fetch up to 500 items from backend
  2. Apply client-side filtering: item.supplierId === selectedSupplier.id
  3. Return only items belonging to selected supplier

Remarks

The returned ItemOption objects have placeholder values (0) for onHand and price. Fetch full details using useItemDetailsQuery() when user selects an item.

Example

const { data: items, isLoading } = useItemSearchQuery(selectedSupplier, "widget");

<Autocomplete
  options={items || []}
  loading={isLoading}
  getOptionLabel={(opt) => opt.name}
/>