chore: upgrade react native, expo and storybook #685

georgewrmarshall · 2025-05-22T06:13:24Z

Description

This PR upgrades React Native, Expo, and Storybook dependencies for the storybook-react-native app to align with MetaMask Mobile's dependency versions and upgrade to Storybook v10.

Key Changes:

Dependency Upgrades:
- Upgraded all Storybook packages from v9.1.x to v10.1.0
- Updated react-native-safe-area-context from 4.12.0 to 5.6.0
- Updated react-native-gesture-handler from 2.20.2 to 2.28.0
- Updated @gorhom/bottom-sheet from 5.1.1 to 5.2.6
- Downgraded react-native-svg from 15.10.1 to 15.8.0 (Expo SDK 52 compatibility)
- See package.json for full dependency list
Storybook UI Workaround:
- Implemented @storybook/react-native-ui-lite to fix bottom sheet menu issue
- The full Storybook UI's bottom sheet menu was not responding to touch events due to a known Reanimated v3 compatibility issue (see storybookjs/react-native#802)
- LiteUI provides a lightweight alternative without bottom sheet dependencies, resolving the navigation issue
Metro Configuration:
- Updated withStorybook import to use named export (Storybook v10 API change)
- Configured SVG transformer to work with Storybook's metro wrapper
Babel Configuration:
- Added react-native-reanimated/plugin as the last plugin (required for Reanimated v3)

Known Issues:

SVG Rendering Errors: When using Expo Go, SVG icons throw native module initialization errors:
```
Invariant Violation: View config getter callback for component 'RNSVGPath' must be a function (received 'undefined')
```
This is a known limitation when using custom SVG transformers with Expo Go. The error occurs because the react-native-svg native module doesn't properly initialize with the custom transformer configuration.

Workaround Options:
1. Use a development build instead of Expo Go (npx expo prebuild)
2. Stories without SVG icons work correctly
3. The Storybook navigation menu works despite this error

Related issues

Fixes: N/A

storybookjs/react-native#802 - Bottom sheet menu unresponsive with Reanimated components

Manual testing steps

Run yarn install in the repository root
Navigate to apps/storybook-react-native
Run yarn storybook:ios or yarn storybook:android
Open the app in Expo Go
Verify the hamburger menu opens when tapped (using LiteUI)
Navigate between different stories using the menu
Note: Stories with SVG icons will show errors in Expo Go (expected)

Screenshots/Recordings

Before

Bottom sheet menu visible but unresponsive to touch
Unable to navigate between stories

After

✅ Menu opens and closes properly with LiteUI
✅ Story navigation works
⚠️ SVG rendering errors in Expo Go (known limitation with custom transformers)

Pre-merge author checklist

I've followed MetaMask Contributor Docs
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.

socket-security · 2025-05-22T06:14:33Z

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Package	Supply Chain Security	Quality	Maintenance
@typescript-eslint/parser@8.45.0
@babel/preset-react@7.26.3 ⏵ 7.27.1
@babel/preset-typescript@7.26.0 ⏵ 7.27.1	⁺¹	⁺¹
@babel/plugin-transform-modules-commonjs@7.26.3 ⏵ 7.27.1
@storybook/react@9.0.17 ⏵ 9.1.16	⁺²	⁺³	⁺¹
@types/react-dom@18.3.5 ⏵ 18.3.7	⁺¹	⁺¹	⁺³
bitcoin-address-validation@3.0.0
@types/react@18.3.16 ⏵ 18.3.25	⁺¹	⁺²	⁺²
expo-constants@14.4.2 ⏵ 17.0.8		^-5
@babel/core@7.28.0 ⏵ 7.28.4
@typescript-eslint/eslint-plugin@8.45.0
expo-font@11.4.0 ⏵ 13.0.4		⁺¹
babel-plugin-react-native-web@0.18.12 ⏵ 0.19.13
react-native-gesture-handler@2.12.1 ⏵ 2.28.0	⁺¹	⁺²	^-1
typescript@5.2.2 ⏵ 5.3.3	⁺¹
react-native-reanimated@3.3.0 ⏵ 3.16.7	⁺¹	⁺⁶
react-native@0.72.17 ⏵ 0.76.9		⁺¹
@storybook/react-native@6.5.7 ⏵ 9.1.4	⁺¹		⁺²

View full report

socket-security · 2025-05-22T06:14:35Z

Caution

MetaMask internal reviewing guidelines:

Do not ignore-all
Each alert has instructions on how to review if you don't know what it means. If lost, ask your Security Liaison or the supply-chain group
Copy-paste ignore lines for specific packages or a group of one kind with a note on what research you did to deem it safe.
@SocketSecurity ignore npm/PACKAGE@VERSION

Action	Severity	Alert (click "▶" to expand/collapse)
Block		Obfuscated code: npm `@storybook/addon-ondevice-notes` is 91.0% likely obfuscated Confidence: 0.91 Location: Package overview From: `?` → `npm/@storybook/[email protected]` ℹ Read more on: This package \| This alert \| What is obfuscated code? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should not obfuscate their code. Consider not using packages with obfuscated code. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@storybook/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/image-utils` in module globalThis["fetch"] Module: globalThis["fetch"] Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/image-utils` in module globalThis["fetch"] Module: globalThis["fetch"] Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		System shell access: npm `@expo/sudo-prompt` in module child_process Module: child_process Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is shell access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should avoid accessing the shell which can reduce portability, and make it easier for malicious shell access to be introduced. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/ws-tunnel` in module http Module: http Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/ws-tunnel` in module https Module: https Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/ws-tunnel` in module net Module: net Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@expo/ws-tunnel` in module tls Module: tls Location: Package overview From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@react-native/community-cli-plugin` in module globalThis["fetch"] Module: globalThis["fetch"] Location: Package overview From: `?` → `npm/[email protected]` → `npm/@react-native/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@react-native/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@react-native/debugger-frontend` in module globalThis["fetch"] Module: globalThis["fetch"] Location: Package overview From: `?` → `npm/[email protected]` → `npm/@react-native/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@react-native/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `@react-native/dev-middleware` in module globalThis["fetch"] Module: globalThis["fetch"] Location: Package overview From: `?` → `npm/[email protected]` → `npm/@react-native/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@react-native/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		System shell access: npm `chrome-launcher` in module child_process Module: child_process Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is shell access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should avoid accessing the shell which can reduce portability, and make it easier for malicious shell access to be introduced. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `chrome-launcher` in module net Module: net Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `chrome-launcher` in module http Module: http Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		System shell access: npm `chromium-edge-launcher` in module child_process Module: child_process Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is shell access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should avoid accessing the shell which can reduce portability, and make it easier for malicious shell access to be introduced. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `chromium-edge-launcher` in module net Module: net Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `chromium-edge-launcher` in module http Module: http Location: Package overview From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `on-headers` in module http Module: http Location: Package overview From: `?` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Network access: npm `send` in module http-errors Module: http-errors Location: Package overview From: `?` → `npm/[email protected]` → `npm/@metamask/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is network access? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Packages should remove all network access that is functionally unnecessary. Consumers should audit network access to ensure legitimate use. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Publisher changed: npm `@expo/vector-icons` is now published by evanbacon instead of brentvatne New Author: evanbacon Previous Author: brentvatne From: `?` → `npm/@expo/[email protected]` ℹ Read more on: This package \| This alert \| What is new author? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@expo/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Publisher changed: npm `babel-preset-expo` is now published by gabrieldonadel instead of lukmccall New Author: gabrieldonadel Previous Author: lukmccall From: `?` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is new author? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Publisher changed: npm `flow-enums-runtime` is now published by flowtype instead of gkz New Author: flowtype Previous Author: gkz From: `?` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is new author? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Publisher changed: npm `on-headers` is now published by ulisesgascon instead of dougwilson New Author: ulisesgascon Previous Author: dougwilson From: `?` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is new author? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Block		Publisher changed: npm `send` is now published by blakeembrey instead of ulisesgascon New Author: blakeembrey Previous Author: ulisesgascon From: `?` → `npm/[email protected]` → `npm/@metamask/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is new author? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: Scrutinize new collaborator additions to packages because they now have the ability to publish code into your dependency tree. Packages should avoid frequent or unnecessary additions or changes to publishing rights. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Warn		Potential code anomaly (AI signal): npm `@react-native/debugger-frontend` is 100.0% likely to have a medium risk anomaly Notes: The code appears to be a standard UI component suite for DevTools-like color/var swatches with mode toggling and telemetry hooks. No explicit malicious behavior or backdoors detected in this isolated fragment. Primary concerns relate to telemetry data handling and potential data exposure through logs; input handling and UI state management are typical for such components. Overall security risk is moderate due to telemetry integration and complex data flows, but no concrete evidence of exfiltration or exploitation within this fragment. Confidence: 1.00 Severity: 0.60 From: `?` → `npm/[email protected]` → `npm/@react-native/[email protected]` ℹ Read more on: This package \| This alert \| What is an AI-detected potential code anomaly? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: An AI system found a low-risk anomaly in this package. It may still be fine to use, but you should check that it is safe before proceeding. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/@react-native/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
Warn		Potential code anomaly (AI signal): npm `acorn` is 100.0% likely to have a medium risk anomaly Notes: Overall, the analyzed code is a legitimate, well-structured Acorn 8.x parser fragment with robust handling for ES2020+ features. There is no direct malicious payload, backdoor, or exfiltration mechanism within this fragment. The primary security considerations relate to safe handling of untrusted input to avoid DoS via complex/ pathological RegExp usage or verbose error reporting. In a typical extension usage, isolate parsing to a sandbox and limit resource usage to mitigate potential abuse. Confidence: 1.00 Severity: 0.60 From: `?` → `npm/[email protected]` → `npm/[email protected]` → `npm/[email protected]` → `npm/[email protected]` → `npm/[email protected]` ℹ Read more on: This package \| This alert \| What is an AI-detected potential code anomaly? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `[email protected]`. Suggestion: An AI system found a low-risk anomaly in this package. It may still be fine to use, but you should check that it is safe before proceeding. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/[email protected]`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.
See 6 more rows in the dashboard

View full report

github-actions · 2025-06-11T00:20:23Z

📖 Storybook Preview

View PR Storybook

georgewrmarshall · 2025-06-11T00:22:36Z

apps/storybook-react-native/.storybook/StorybookProvider.tsx

+  // Only use FontLoader in native environment
+  if (Platform.OS !== 'web') {
+    return (
+      <ThemeProvider theme={Theme.Default} colorSet={ColorSet.Brand}>


Remove color set and use useColorScheme hook from react native

georgewrmarshall · 2025-06-11T00:22:47Z

apps/storybook-react-native/.storybook/FontLoader.tsx

 import * as Font from 'expo-font';

-const FontLoader = ({ children }) => {
+interface FontLoaderProps {


Use type here

github-actions · 2025-06-11T00:55:26Z

📖 Storybook Preview

View PR Storybook

github-actions · 2025-06-11T01:59:13Z

📖 Storybook Preview

View PR Storybook

github-actions · 2025-06-11T02:00:28Z

📖 Storybook Preview

View PR Storybook

github-actions · 2025-10-02T04:45:44Z

📖 Storybook Preview

View PR Storybook

…ign versions

github-actions · 2025-11-12T19:00:32Z

📖 Storybook Preview

View PR Storybook

georgewrmarshall self-assigned this Jun 3, 2025

georgewrmarshall force-pushed the fix/storybook-v8-rn branch from 793a046 to 493ddde Compare June 11, 2025 00:18

georgewrmarshall commented Jun 11, 2025

View reviewed changes

georgewrmarshall force-pushed the fix/storybook-v8-rn branch 2 times, most recently from fcdf533 to 58f2edc Compare June 11, 2025 01:58

georgewrmarshall force-pushed the fix/storybook-v8-rn branch from 58f2edc to 12bd36c Compare October 2, 2025 04:43

georgewrmarshall added 9 commits November 10, 2025 21:36

chore: upgrading react native and storybook

33dceac

chore: web kind of working

e82725a

chore: web working

fe00600

android working

7dc0acd

chore: theme working

58d4d5c

chore: clean up

481c36c

chore: implementing expo-font

44a9d78

chore: making storybook render by default

7079c07

chore: linting fixes to ignore storybook files from typescript and al…

dd2c993

…ign versions

georgewrmarshall force-pushed the fix/storybook-v8-rn branch from 12bd36c to dd2c993 Compare November 12, 2025 18:58

georgewrmarshall mentioned this pull request Dec 4, 2025

fix: update background color stories #859

Merged

7 tasks

georgewrmarshall changed the title ~~chore: initial upgrade of storybook and react native~~ chore: upgrade react native, expo and storybook Dec 4, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

chore: upgrade react native, expo and storybook #685

chore: upgrade react native, expo and storybook #685

Uh oh!

georgewrmarshall commented May 22, 2025 •

edited

Loading

Uh oh!

socket-security bot commented May 22, 2025 •

edited

Loading

Uh oh!

socket-security bot commented May 22, 2025 •

edited

Loading

Uh oh!

github-actions bot commented Jun 11, 2025

Uh oh!

georgewrmarshall Jun 11, 2025

Uh oh!

georgewrmarshall Jun 11, 2025

Uh oh!

github-actions bot commented Jun 11, 2025

Uh oh!

github-actions bot commented Jun 11, 2025

Uh oh!

github-actions bot commented Jun 11, 2025

Uh oh!

github-actions bot commented Oct 2, 2025

Uh oh!

github-actions bot commented Nov 12, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

chore: upgrade react native, expo and storybook #685

Are you sure you want to change the base?

chore: upgrade react native, expo and storybook #685

Uh oh!

Conversation

georgewrmarshall commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Key Changes:

Known Issues:

Related issues

Manual testing steps

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

Uh oh!

socket-security bot commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

socket-security bot commented May 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jun 11, 2025

📖 Storybook Preview

Uh oh!

georgewrmarshall Jun 11, 2025

Choose a reason for hiding this comment

Uh oh!

georgewrmarshall Jun 11, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Jun 11, 2025

📖 Storybook Preview

Uh oh!

github-actions bot commented Jun 11, 2025

📖 Storybook Preview

Uh oh!

github-actions bot commented Jun 11, 2025

📖 Storybook Preview

Uh oh!

github-actions bot commented Oct 2, 2025

📖 Storybook Preview

Uh oh!

github-actions bot commented Nov 12, 2025

📖 Storybook Preview

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

georgewrmarshall commented May 22, 2025 •

edited

Loading

socket-security bot commented May 22, 2025 •

edited

Loading

socket-security bot commented May 22, 2025 •

edited

Loading