Research if we can scan features and automatically add views to view registry #607

New issue

Open

opened 2026-04-28 08:41:06 +00:00 by a24vinla · 5 comments

a24vinla commented

2026-04-28 08:41:06 +00:00

Collaborator

We currently have to manually add views to the views/viewRegistry constants. Although this isn't too big of a hassle, it would be nice if we only have too add the view to the features folder.

This should not be merged, but please create a branch where we can test this approach.

We currently have to manually add views to the views/viewRegistry constants. Although this isn't too big of a hassle, it would be nice if we only have too add the view to the features folder. This should not be merged, but please create a branch where we can test this approach.

a24vinla added the

frontEnd

research

labels

2026-04-28 08:41:06 +00:00

c24carso was assigned by c24elipe

2026-04-28 08:56:02 +00:00

c24carso commented

2026-04-28 17:20:23 +00:00

Collaborator

Recommended approach is Webpack require.context

Webpack has a built in feature called require.context that can scan a folder and import all files matching a pattern at build time.
The idea is to create a new file features/viewRegistry.js that scans features/ for all *View.js files, checks if they export a viewMeta object and if they do, adds them to views and viewRegister automatically. Dashboard.js then just imports from the registry instead of listing everything manually.
Each view needs one new export so the registry knows to pick it up, javascriptexport const viewMeta = { name: 'TemperatureView' };

Positives

No external dependencies
Only one place to maintain
Removes a lot of manual imports from Dashboard.js
The viewMeta check filters out hooks and other non-view files automatically

Negatives

require.context only works in Webpack. If the project switches to something else this would need to be rewritten
The dropdown order becomes alphabetical by file path instead of the current order
Special cases still have to stay in Dashboard

### Recommended approach is Webpack require.context Webpack has a built in feature called require.context that can scan a folder and import all files matching a pattern at build time. The idea is to create a new file features/viewRegistry.js that scans features/ for all *View.js files, checks if they export a viewMeta object and if they do, adds them to views and viewRegister automatically. Dashboard.js then just imports from the registry instead of listing everything manually. Each view needs one new export so the registry knows to pick it up, javascriptexport const viewMeta = { name: 'TemperatureView' }; **Positives** No external dependencies Only one place to maintain Removes a lot of manual imports from Dashboard.js The viewMeta check filters out hooks and other non-view files automatically **Negatives** require.context only works in Webpack. If the project switches to something else this would need to be rewritten The dropdown order becomes alphabetical by file path instead of the current order Special cases still have to stay in Dashboard