State persistence
View sourceuseBcGridState wires every controlled-state dimension a typical ERP grid consumer would otherwise hand-roll — sort, filter, search, selection, range, expansion, grouping, columnState, page, pageSize, sidebar — and round-trips them through localStorage with one prop.
Tweak sort / filter / group / pin — settings persist to localStorage. Reload the page (Cmd+R) and they come back.
Try this
The grid persists every interaction to localStorage immediately. Reload the page; the layout comes back.
- Sort by Customer; press Cmd+R — sort persists.
- Apply a Status filter; reload — filter persists.
- Group by Region, drag-resize a column, hide one — all persist.
- Click Clear + reload to wipe and start fresh.
- Different
gridIdvalues write to different storage keys — two grids on the same page have independent state.
What useBcGridState owns
- ~13 controlled-state dimensions. sort, filter, search, selection, rangeSelection, expansion, groupBy, pivotState, columnState, activeCell, page, pageSize, sidebarPanel.
- A single bound props object.
<BcGrid {...grid.props} columns={...} data={...} rowId={...} />. That replaces the ~30 lines of useState + onChange wiring most consumers had. - Imperative dispatch.
grid.dispatch.setSort(...)for cases where the host needs to drive a dimension externally — saved-view picker, URL hydration, "Clear filters" button outside the grid. - Defaults.
useBcGridState({ defaults: { pageSize: 50 } }). Applied when the user has no persisted value for that dimension yet.
The persistTo target
- local:<gridId> — the only built-in target today. Writes go to
window.localStorageunder keys prefixed by the gridId so multiple grids round-trip independently. - SSR safe. The hook falls through to the default-empty values when storage is unavailable (SSR, sandboxed iframes, quota errors, private browsing) — never throws.
- Best-effort writes. Storage failures are silently swallowed. If localStorage is full or blocked, the grid still works; it just doesn't persist.
- Other targets. Server-side persistence and URL persistence are consumer-side wiring (today). For URL, see the next page; for server, the saved-view DTO is the right primitive.