43 lines
1.4 KiB
Markdown
43 lines
1.4 KiB
Markdown
# Future Plans
|
|
|
|
## Big refactor: app architecture
|
|
|
|
### parse_url mutates too many module-level variables
|
|
`parse_url()` directly assigns to a large number of module-level state variables
|
|
(`section`, `grid_view_state`, `grid_tab`, `current_grid_id`, `grid_draft`,
|
|
`current_panel_idx`, `grid_source_id`). This is fragile and hard to reason about.
|
|
|
|
Preferred direction: represent the full UI state as a single immutable state object,
|
|
and have `parse_url()` return a new state value rather than mutating globals.
|
|
Something like:
|
|
```js
|
|
function parse_url(path) {
|
|
// returns a state object, touches nothing external
|
|
return { section, grid_view_state, current_grid_id, ... };
|
|
}
|
|
```
|
|
Then the caller assigns it: `state = parse_url(location.pathname); render(state);`
|
|
|
|
### render() if/else chain
|
|
The render dispatcher violates stated preferences — long chains of bare `else if`
|
|
branches. Replace with a lookup table of arrow functions:
|
|
```js
|
|
const SECTION_RENDERERS = {
|
|
components: render_components,
|
|
inventory: render_inventory,
|
|
fields: render_fields,
|
|
grids: render_grids,
|
|
templates: render_templates,
|
|
};
|
|
|
|
function render() {
|
|
sync_nav();
|
|
SECTION_RENDERERS[section]?.();
|
|
}
|
|
```
|
|
|
|
### General module structure
|
|
As the app grows, `app.mjs` is becoming a monolith. Consider splitting into
|
|
per-section modules (e.g. `views/components.mjs`, `views/grids.mjs`) that each
|
|
export their render function and own their local state.
|