Merge branch 'develop' into notifications

Emurgo · Oct 1, 2024 · b8904d1 · b8904d1
2 parents 8d4723b + 7ae330b
commit b8904d1
Show file tree

Hide file tree

Showing 56 changed files with 654 additions and 687 deletions.
diff --git a/apps/wallet-mobile/.storybook/decorators/index.ts b/apps/wallet-mobile/.storybook/decorators/index.ts
@@ -1,3 +1,4 @@
+export {ThemeProvider} from '@yoroi/theme'
 export * from './modals'
 export * from './navigation'
 export * from './query'

diff --git a/apps/wallet-mobile/.storybook/storybook.requires.js b/apps/wallet-mobile/.storybook/storybook.requires.js
diff --git a/apps/wallet-mobile/src/WalletNavigator.tsx b/apps/wallet-mobile/src/WalletNavigator.tsx
@@ -199,7 +199,6 @@ const WalletTabNavigator = () => {
                 ),
               tabBarLabel: strings.menuTabBarLabel,
               tabBarTestID: 'menuTabBarButton',
-              headerTitle: ({children}) => <NetworkTag>{children}</NetworkTag>,
             }}
           />
         </Tab.Navigator>
@@ -294,7 +293,7 @@ const useStyles = () => {
 
   const colors = {
     active: color.text_primary_max,
-    inactive: color.text_gray_medium,
+    inactive: color.text_gray_low,
     background: color.bg_color_max,
     divider: color.gray_200,
   }

diff --git a/apps/wallet-mobile/src/components/Button/Button.stories.tsx b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
@@ -1,63 +1,92 @@
 import {action} from '@storybook/addon-actions'
 import {storiesOf} from '@storybook/react-native'
+import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 
 import icon from '../../assets/img/icon/dashboard.png'
 import {Icon} from '../Icon'
 import {Button} from './Button'
 
-storiesOf('Button', module).add('default', () => (
-  <ScrollView>
-    <Row>
-      <Button onPress={() => action('onPress')()} title="Submit" />
-    </Row>
-
-    <Row>
-      <Button block onPress={() => action('onPress')()} title="submit" />
-    </Row>
-
-    <Row>
-      <Button block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
-    </Row>
-
-    <Row>
-      <Button outlineOnLight block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
-    </Row>
-
-    <Row>
-      <Button outlineOnLight block onPress={() => action('onPress')()} title="Submit" />
-    </Row>
-
-    <Row>
-      <Button outlineShelley withoutBackground shelleyTheme block onPress={() => action('onPress')()} title="Submit" />
-    </Row>
-
-    <Row>
-      <Button block shelleyTheme iconImage={icon} onPress={() => action('onPress')()} title="Submit, with image" />
-    </Row>
-
-    <Row>
-      <Button
-        block
-        shelleyTheme
-        startContent={<Icon.Plus size={24} color="white" />}
-        onPress={() => action('onPress')()}
-        title="Submit, with start content"
-      />
-    </Row>
-
-    <Row>
-      <Button
-        block
-        shelleyTheme
-        endContent={<Icon.Plus size={24} color="white" />}
-        onPress={() => action('onPress')()}
-        title="Submit, with end content"
-      />
-    </Row>
-  </ScrollView>
-))
+storiesOf('Button', module).add('default', () => {
+  const {color, isDark, selectThemeName} = useTheme()
+
+  return (
+    <ScrollView style={{backgroundColor: color.bg_color_max}}>
+      <Row>
+        <Button
+          onPress={() => {
+            selectThemeName(isDark ? 'default-light' : 'default-dark')
+          }}
+          title="Toggle theme"
+        />
+      </Row>
+
+      <Row>
+        <Button onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button block onPress={() => action('onPress')()} title="submit" />
+      </Row>
+
+      <Row>
+        <Button block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button outlineOnLight block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button outlineOnLight block shelleyTheme disabled onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button block outlineShelley outlineOnLight disabled onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button outlineOnLight block onPress={() => action('onPress')()} title="Submit" />
+      </Row>
+
+      <Row>
+        <Button
+          outlineShelley
+          withoutBackground
+          shelleyTheme
+          block
+          onPress={() => action('onPress')()}
+          title="Submit"
+        />
+      </Row>
+
+      <Row>
+        <Button block shelleyTheme iconImage={icon} onPress={() => action('onPress')()} title="Submit, with image" />
+      </Row>
+
+      <Row>
+        <Button
+          block
+          shelleyTheme
+          startContent={<Icon.Plus size={24} color="white" />}
+          onPress={() => action('onPress')()}
+          title="Submit, with start content"
+        />
+      </Row>
+
+      <Row>
+        <Button
+          block
+          shelleyTheme
+          endContent={<Icon.Plus size={24} color="white" />}
+          onPress={() => action('onPress')()}
+          title="Submit, with end content"
+        />
+      </Row>
+    </ScrollView>
+  )
+})
 
 const Row = (props: ViewProps) => <View {...props} style={styles.row} />
 

diff --git a/apps/wallet-mobile/src/components/ScrollableView/ScrollableView.tsx b/apps/wallet-mobile/src/components/ScrollableView/ScrollableView.tsx
diff --git a/apps/wallet-mobile/src/components/ScrollableView/index.ts b/apps/wallet-mobile/src/components/ScrollableView/index.ts
diff --git a/...et-mobile/src/features/Discover/useCases/SelectDappFromList/DAppListItem/DAppListItem.tsx b/...et-mobile/src/features/Discover/useCases/SelectDappFromList/DAppListItem/DAppListItem.tsx
@@ -2,16 +2,7 @@ import {useDappConnector} from '@yoroi/dapp-connector'
 import {useTheme} from '@yoroi/theme'
 import {Image} from 'expo-image'
 import * as React from 'react'
-import {
-  Alert,
-  Linking,
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  TouchableWithoutFeedback,
-  useWindowDimensions,
-  View,
-} from 'react-native'
+import {Alert, Linking, StyleSheet, Text, TouchableOpacity, TouchableWithoutFeedback, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 import uuid from 'uuid'
 
@@ -46,13 +37,7 @@ export const DAppListItem = ({dApp, connected, onPress}: Props) => {
   const {manager} = useDappConnector()
   const {track} = useMetrics()
 
-  const HEIGHT_SCREEN = useWindowDimensions().height
-
-  // For devices like iPhone SE wuth logical pixel height < 700, we need a bottom sheet with more height
-  const heightDialogByHeightScreen =
-    HEIGHT_SCREEN < 700
-      ? (HEIGHT_SCREEN * (dApp.isSingleAddress ? 70 : 50)) / 100
-      : (HEIGHT_SCREEN * (dApp.isSingleAddress ? 50 : 40)) / 100
+  const heightDialogByHeightScreen = dApp.isSingleAddress ? 460 : 340
 
   const heightDialogByInit = INIT_DIALOG_DAPP_ACTIONS_HEIGHT + insets.bottom
   const dialogHeight = heightDialogByInit < heightDialogByHeightScreen ? heightDialogByHeightScreen : heightDialogByInit

diff --git a/apps/wallet-mobile/src/features/Portfolio/PortfolioNavigator.tsx b/apps/wallet-mobile/src/features/Portfolio/PortfolioNavigator.tsx
@@ -8,7 +8,7 @@ import {SearchProvider} from '../Search/SearchContext'
 import {NetworkTag} from '../Settings/ChangeNetwork/NetworkTag'
 import {TxDetails} from '../Transactions/useCases/TxDetails/TxDetails'
 import {useStrings} from './common/hooks/useStrings'
-import {PortfolioTokenDetailProvider} from './common/PortfolioTokenDetailContext'
+import {PortfolioProvider} from './common/PortfolioProvider'
 import {NftsNavigator} from './NftsNavigator'
 import {PortfolioDashboardScreen} from './useCases/PortfolioDashboard/PortfolioDashboardScreen'
 import ExportTokenTransactions from './useCases/PortfolioTokenDetails/ExportTokenTransactions'
@@ -22,7 +22,7 @@ export const PortfolioNavigator = () => {
   const strings = useStrings()
 
   return (
-    <PortfolioTokenDetailProvider>
+    <PortfolioProvider>
       <Stack.Navigator
         screenOptions={{
           ...defaultStackNavigationOptions(atoms, color),
@@ -65,6 +65,6 @@ export const PortfolioNavigator = () => {
           )}
         </Stack.Screen>
       </Stack.Navigator>
-    </PortfolioTokenDetailProvider>
+    </PortfolioProvider>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Portfolio/common/MediaPreview/MediaPreview.tsx b/apps/wallet-mobile/src/features/Portfolio/common/MediaPreview/MediaPreview.tsx
@@ -64,7 +64,13 @@ export const MediaPreview = ({
 
       {loading && (
         <View style={[styles.skeletonWrapper, {width, height}]}>
-          <SkeletonPlaceholder enabled borderRadius={blurRadius} highlightColor={color.gray_200} speed={1000}>
+          <SkeletonPlaceholder
+            enabled
+            borderRadius={blurRadius}
+            backgroundColor={color.gray_100}
+            highlightColor={color.gray_200}
+            speed={1000}
+          >
             <View style={{width, height}} />
           </SkeletonPlaceholder>
         </View>