useTableStructure
Fetch table structure before mounting ApiTablesController
File: ./ApiTables/hooks/useTableStructure.ts
This hook runs on your feature page — outside ApiTablesProvider. It is the first code that talks to the backend when a table page loads.
Why a separate hook?
Structure lives in local React state on the page, not in table Redux yet. Only after you pass table={tableStructure} into ReactApiTable does the provider hydrate Redux slices.
Junior takeaway
Call getTableStructure in useEffect on mount. Wait for tableStructureLoading === false before rendering ReactApiTable.
API
const { getTableStructure, tableStructure, tableStructureLoading } = useTableStructure();| Return | Description |
|---|---|
getTableStructure({ table, params? }) | GET structure via axiosTable |
tableStructure | Response data — columns, filters, actions, tableName, … |
tableStructureLoading | true until first request completes |
Request details
table— full path or relative path toload-tableendpointparams— optional object forwarded to backend (scoped tables)- Header
ln: localefromuseLocale()for translated column labels
Minimal usage
useEffect(() => {
getTableStructure({
table: '/api-table/control-tables/load-table/orders',
params: { warehouseId },
});
}, [warehouseId]);When warehouseId changes, refetch structure so backend can return different columns/filters.
Common mistakes
| Mistake | Result |
|---|---|
| Skip loading gate | Empty or crashing table |
| Use query-table URL | Wrong response shape |
| Hard-code columns from structure | Defeats server-driven model |
| Forget locale header | Untranslated labels (backend dependent) |