Add global state modal (#1377)

## Launch Checklist

This adds the ability to edit the global state.
I think it deserves a modal of its own since I don't think it should be
part of other modals...
Here are some images:
<img width="1274" height="254" alt="image"
src="https://github.com/user-attachments/assets/4b6f2564-6c71-47da-9f8c-3bd2b97e1163"
/>

Initial dialog with no variable:
<img width="640" height="254" alt="image"
src="https://github.com/user-attachments/assets/b813b540-cae9-4c80-b2c0-4d965c022cb8"
/>
After you click add a few times:
<img width="640" height="254" alt="image"
src="https://github.com/user-attachments/assets/125cb978-90dc-4047-9694-b0ffc6eaa469"
/>

The state is updated as you change thing in the dialog.
I didn't complicated it to select the type of the variable, but this can
be added later of if there's a requirement to do so, I meant to keep it
simple for now.

 - [x] Briefly describe the changes in this PR.
- [x] Include before/after visuals or gifs if this PR includes visual
changes.
 - [x] Write tests for all new functionality.
 - [x] Add an entry to `CHANGELOG.md` under the `## main` section.

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

src/components/modals/ModalAdd.tsx

@@ -14,7 +14,7 @@ type ModalAddInternalProps = {
   layers: LayerSpecification[]
   onLayersChange(layers: LayerSpecification[]): unknown
   isOpen: boolean
-  onOpenToggle(open: boolean): unknown
+  onOpenToggle(): void
   // A dict of source id's and the available source layers
   sources: Record<string, SourceSpecification & {layers: string[]}>;
 } & WithTranslation;
@@ -50,7 +50,7 @@ class ModalAddInternal extends React.Component<ModalAddInternalProps, ModalAddSt
     changedLayers.push(layer as LayerSpecification);
     this.setState({ error: null }, () => {
       this.props.onLayersChange(changedLayers);
-      this.props.onOpenToggle(false);
+      this.props.onOpenToggle();
     });
   };