Redux store & slices
Per-table Redux state shape and actions
File: ./ApiTables/table-providers/store.tsx
Store factory
export const createTableStore = () =>
configureStore({
reducer: {
tableCore: tableCoreSlice,
bulkActions: bulkActionsSlice,
rowActions: rowActionsSlice,
tableColumns: tableColumnsSlice,
},
devTools: true,
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({ serializableCheck: false }),
});getExternalState() returns externalStore.getState() from @/store/store for read-only access to the global app.
tableCore (tableCoreSlice.ts)
Domain: Structure metadata, query state, and row data.
| State field | Set by | Used for |
|---|---|---|
tableName | _getTableComponents | Query URL segment |
structureColumns | _getTableComponents | Column definitions |
structureFilters | _getTableComponents | Filter form schema |
customElement | _getTableComponents | String id for special UI hooks |
appliedFilters | _setAppliedFilters | Object keyed by filter name → sent as filters in POST |
renderedFilters | _setRenderedFilters | Array for chip UI in AppliedFilters |
tableSorting | _setTableSorting | Sent as sorts in POST |
tableData | _getTableData | Current rows |
tablePagination | _getTablePagination | Server pagination meta |
tableBindings | _getTableBindings | Extra server metadata |
currentPage, pageSize | pagination actions | Query params |
tableFetchingLoading | _setTableLoading | RDT loading |
tableRefresher | _triggerTableReload | Dependency bump for refetch |
tableColumns (tableColumnsSlice.ts)
Domain: RDT column config, selection, column modals.
| State field | Purpose |
|---|---|
tableColumns | Formatted columns for RDT |
visibleColumns | Subset after visibility toggles |
selectedRows, selectedIds | Bulk / bulk-eligible row actions |
toggledClearRows | Flip to force RDT clearSelectedRows |
rowSelectedModal | Datalist / HTML column popup payload |
_setTableColumns: initial format via formatTableColumns, or { update: true } for width refresh after fetch.
bulkActions (bulkActionsSlice.ts)
| State field | Purpose |
|---|---|
bulkActions | Structure list |
selectedBulkAction | Action awaiting confirmation or custom bulk modal |
bulkActionPostLoading | Request in flight |
bulkActionPostResponse | Triggers download/refetch in TableBulkActions effect |
rowActions (rowActionsSlice.ts)
| State field | Purpose |
|---|---|
structureRowActions | All row actions from structure |
selectedRowActions | Intersection of actions applicable to current selection as bulk |
clickedRowAction | Action pending confirmation or toggle modal |
clickedRowActionId | Row id for per-row loading spinner |
clickedRowActionResponse | API response for view modal |
customControlAction | Payload for custom control popup |
actionsInRegularCells | Actions rendered per column vs dedicated column |
rowActionPostLoading | Global row POST loading flag |
Selector patterns
// Inside ApiTables subtree only
const { tableData, appliedFilters } = useSelector((s: any) => s.tableCore);
const { selectedRows } = useSelector((s: any) => s.tableColumns);Do not expect tableCore on the global store.