feat(snaps): Settings Page

[GuillaumeRx]

Description

This PR adds a settings section for each preinstalled snaps that exposes a onSettingsPage handler

Related issues

Fixes: MetaMask/snaps#2874

Manual testing steps

1. Open MetaMask's settings
2. You should see the preinstalled snaps settings

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[GuillaumeRx]

The settings page having a backgroundDefault background color interferes with some of our components.

[FrederikBolding]

Did we fix the clash by forcing a background or is there additional problems?

[GuillaumeRx]

The clash still exists, the primary problem is with Section that has the same background color

[FrederikBolding]

?

[GuillaumeRx]

There's a type error now that the function is written in typescript

[metamaskbot]

Builds ready [44fb407]

• builds: chrome, firefox
• builds (beta): chrome
• builds (flask): chrome, firefox
• builds (MMI): chrome, firefox
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• build viz: Build System
• mv3: Background Module Init Stats
• mv3: UI Init Stats
• mv3: Module Load Stats
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• code coverage: Report
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5, 6
  • common: 0, 1, 10, 11, 12, 2, 3, 4, 5, 6, 7, 8, 9
  • content-script: 0
  • offscreen: 0
  • ui: 0, 1, 10, 11, 12, 13, 2, 3, 4, 5, 6, 7, 8, 9

Page Load Metrics (1782 ± 116 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	266	2767	1638	512	246
		domContentLoaded	1562	2753	1749	247	118
		load	1588	2767	1782	242	116
		domInteractive	26	122	45	27	13
		backgroundConnect	10	73	33	20	10
		firstReactRender	16	79	37	25	12
		getState	5	52	17	17	8
		initialActions	0	0	0	0	0
		loadScripts	1150	2289	1323	236	113
		setupStore	6	65	21	20	10
		uiStartup	1819	3019	2019	248	119

Bundle size diffs [🚨 Warning! Bundle size has increased!]

• background: 217 Bytes (0.00%)
• ui: 9.21 KiB (0.12%)
• common: 4.64 KiB (0.06%)