Feat/33 refactor stepper #33 #61
Conversation
fix: navigation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
| } | ||
|
|
||
| useEffect(() => { | ||
| if (navToSummary) { | ||
| // todo: finish update form when component it fixed |
There was a problem hiding this comment.
Wordt opgepakt wanneer we de locatie selectie afmaken
|
Vanaf stap 4 werkt de "vorige" knop niet meer: Ik kan niet meer terug. |
|
De "naar samenvatting" knop moet in alle gevallen denk ik een form save triggeren, nu gebeurd dit niet altijd. Zoals wanneer ik de beschrijving "vuurwerkoverlast" bij type melding invoer, ik naar stap 2 dingen invul -> doorga naar stap 3 -> stap 4 en dan "stap 2 wijzigen", ik hier wat dingen in verander en ik weer op ga naar samenvatting druk de veranderingen niet bewaard blijven. |
| setPercentage((step / 4) * 100) | ||
| }, [step]) | ||
|
|
||
| const resetState = () => { |
There was a problem hiding this comment.
Ik zou zelf verwachten dat deze resetState() functie binnen de store bestaat en daar dus de resetVisitedSteps() logica en de goToStep() logica uitgevoerd wordt. Dan heb je hier enkel nog resetForm en de router.push()
src/app/[locale]/incident/add/components/IncidentQuestionsLocationForm.tsx
Outdated
Show resolved
Hide resolved
| router.push(steps[FormStep.STEP_1_DESCRIPTION]) | ||
| onGoBack(false) | ||
| } | ||
| }, [goBack]) |
There was a problem hiding this comment.
Wat denk ik een handigere manier is om al deze code duplicatie in straks elke form te voorkomen is deze goBack useEffect logica en summary logica in het FormProgress component te stoppen.
Wat je in principe namelijk wil is dat bij een klik op vorige dan een functie gecalled wordt, die obv van dan je huidige formulier stap de nieuwe stap bedenkt: goToStep(betreffendeStap) daarmee zet, dan de router.push doet en onGoBack(false) zet, dan weer datzelfde riedeltje voor de summary.
Form specifieke logica (om het formulier op te slaan) hou je dan gewoon in de form submission functie en die call je dan ook weer vanuit die functie in je form progress component.
|
|
||
| useEffect(() => { | ||
| if (goBack) { | ||
| updateForm({ |
There was a problem hiding this comment.
Deze updateForm() logica zou je dan aanspreken door gewoon een call te doen vanuit het FormProgress component naar de betreffende form.submit() functie (die als goed is gewoon dan de juiste handleSubmit() functie in betreffend component aanroept).
# Conflicts: # src/app/[locale]/incident/add/components/IncidentQuestionsLocationForm.tsx # src/app/[locale]/incident/contact/components/IncidentContactForm.tsx # src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx # src/app/globals.css
# Conflicts: # src/app/[locale]/incident/layout.tsx # src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx # src/app/globals.css
Fixes #33