Support JSX and Interactive UI in simulator

[GuillaumeRx]

Description

This PR allows the simulator to consume the new JSX components from Snaps custom UI.

It also enable interactive interfaces to work in the simulator.

Breakdown:

• Renderer:

  • Swap the old component format to the JSX format
  • Create a Context provider to provide interaction handlers to the components

• OnRpcRequest and OnTransaction:

  • Add the missing hooks and handlers to the simulation backend and Redux Store
  • Create a dupe of the interface in the redux store to enable reactive re-rendering of the interface.
  • Interfaces now all go through the SnapInterfaceController

• UI Builder:

  • Refactor the code generation methods
  • Refactor the component extraction methods
  • Adds the Field component

[socket-security[bot]]

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package	New capabilities	Transitives	Size	Publisher
npm/@types/he@1.2.3	None	0	7.29 kB	types
npm/@types/lodash.debounce@4.0.9	None	+1	867 kB	types
npm/@types/lodash.memoize@4.1.9	None	+1	867 kB	types
npm/@types/lodash.throttle@4.1.9	None	+1	867 kB	types
npm/lodash.throttle@4.1.1	None	0	16.5 kB	jdalton

🚮 Removed packages: npm/@types/hast@2.3.4, npm/@types/mdast@3.0.11, npm/@types/unist@2.0.6, npm/bail@1.0.5, npm/character-entities-legacy@1.1.4, npm/character-entities@1.2.4, npm/character-reference-invalid@1.1.4, npm/comma-separated-tokens@1.0.8, npm/extend@3.0.2, npm/inline-style-parser@0.1.1, npm/is-alphabetical@1.0.4, npm/is-alphanumerical@1.0.4, npm/is-decimal@1.0.4, npm/is-hexadecimal@1.0.4, npm/mdast-util-definitions@4.0.0, npm/mdast-util-from-markdown@0.8.5, npm/mdast-util-to-hast@10.2.0, npm/mdast-util-to-string@2.0.0, npm/mdurl@1.0.1, npm/micromark@2.11.4, npm/parse-entities@2.0.0, npm/property-information@5.6.0, npm/react-markdown@6.0.3, npm/remark-parse@9.0.0, npm/remark-rehype@8.1.0, npm/space-separated-tokens@1.1.5, npm/style-to-object@0.3.0, npm/trough@1.0.5, npm/unified@9.2.2, npm/unist-builder@2.0.3, npm/unist-util-generated@1.1.6, npm/unist-util-is@4.1.0, npm/unist-util-position@3.1.0, npm/unist-util-stringify-position@2.0.3, npm/unist-util-visit-parents@3.1.1, npm/unist-util-visit@2.0.3, npm/vfile-message@2.0.4, npm/vfile@4.2.1

View full report↗︎

[socket-security[bot]]

👍 Dependency issues cleared. Learn more about Socket for GitHub ↗︎

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report↗︎

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 71.94245% with 117 lines in your changes missing coverage. Please review.

Project coverage is 93.85%. Comparing base (0a286e1) to head (c00c39f).

Files	Patch %	Lines
...ges/snaps-simulator/src/contexts/SnapInterface.tsx	36.73%	31 Missing :warning:
...lator/src/features/builder/components/NodeTree.tsx	8.33%	11 Missing :warning:
...ulator/src/features/renderer/components/Button.tsx	25.00%	9 Missing :warning:
...mulator/src/features/renderer/components/Field.tsx	43.75%	9 Missing :warning:
...imulator/src/features/renderer/components/Form.tsx	38.46%	8 Missing :warning:
...mulator/src/features/renderer/components/Input.tsx	36.36%	7 Missing :warning:
...s/snaps-simulator/src/features/simulation/sagas.ts	76.00%	6 Missing :warning:
...mulator/src/features/renderer/components/Image.tsx	16.66%	5 Missing :warning:
packages/snaps-simulator/src/utils/render.tsx	87.87%	4 Missing :warning:
...c/features/builder/components/TextEditableNode.tsx	40.00%	3 Missing :warning:
... and 11 more

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #2409 +/- ## ========================================== - Coverage 94.42% 93.85% -0.57% ========================================== Files 444 453 +9 Lines 9161 9412 +251 Branches 1416 1436 +20 ========================================== + Hits 8650 8834 +184 - Misses 511 578 +67 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[GuillaumeRx]

@metamaskbot update-pr