chore: update storybook native, add fonts, fix image references

leather-io · Nov 6, 2024 · 6c2c92f · 6c2c92f
1 parent 0532583
commit 6c2c92f
Show file tree

Hide file tree

Showing 5 changed files with 257 additions and 133 deletions.
diff --git a/packages/ui/app.config.js b/packages/ui/app.config.js
@@ -7,11 +7,11 @@ export default ({ config }) => ({
   },
   version: '1.0.0',
   orientation: 'portrait',
-  icon: './src/assets-native/icon.png',
+  icon: './src/assets-native/images/icon.png',
   scheme: 'myapp',
   userInterfaceStyle: 'automatic',
   splash: {
-    image: './src/assets-native/splash.png',
+    image: './src/assets-native/images/splash.png',
     resizeMode: 'contain',
     backgroundColor: '#ffffff',
   },
@@ -26,13 +26,13 @@ export default ({ config }) => ({
   },
   android: {
     adaptiveIcon: {
-      foregroundImage: './src/assets-native/adaptive-icon.png',
+      foregroundImage: './src/assets-native/images/adaptive-icon.png',
       backgroundColor: '#ffffff',
     },
     package: 'io.leather.mobilewallet',
   },
   web: {
-    favicon: './src/assets-native/favicon.png',
+    favicon: './src/assets-native/images/favicon.png',
   },
   plugins: ['expo-font'],
 });
diff --git a/packages/ui/app.json b/packages/ui/app.json
diff --git a/packages/ui/package.json b/packages/ui/package.json
@@ -59,6 +59,7 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-native": "0.74.1",
+    "react-native-gesture-handler": "2.16.1",
     "react-native-reanimated": "3.10.1",
     "react-native-safe-area-context": "4.10.1",
     "react-native-svg": "15.2.0",
@@ -88,7 +89,7 @@
     "@storybook/blocks": "8.3.2",
     "@storybook/manager-api": "8.3.2",
     "@storybook/react": "8.3.2",
-    "@storybook/react-native": "7.6.20",
+    "@storybook/react-native": "8.3.10",
     "@storybook/react-webpack5": "8.3.2",
     "@storybook/test": "8.3.2",
     "@storybook/theming": "8.3.2",

diff --git a/packages/ui/src/app.tsx b/packages/ui/src/app.tsx
@@ -1,12 +1,25 @@
 import { useColorScheme } from 'react-native';
 
 import { ThemeProvider } from '@shopify/restyle';
+import { useFonts } from 'expo-font';
 
 import StorybookUIRoot from './.storybook-native';
 import { generateTheme } from './theme-native';
 
 function RootLayout() {
   const colorScheme = useColorScheme();
+  const [loaded, error] = useFonts({
+    'FiraCode-Retina': require('./assets-native/fonts/FiraCode-Retina.otf'),
+    'FiraCode-Medium': require('./assets-native/fonts/FiraCode-Medium.otf'),
+    'ABCDiatype-Light': require('./assets-native/fonts/ABCDiatype-Light.otf'),
+    'ABCDiatype-Regular': require('./assets-native/fonts/ABCDiatype-Regular.otf'),
+    'ABCDiatype-Medium': require('./assets-native/fonts/ABCDiatype-Medium.otf'),
+    'MarchePro-Super': require('./assets-native/fonts/MarchePro-Super.otf'),
+  });
+
+  if (!loaded || error) {
+    return null;
+  }
 
   return (
     <ThemeProvider theme={generateTheme(colorScheme)}>