Fix use of useAppState outside preact context

[DanWebb]

Related issue: https://wrap.sentry.io/issues/5568127635/?alert_rule_id=12711401&alert_type=issue&notification_uuid=20b9d956-1665-4a68-83cf-df8be230b342&project=6237470&referrer=slack

In the stack trace the problem points at "images/map.svg".

I'm guessing it is because locator-map-svg was a shadow dom web component that Safari must initially load outside of Preact context which causes the issue because useAppState() would return undefined if it's not loaded inside the component tree with the AppState.Provider above it.

There's no reason for this to be a shadow dom web component, this is one of the earliest components in the app and I think there was a reason at some point but it got refactored out so its been converted to a plan Preact template + css component instead.

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

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

See analysis details on SonarCloud

[github-actions]

🦙 MegaLinter status: ⚠️ WARNING

Descriptor	Linter	Files	Fixed	Errors	Elapsed time
✅ CSS	stylelint	1		0	1.23s
✅ EDITORCONFIG	editorconfig-checker	5		0	0.02s
✅ REPOSITORY	checkov	yes		no	20.38s
⚠️ REPOSITORY	gitleaks	yes		6	2.92s
✅ REPOSITORY	git_diff	yes		no	0.02s
✅ REPOSITORY	secretlint	yes		no	1.89s
✅ REPOSITORY	trivy-sbom	yes		no	2.13s
✅ REPOSITORY	trufflehog	yes		no	34.45s
✅ TSX	eslint	4		0	8.67s

See detailed report in MegaLinter reports
Set VALIDATE_ALL_CODEBASE: true in mega-linter.yml to validate all sources, not only the diff

MegaLinter is graciously provided by

[DanWebb]

🎉 This PR is included in version 1.50.1 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀