chore: refactor ThematicDialog to functional component [DHIS2-18209]

[BRaimbault]

Parent: master
Child: #3584 > feat: support multiple split layers DHIS2-19542

Implements DHIS2-18209

Description

Refactor ThematicDialog to functional component.

---

Notes

Other potential improvements:

• validate logic into a separate util
• tabs into separate components
• helper for repetitive dispatch wrappers
• reduce the levels of nesting in the return function

My idea is to do it separately once all layer Dialog components are functional components.

---

Quality checklist

Add N/A to items that are not applicable.

• Dashboard tested N/A
• Cypress and/or Jest tests added/updated N/A
• Docs added N/A
• d2-ci dependencies replaced (analytics or maps-gl link https://github.com/dhis2/[lib]/pull/XXX) N/A
• Tester approved (BR)

[dhis2-bot]

🚀 Deployed on https://pr-3588.maps.netlify.dhis2.org

[BRaimbault]

Ready for review.

[edoardo]

It looks ok 👍

I would extract the tabs rendering code in separate components for readability and reduce the levels of nesting in the return function.

[HendrikThePendric]

Sorry, I meant to also review this but got a bit sidetracked. What you have looks good, but obviously this component file is very large. Besides the suggestions @edoardo already made, you could consider extracting most of what you do before you return the JSX into one or several hook(s) so that you effectively end up with presentational component and a hook that encapsulates the business logic.

Without looking into the code too deeply, I'd say that perhapos here you could actually have one hook that encapsulates the "previous state", a second hook that is responsible for the validation (it can just return a validate function, and perhaps a third hook that runs all these effects and sets the errors.

Again, the idea above is without looking into things too deeply, perhaps you'd end up with too much interdependency between these 2-3 hooks and in that case you could just go with 1.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
1 Accepted issue

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud