[JSX] Refactor Modal Component to Support Conditional Form Wrapping

[HenriRabalais]

PR Description

This pull request refactors the Modal component to improve flexibility and maintainability by conditionally wrapping content in a FormElement if an onSubmit callback is provided.

Key Changes:

• Conditional Form Wrapping:

  • Added logic to wrap content in a FormElement when onSubmit is passed as a prop.
  • Ensures consistent behavior for submitting forms or displaying static content.

• Simplified JSX Structure:

  • Improved formatting and readability by restructuring the ternary operator.
  • Ensured consistent indentation and reduced code duplication.

• Preserved Functionality:

  • Maintains existing behavior while improving code clarity and maintainability.

Purpose:

• Enables better handling of forms inside the modal.
• Prepares the component for future enhancements.

[driusan]

@ridz1208 I think you're the one that wanted this, can you review?

[HenriRabalais]

@driusan I've updated the uses of modal where nesting of a <form> tag was occurring — do you want to just take a look at those? And @ridz1208 could you look at the jsx/Modal.js file?

[HenriRabalais]

@driusan if you have time, do you mind just looking at the dataquery changes while I wait on a review from the rest of it from @ridz1208 ?

[driusan]

@HenriRabalais I am confused because I thought the <form> elements were being removed due to being duplicated elsewhere in the hierarchy but I don't see in this PR where that is. It doesn't seem to be in Modal.

[driusan]

Nevermind, I just realized <FormElement> is a <form> element. I'll have to test this.

[driusan]

The dataquery changes look minimal when I look at them with ?w=1 and seem to look fine on the frontend to me.

[HenriRabalais]

@maximemulder would you mind reviewing this when you have some spare time? I don't think @ridz1208 has time at the moment.