Altinn / Altinn/app-frontend-react

Add layout validation for missing data model bindings (`metadata` and `label`)

Open
#1,894 0 comments 0 reactions 0 assignees View on GitHub
kind/feature-request
Dominant language
TypeScript
Stars
21
Forks
33
Avg merge
6d 23h
Merged PRs (30d)
3

Description

### Description

If you have set up an options-enabled component that uses a `metadata` or `label` binding, that binding is not validated against the schema, so app developers may have to find out that the binding is wrong the hard way (frontend will crash when the backend gives us a 409 on saving data to an invalid binding).

- The `metadata` binding should point to a `string`
- The `label` binding should point to a `string` for single-select components (`RadioButtons`, `Dropdown`, etc) and to a `string[]` aka `{ "type": "array", "items": { "type": "string" }` for multi-select components (`Checkboxes`, `MultipleSelect`, etc).

The fact that we're forgetting to add validations for newly developed bindings indicates that our developer experience is not the best, so maybe we should use typescript to give us a typescript error whenever a component starts accepting a new data model binding without having any validation for it.

### Additional Information

_No response_

Contributor guide

Open the contributing guide

Research direction

The issue names no files or tests; start by locating layout validation for options-enabled components and the existing handling of metadata and label bindings. Verify the schema rules for single- and multi-select components, then add coverage so invalid bindings are rejected before saving; consider the suggested TypeScript enforcement separately.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.