Skip to content

chore: upgrade react native, expo and storybook #685

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
georgewrmarshall wants to merge 9 commits into
base: main
Choose a base branch
from
Draft

chore: upgrade react native, expo and storybook #685

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
33dceac
chore: upgrading react native and storybook
georgewrmarshall Oct 1, 2025
e82725a
chore: web kind of working
georgewrmarshall Oct 2, 2025
fe00600
chore: web working
georgewrmarshall Oct 2, 2025
7dc0acd
android working
georgewrmarshall Oct 2, 2025
58d4d5c
chore: theme working
georgewrmarshall Oct 2, 2025
481c36c
chore: clean up
georgewrmarshall Oct 2, 2025
44a9d78
chore: implementing expo-font
georgewrmarshall Nov 11, 2025
7079c07
chore: making storybook render by default
georgewrmarshall Nov 11, 2025
dd2c993
chore: linting fixes to ignore storybook files from typescript and al…
georgewrmarshall Nov 12, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
chore: web kind of working
  • Loading branch information
@georgewrmarshall
georgewrmarshall committed Nov 11, 2025
commit e82725a120ae1c7b297ffa02377ce3923f286c83
1 change: 1 addition & 0 deletions apps/storybook-react-native/.rnstorybook/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ const main: StorybookConfig = {
'@storybook/addon-ondevice-backgrounds',
'@storybook/addon-ondevice-actions',
],
framework: '@storybook/react-native',
};

export default main;
39 changes: 21 additions & 18 deletions apps/storybook-react-native/.rnstorybook/storybook.requires.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,59 +1,62 @@
/* do not change this file, it is auto generated by storybook. */
import { start, updateView, View } from '@storybook/react-native';

import '@storybook/addon-ondevice-notes/register';
import '@storybook/addon-ondevice-controls/register';
import '@storybook/addon-ondevice-backgrounds/register';
import '@storybook/addon-ondevice-actions/register';
import "@storybook/addon-ondevice-notes/register";
import "@storybook/addon-ondevice-controls/register";
import "@storybook/addon-ondevice-backgrounds/register";
import "@storybook/addon-ondevice-actions/register";

const normalizedStories = [
{
titlePrefix: '',
directory: './stories',
files: '**/*.stories.?(ts|tsx|js|jsx)',
importPathMatcher:
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
titlePrefix: "",
directory: "./stories",
files: "**/*.stories.?(ts|tsx|js|jsx)",
importPathMatcher: /^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
// @ts-ignore
req: require.context(
'../stories',
true,
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/
),
},
{
titlePrefix: '',
directory: '../../packages/design-system-react-native/src',
files: '**/*.stories.?(ts|tsx|js|jsx)',
importPathMatcher:
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
titlePrefix: "",
directory: "../../packages/design-system-react-native/src",
files: "**/*.stories.?(ts|tsx|js|jsx)",
importPathMatcher: /^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
// @ts-ignore
req: require.context(
'../../../packages/design-system-react-native/src',
true,
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/,
/^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.(?:ts|tsx|js|jsx)?)$/
),
},
}
];


declare global {
var view: View;
var STORIES: typeof normalizedStories;
}


const annotations = [
require('./preview'),
require('@storybook/react-native/preview'),
require("@storybook/react-native/preview")
];

global.STORIES = normalizedStories;

// @ts-ignore
module?.hot?.accept?.();



if (!global.view) {
global.view = start({
annotations,
storyEntries: normalizedStories,

});
} else {
updateView(global.view, annotations, normalizedStories);
Expand Down
9 changes: 2 additions & 7 deletions apps/storybook-react-native/.storybook/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,9 @@ const main: StorybookConfig = {
},
},

// Add core options to prevent conflicts
core: {
disableTelemetry: true,
},

async viteFinal(config) {
// Disable the problematic vite-tsconfig-paths plugin for this project
// Filter out vite-tsconfig-paths plugin to prevent conflicts
const filteredPlugins = config.plugins?.filter((plugin) => {
const pluginName = plugin?.name || '';
return pluginName !== 'vite:tsconfig-paths';
Expand All @@ -42,10 +38,9 @@ const main: StorybookConfig = {
config.plugins = filteredPlugins;
}

// Ensure resolve object exists
config.resolve = config.resolve || {};

// Force the react-native alias and design system packages to use source files
// Configure aliases for monorepo packages
config.resolve.alias = {
...config.resolve.alias,
'react-native': require.resolve('react-native-web'),
Expand Down
27 changes: 14 additions & 13 deletions apps/storybook-react-native/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,36 +31,37 @@
"expo-status-bar": "~2.0.1",
"expo-system-ui": "~4.0.9",
"react-native": "^0.76.9",
"react-native-gesture-handler": "~2.20.2",
"react-native-gesture-handler": "^2.20.2",
"react-native-reanimated": "~3.16.1",
"react-native-safe-area-context": "4.12.0",
"react-native-svg": "~15.8.0",
"react-native-svg": "^15.10.1",
"react-native-web": "~0.19.13",
"uuid": "^3.0.0"
},
"devDependencies": {
"@babel/core": "^7.26.0",
"@babel/preset-env": "^7.26.0",
"@chromatic-com/storybook": "^4.0.0",
"@chromatic-com/storybook": "^4.1.1",
"@expo/metro-runtime": "~4.0.1",
"@storybook/addon-docs": "^9.1.0",
"@storybook/addon-ondevice-actions": "^9.1.0",
"@storybook/addon-ondevice-backgrounds": "^9.1.0",
"@storybook/addon-ondevice-controls": "^9.1.0",
"@storybook/addon-ondevice-notes": "^9.1.0",
"@storybook/react-native": "^9.1.0",
"@storybook/react-native-web-vite": "^9.1.0",
"@storybook/addon-docs": "^9.1.8",
"@storybook/addon-ondevice-actions": "^9.1.4",
"@storybook/addon-ondevice-backgrounds": "^9.1.4",
"@storybook/addon-ondevice-controls": "^9.1.4",
"@storybook/addon-ondevice-notes": "^9.1.4",
"@storybook/react": "^9.1.8",
"@storybook/react-native": "^9.1.4",
"@storybook/react-native-web-vite": "^9.1.8",
"@types/react": "~18.3.12",
"@vitejs/plugin-react": "^4.4.1",
"@vitejs/plugin-react": "^4.5.0",
"babel-plugin-module-resolver": "^5.0.2",
"babel-plugin-react-docgen-typescript": "^1.5.1",
"babel-plugin-react-native-web": "^0.19.10",
"cross-env": "^7.0.3",
"prettier": "^3.3.3",
"react-native-svg-transformer": "^1.5.0",
"storybook": "^9.1.0",
"storybook": "^9.1.8",
"typescript": "~5.3.3",
"vite": "^6.0.11"
"vite": "^6.3.6"
},
"dependenciesMeta": {
"uuid": {}
Expand Down
14 changes: 7 additions & 7 deletions apps/storybook-react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,17 @@
"test-storybook": "vitest --run"
},
"devDependencies": {
"@chromatic-com/storybook": "^4.0.1",
"@chromatic-com/storybook": "^4.1.1",
"@metamask/design-system-react": "workspace:^",
"@metamask/design-system-tailwind-preset": "workspace:^",
"@metamask/design-tokens": "workspace:^",
"@metamask/utils": "^11.8.1",
"@playwright/test": "^1.52.0",
"@storybook/addon-a11y": "^9.0.17",
"@storybook/addon-docs": "^9.0.17",
"@storybook/addon-vitest": "^9.0.17",
"@storybook/react": "^9.0.17",
"@storybook/react-vite": "^9.0.17",
"@storybook/addon-a11y": "^9.1.10",
"@storybook/addon-docs": "^9.1.10",
"@storybook/addon-vitest": "^9.1.10",
"@storybook/react": "^9.1.10",
"@storybook/react-vite": "^9.1.10",
"@testing-library/dom": "^9.0.0",
"@testing-library/react": "^16.0.1",
"@types/prop-types": "^15",
Expand All @@ -35,7 +35,7 @@
"prop-types": "^15.8.1",
"react": "^18.3.1",
"react-dom": "18.3.1",
"storybook": "^9.0.17",
"storybook": "^9.1.8",
"tailwindcss": "^3.0.0",
"typescript": "~5.3.3",
"vite": "^6.3.6",
Expand Down
7 changes: 3 additions & 4 deletions packages/design-system-react-native/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@
"@metamask/design-system-twrnc-preset": "workspace:^",
"@metamask/design-tokens": "workspace:^",
"@metamask/utils": "^11.8.1",
"@storybook/react-native": "6.5",
"@storybook/react-native": "^9.1.0",
"@testing-library/react-hooks": "^8.0.1",
"@testing-library/react-native": "^12.8.1",
"@ts-bridge/cli": "^0.6.3",
Expand All @@ -77,8 +77,7 @@
"metro-react-native-babel-preset": "^0.77.0",
"react": "^18.3.1",
"react-native": "^0.76.9",
"react-native-gesture-handler": "^2.12.0",
"react-native-jazzicon": "^0.1.2",
"react-native-gesture-handler": "^2.20.2",
"react-native-reanimated": "~3.16.1",
"react-native-svg": "^15.10.1",
"react-native-svg-transformer": "^1.5.0",
Expand All @@ -93,7 +92,7 @@
"@metamask/utils": "^11.8.1",
"react": ">=18.3.1",
"react-native": ">=0.76.9",
"react-native-gesture-handler": ">=1.10.3",
"react-native-gesture-handler": "^2.20.2",
"react-native-reanimated": ">=3.3.0"
},
"engines": {
Expand Down
4 changes: 2 additions & 2 deletions packages/design-system-react/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,7 +62,7 @@
"@metamask/auto-changelog": "^5.1.0",
"@metamask/design-system-tailwind-preset": "workspace:^",
"@metamask/utils": "^11.8.1",
"@storybook/react": "^9.0.17",
"@storybook/react": "^9.1.10",
"@svgr/cli": "^8.1.0",
"@testing-library/jest-dom": "^6.6.3",
"@testing-library/react": "^16.0.1",
Expand All @@ -71,7 +71,7 @@
"@types/jest": "^27.4.1",
"@types/node": "^16.18.54",
"@types/react": "~18.3.12",
"@types/react-dom": "~18.3.0",
"@types/react-dom": "^18.3.0",
"bitcoin-address-validation": ">=2.0.0",
"deepmerge": "^4.2.2",
"jest": "^29.7.0",
Expand Down
2 changes: 1 addition & 1 deletion packages/design-tokens/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@
"devDependencies": {
"@metamask/auto-changelog": "^5.1.0",
"@metamask/design-system-react": "workspace:^",
"@storybook/react": "^9.0.17",
"@storybook/react": "^9.1.10",
"@ts-bridge/cli": "^0.6.3",
"@types/jest": "^27.4.1",
"@types/node": "^16.18.54",
Expand Down
Loading