Altinn / Altinn/app-frontend-react
V4 - To contain validation error messages inside a page
- Dominant language
- TypeScript
- Stars
- 21
- Forks
- 33
- Avg merge
- 6d 23h
- Merged PRs (30d)
- 3
Description
### Description
We have the following page in our app where we send in all the different validation errors from the backend on page load.

We select the public division probate option and click the next button which navigates us to the next page.

When I as a user click the "Lagre mitt valg"-button, I should get an error message, which I do.

Now I have to think if I chose the correct form of probate, therefore I go back to make sure. I click the back button in the form.
I am now back to the start but I still see the validation error.

Our NavigationButton component looks like this:
```
{
"id": "NavigationButtons-dsadAS",
"type": "NavigationButtons",
"showBackButton": false,
"textResourceBindings": {
"next": "ProbateTexts.SaveMyChoice.Text"
},
"validateOnNext": {
"page": "current",
"show": ["AllExceptRequired"]
}
}
```
What we would like is to contain the validation error inside the page for Public division, because when the user has decided to go back to the main page, the error is no longer valid for the user.
Contributor guide
Research direction
Start with the NavigationButton component and its validateOnNext handling, especially the current-page and AllExceptRequired settings shown in the issue. Reproduce the back-navigation flow, then trace how validation messages are retained between pages. Done means an error from the Public division page is no longer displayed after navigating back to the main page.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100