From 6641e2612cc478e5e9f64059c19ad97e5b1288cb Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 03:46:16 +0200
Subject: [PATCH 01/16] button refactor part 1

---
 apps/wallet-mobile/src/AppNavigator.tsx       | 187 ++++++------
 .../src/components/Button/Button.stories.tsx  | 278 ++++++++++++++----
 .../src/components/Button/Button.tsx          |  86 +-----
 .../src/components/Button/NewButton.tsx       | 195 ++++++++++++
 .../Clipboard/ClipboardProvider.tsx           |  97 ++++++
 .../src/components/CopyButton.tsx             | 100 ++-----
 .../wallet-mobile/src/components/Icon/Ada.tsx |   6 +-
 .../src/components/Icon/Analytics.tsx         |   6 +-
 .../src/components/Icon/AngleDown.tsx         |   6 +-
 .../src/components/Icon/AngleUp.tsx           |   6 +-
 .../src/components/Icon/ArrowDown.tsx         |   7 +-
 .../src/components/Icon/ArrowRight.tsx        |   7 +-
 .../src/components/Icon/Assets.tsx            |   7 +-
 .../src/components/Icon/Backspace.tsx         |   7 +-
 .../src/components/Icon/Backward.tsx          |   7 +-
 .../wallet-mobile/src/components/Icon/Bio.tsx |   7 +-
 .../src/components/Icon/Bluetooth.tsx         |  11 +-
 .../wallet-mobile/src/components/Icon/Bug.tsx |   4 +-
 .../src/components/Icon/Burger.tsx            |   7 +-
 .../src/components/Icon/Cardano.tsx           |  12 +-
 .../src/components/Icon/Catalyst.tsx          |   7 +-
 .../src/components/Icon/Categories.tsx        |   7 +-
 .../src/components/Icon/Change.tsx            |   8 +-
 .../src/components/Icon/Check.tsx             |   9 +-
 .../src/components/Icon/CheckFilled.tsx       |   7 +-
 .../src/components/Icon/CheckFilled2.tsx      |   7 +-
 .../src/components/Icon/CheckOutlined.tsx     |   7 +-
 .../src/components/Icon/Checkbox.tsx          |  12 +-
 .../src/components/Icon/Chevron.tsx           |   9 +-
 .../src/components/Icon/Clock.tsx             |   7 +-
 .../src/components/Icon/Close.tsx             |   7 +-
 .../src/components/Icon/Coins.tsx             |   7 +-
 .../src/components/Icon/Coins2.tsx            |   7 +-
 .../src/components/Icon/Collateral.tsx        |   7 +-
 .../src/components/Icon/Connection.tsx        |   7 +-
 .../src/components/Icon/Copy.tsx              |   7 +-
 .../src/components/Icon/CopySuccess.tsx       |   7 +-
 .../src/components/Icon/Cross.tsx             |   7 +-
 .../src/components/Icon/CrossCircle.tsx       |   7 +-
 .../src/components/Icon/DApp.tsx              |   7 +-
 .../src/components/Icon/Danger.tsx            |   7 +-
 .../src/components/Icon/DappConnector.tsx     |   7 +-
 .../src/components/Icon/Delete.tsx            |   7 +-
 .../src/components/Icon/Device.tsx            |   7 +-
 .../src/components/Icon/DigitalAsset.tsx      |   7 +-
 .../src/components/Icon/Direction.tsx         |   8 +-
 .../src/components/Icon/Disconnect.tsx        |   7 +-
 .../src/components/Icon/Document.tsx          |  10 +-
 .../src/components/Icon/Drag.tsx              |   7 +-
 .../src/components/Icon/Edit.tsx              |   4 +-
 .../src/components/Icon/EmptyCheckbox.tsx     |  12 +-
 .../src/components/Icon/Emurgo.tsx            |   9 +-
 .../src/components/Icon/Exchange.tsx          |   4 +-
 .../src/components/Icon/Export.tsx            |   4 +-
 .../src/components/Icon/ExternalLink.tsx      |   7 +-
 .../src/components/Icon/EyeOff.tsx            |   7 +-
 .../src/components/Icon/EyeOn.tsx             |   7 +-
 .../src/components/Icon/Facebook.tsx          |   7 +-
 .../src/components/Icon/Forward.tsx           |   7 +-
 .../src/components/Icon/Gear.tsx              |   7 +-
 .../src/components/Icon/Github.tsx            |   7 +-
 .../src/components/Icon/Globe.tsx             |   7 +-
 .../src/components/Icon/Google.tsx            |   6 +-
 .../src/components/Icon/Governance.tsx        |   7 +-
 .../src/components/Icon/HardwareWallet.tsx    |  12 +-
 .../src/components/Icon/Icon.stories.tsx      |  22 +-
 .../src/components/Icon/Image.tsx             |   7 +-
 .../src/components/Icon/Info.tsx              |  11 +-
 .../src/components/Icon/InfoCircle.tsx        |   7 +-
 .../src/components/Icon/Language.tsx          |  11 +-
 .../src/components/Icon/Launchpad.tsx         |   7 +-
 .../src/components/Icon/Ledger.tsx            |  12 +-
 .../src/components/Icon/Lightning.tsx         |   7 +-
 .../src/components/Icon/Link.tsx              |   7 +-
 .../src/components/Icon/Lock.tsx              |   7 +-
 .../src/components/Icon/LockFilled.tsx        |   7 +-
 .../src/components/Icon/Logout.tsx            |   7 +-
 .../src/components/Icon/Magnify.tsx           |   7 +-
 .../src/components/Icon/Megaphone.tsx         |   7 +-
 .../src/components/Icon/Message.tsx           |   7 +-
 .../src/components/Icon/MinSwap.tsx           |   6 +-
 .../src/components/Icon/MuesliSwap.tsx        |   6 +-
 .../src/components/Icon/MultiParty.tsx        |   9 +-
 .../src/components/Icon/MultipleWallets.tsx   |   7 +-
 .../src/components/Icon/NftAsset.tsx          |   7 +-
 .../src/components/Icon/NoNfts.tsx            |   6 +-
 .../wallet-mobile/src/components/Icon/Pin.tsx |   7 +-
 .../src/components/Icon/Placeholder.tsx       |   7 +-
 .../src/components/Icon/PlateNumber.tsx       |   7 +-
 .../src/components/Icon/Plus.tsx              |   7 +-
 .../src/components/Icon/PlusCircle.tsx        |   7 +-
 .../src/components/Icon/Portfolio.tsx         |   7 +-
 apps/wallet-mobile/src/components/Icon/Qr.tsx |   7 +-
 .../src/components/Icon/QuestionMark.tsx      |   7 +-
 .../src/components/Icon/Received.tsx          |   7 +-
 .../src/components/Icon/Refresh.tsx           |   8 +-
 .../src/components/Icon/Reload.tsx            |   7 +-
 .../src/components/Icon/Resync.tsx            |   7 +-
 .../components/Icon/RewardManuallyPayout.tsx  |  10 +-
 .../src/components/Icon/RewardWithdrawn.tsx   |  10 +-
 .../src/components/Icon/Sandbox.tsx           |   7 +-
 .../src/components/Icon/Send.tsx              |   7 +-
 .../src/components/Icon/Settings.tsx          |   7 +-
 .../src/components/Icon/Share.tsx             |   7 +-
 .../src/components/Icon/Share2.tsx            |   7 +-
 .../src/components/Icon/SliderSettings.tsx    |   7 +-
 .../src/components/Icon/SortTable.tsx         |   7 +-
 .../src/components/Icon/SpectrumSwap.tsx      |   6 +-
 .../src/components/Icon/Square.tsx            |   7 +-
 .../src/components/Icon/Staking.tsx           |   7 +-
 .../Icon/StakingKeyDeregistered.tsx           |  10 +-
 .../components/Icon/StakingKeyRegistered.tsx  |  10 +-
 .../src/components/Icon/StarFilled.tsx        |   7 +-
 .../src/components/Icon/StarOutlined.tsx      |   7 +-
 .../src/components/Icon/SundaeSwap.tsx        |   6 +-
 .../src/components/Icon/Support.tsx           |   7 +-
 .../src/components/Icon/Swap.tsx              |   4 +-
 .../src/components/Icon/Switch.tsx            |   4 +-
 .../src/components/Icon/TabDiscover.tsx       |   7 +-
 .../src/components/Icon/TabDiscoverActive.tsx |   7 +-
 .../src/components/Icon/TabMenu.tsx           |   7 +-
 .../src/components/Icon/TabMenuActive.tsx     |   7 +-
 .../src/components/Icon/TabPortfolio.tsx      |   4 +-
 .../components/Icon/TabPortfolioActive.tsx    |   7 +-
 .../src/components/Icon/TabStaking.tsx        |   4 +-
 .../src/components/Icon/TabWallet.tsx         |   7 +-
 .../src/components/Icon/TabWalletActive.tsx   |   7 +-
 .../src/components/Icon/Table.tsx             |   7 +-
 .../src/components/Icon/Telegram.tsx          |   7 +-
 .../src/components/Icon/TermsOfUse.tsx        |   7 +-
 .../src/components/Icon/Theme.tsx             |   7 +-
 .../src/components/Icon/ThumbsUp.tsx          |   7 +-
 .../src/components/Icon/Tokens.tsx            |   7 +-
 .../src/components/Icon/TotalAda.tsx          |  13 +-
 .../src/components/Icon/TotalDelegated.tsx    |  15 +-
 .../src/components/Icon/TotalReward.tsx       |  13 +-
 .../src/components/Icon/Transaction.tsx       |   7 +-
 .../src/components/Icon/Twitter.tsx           |   7 +-
 .../wallet-mobile/src/components/Icon/Usb.tsx |  11 +-
 .../src/components/Icon/Verify.tsx            |   8 +-
 .../src/components/Icon/VyfiSwap.tsx          |   6 +-
 .../src/components/Icon/Wallet.tsx            |   7 +-
 .../src/components/Icon/WalletAvatar.tsx      |   8 +-
 .../src/components/Icon/WalletStack.tsx       |   7 +-
 .../src/components/Icon/Wallets.tsx           |   7 +-
 .../src/components/Icon/Warning.tsx           |   7 +-
 .../src/components/Icon/WingRiders.tsx        |   7 +-
 .../src/components/Icon/YoroiApp.tsx          |   6 +-
 .../src/components/Icon/YoroiNightly.tsx      |   7 +-
 .../src/components/Icon/YoroiWallet.tsx       |  10 +-
 .../src/components/Icon/index.ts              |   5 +
 .../ShareQRCodeCard.stories.tsx               |   1 -
 .../ShareQRCodeCard/ShareQRCodeCard.tsx       |  46 +--
 .../Claim/useCases/AskConfirmation.tsx        |  21 +-
 .../Exchange/common/AmountCard/AmountCard.tsx |   6 +-
 .../common/ShowBuyBanner/BuyBannerBig.tsx     |  12 +-
 .../common/ShowBuyBanner/BuyBannerSmall.tsx   |  13 +-
 .../ChooseBiometricLoginScreen.tsx            |  12 +-
 .../MediaDetailsScreen/MediaDetailsScreen.tsx |  25 +-
 .../common/TokenAmountItem/TokenInfoIcon.tsx  |   2 +-
 .../BuyADABanner/BuyADABanner.tsx             |  17 +-
 .../DashboardTokensList/TradeTokensBanner.tsx |  17 +-
 .../PortfolioTokenDetails/Actions.tsx         |  21 +-
 .../PortfolioTokenInfo/Overview/Overview.tsx  |  17 +-
 .../TradeTokensBannerBig.tsx                  |  17 +-
 .../AddressDetailCard/AddressDetailCard.tsx   |  10 +-
 .../SingleOrMultipleAddressesModal.tsx        |  21 +-
 .../SmallAddressCard/SmallAddressCard.tsx     |  36 +--
 .../DescribeSelectedAddressScreen.tsx         |  49 ++-
 .../useCases/ListMultipleAddressesScreen.tsx  |   2 +-
 .../useCases/RequestSpecificAmountScreen.tsx  |  32 +-
 .../useCases/ShowQrCode/ShowQrCode.tsx        |   8 +-
 .../Settings/SettingsScreenNavigator.tsx      |   4 +-
 .../common/ButtonCard/ButtonCard.tsx          |   6 +-
 .../CardAboutPhrase/CardAboutPhrase.tsx       |   6 +-
 .../ChooseMnemonicTypeScreen.tsx              |   4 +-
 .../ChooseSetupType/ChooseSetupTypeScreen.tsx |   6 +-
 .../CreateWallet/RecoveryPhraseScreen.tsx     |  10 +-
 .../VerifyRecoveryPhraseScreen.tsx            |   2 +-
 .../CreateWallet/WalletDetailsScreen.tsx      |   2 +-
 .../RestoreHwWallet/SaveNanoXScreen.tsx       |   2 +-
 .../SelectHwConnectionModal.tsx               |  20 +-
 .../MnemonicInput/MnemonicInput.tsx           |   6 +-
 .../RestoreWalletDetailsScreen.tsx            |   2 +-
 .../Swap/common/AmountCard/AmountCard.tsx     |   8 +-
 .../EditBuyAmount/EditBuyAmount.tsx           |   2 +-
 .../EditSellAmount/EditSellAmount.tsx         |   2 +-
 .../ListOrders/OpenOrders.tsx                 |  14 +-
 .../TxDetails/AddressModal/AddressModal.tsx   |  32 +-
 .../useCases/TxDetails/TxDetails.tsx          |  13 +-
 .../useCases/TxHistory/ActionsBanner.tsx      |  33 +--
 apps/wallet-mobile/src/hooks/useCopy.ts       |  22 --
 .../src/legacy/Dashboard/UserSummary.tsx      |  21 +-
 .../Staking/FailedTx/FailedTxScreen.tsx       |   9 +-
 .../PoolTransition/PoolTransitionModal.tsx    |  27 +-
 .../messages/src/AppNavigator.json            |  32 +-
 .../MediaDetailsScreen.json                   |  88 +++---
 .../src/legacy/Dashboard/UserSummary.json     |  32 +-
 .../Staking/FailedTx/FailedTxScreen.json      |  32 +-
 199 files changed, 1245 insertions(+), 1604 deletions(-)
 create mode 100644 apps/wallet-mobile/src/components/Button/NewButton.tsx
 create mode 100644 apps/wallet-mobile/src/components/Clipboard/ClipboardProvider.tsx
 delete mode 100644 apps/wallet-mobile/src/hooks/useCopy.ts

diff --git a/apps/wallet-mobile/src/AppNavigator.tsx b/apps/wallet-mobile/src/AppNavigator.tsx
index 9057d5410f..23503bdffd 100644
--- a/apps/wallet-mobile/src/AppNavigator.tsx
+++ b/apps/wallet-mobile/src/AppNavigator.tsx
@@ -9,6 +9,7 @@ import {Alert, AppState, AppStateStatus, InteractionManager, Platform} from 'rea
 import RNBootSplash from 'react-native-bootsplash'
 
 import StorybookScreen from '../.storybook'
+import {ClipboardProvider} from './components/Clipboard/ClipboardProvider'
 import {ModalProvider} from './components/Modal/ModalContext'
 import {ModalScreen} from './components/Modal/ModalScreen'
 import {useAuth} from './features/Auth/AuthProvider'
@@ -100,114 +101,116 @@ export const AppNavigator = () => {
       onReady={onReady}
       ref={navRef}
     >
-      <ModalProvider>
-        <Stack.Navigator
-          screenOptions={{
-            ...navOptions,
-            headerShown: false /* used only for transition */,
-          }}
-        >
-          {/* Not Authenticated */}
-
-          {isLoggedOut && (
-            <Stack.Group>
-              {firstAction === 'first-run' && (
-                <Stack.Screen name="first-run">
-                  {() => (
-                    <SearchProvider>
-                      <InitializationNavigator />
-                    </SearchProvider>
-                  )}
-                </Stack.Screen>
-              )}
-
-              {firstAction === 'show-agreement-changed-notice' && (
-                <Stack.Screen name="agreement-changed-notice">{() => <AgreementChangedNavigator />}</Stack.Screen>
-              )}
-
-              {firstAction === 'auth-with-pin' && (
-                <Stack.Screen
-                  name="custom-pin-auth"
-                  component={PinLoginScreen}
-                  options={{title: strings.loginPinTitle}}
-                />
-              )}
-
-              {firstAction === 'auth-with-os' && (
-                <Stack.Screen name="bio-auth-initial" component={OsLoginScreen} options={{headerShown: false}} />
-              )}
-
-              {firstAction === 'request-new-pin' && (
-                <Stack.Screen //
-                  name="enable-login-with-pin"
-                  component={CreatePinScreenWrapper}
-                  options={{title: strings.customPinTitle}}
-                />
-              )}
-            </Stack.Group>
-          )}
-
-          {/* Authenticated */}
-
-          {isLoggedIn && (
-            <>
+      <ClipboardProvider>
+        <ModalProvider>
+          <Stack.Navigator
+            screenOptions={{
+              ...navOptions,
+              headerShown: false /* used only for transition */,
+            }}
+          >
+            {/* Not Authenticated */}
+
+            {isLoggedOut && (
               <Stack.Group>
-                {afterLoginAction === 'choose-biometric-login' && (
-                  <Stack.Screen //
-                    name="choose-biometric-login"
-                    options={{headerShown: false}}
-                    component={ChooseBiometricLoginScreen}
-                  />
+                {firstAction === 'first-run' && (
+                  <Stack.Screen name="first-run">
+                    {() => (
+                      <SearchProvider>
+                        <InitializationNavigator />
+                      </SearchProvider>
+                    )}
+                  </Stack.Screen>
                 )}
 
-                {afterLoginAction === 'dark-theme-announcement' && (
-                  <Stack.Screen //
-                    name="dark-theme-announcement"
-                    options={{headerShown: false}}
-                    component={DarkThemeAnnouncement}
-                  />
+                {firstAction === 'show-agreement-changed-notice' && (
+                  <Stack.Screen name="agreement-changed-notice">{() => <AgreementChangedNavigator />}</Stack.Screen>
                 )}
 
-                {afterLoginAction === 'setup-wallet' && (
-                  <Stack.Screen //
-                    name="setup-wallet"
-                    options={{headerShown: false}}
-                    component={SetupWalletNavigator}
+                {firstAction === 'auth-with-pin' && (
+                  <Stack.Screen
+                    name="custom-pin-auth"
+                    component={PinLoginScreen}
+                    options={{title: strings.loginPinTitle}}
                   />
                 )}
 
-                {afterLoginAction === 'manage-wallets' && (
-                  <Stack.Screen name="manage-wallets" getComponent={() => WalletNavigator} />
+                {firstAction === 'auth-with-os' && (
+                  <Stack.Screen name="bio-auth-initial" component={OsLoginScreen} options={{headerShown: false}} />
                 )}
-              </Stack.Group>
 
-              <Stack.Group
-                screenOptions={{
-                  presentation: 'transparentModal',
-                  ...(Platform.OS === 'android' && {...TransitionPresets.DefaultTransition}), // overriding general navigation settings
-                  cardStyle: {backgroundColor: 'transparent'}, // this is needed for the modal to be transparent
-                }}
-              >
-                <Stack.Screen name="modal" component={ModalScreen} />
+                {firstAction === 'request-new-pin' && (
+                  <Stack.Screen //
+                    name="enable-login-with-pin"
+                    component={CreatePinScreenWrapper}
+                    options={{title: strings.customPinTitle}}
+                  />
+                )}
               </Stack.Group>
-            </>
-          )}
+            )}
+
+            {/* Authenticated */}
+
+            {isLoggedIn && (
+              <>
+                <Stack.Group>
+                  {afterLoginAction === 'choose-biometric-login' && (
+                    <Stack.Screen //
+                      name="choose-biometric-login"
+                      options={{headerShown: false}}
+                      component={ChooseBiometricLoginScreen}
+                    />
+                  )}
+
+                  {afterLoginAction === 'dark-theme-announcement' && (
+                    <Stack.Screen //
+                      name="dark-theme-announcement"
+                      options={{headerShown: false}}
+                      component={DarkThemeAnnouncement}
+                    />
+                  )}
 
-          {/* Development */}
+                  {afterLoginAction === 'setup-wallet' && (
+                    <Stack.Screen //
+                      name="setup-wallet"
+                      options={{headerShown: false}}
+                      component={SetupWalletNavigator}
+                    />
+                  )}
 
-          {__DEV__ && (
-            <Stack.Group>
-              <Stack.Screen name="developer" component={DeveloperScreen} options={{headerShown: false}} />
+                  {afterLoginAction === 'manage-wallets' && (
+                    <Stack.Screen name="manage-wallets" getComponent={() => WalletNavigator} />
+                  )}
+                </Stack.Group>
+
+                <Stack.Group
+                  screenOptions={{
+                    presentation: 'transparentModal',
+                    ...(Platform.OS === 'android' && {...TransitionPresets.DefaultTransition}), // overriding general navigation settings
+                    cardStyle: {backgroundColor: 'transparent'}, // this is needed for the modal to be transparent
+                  }}
+                >
+                  <Stack.Screen name="modal" component={ModalScreen} />
+                </Stack.Group>
+              </>
+            )}
+
+            {/* Development */}
+
+            {__DEV__ && (
+              <Stack.Group>
+                <Stack.Screen name="developer" component={DeveloperScreen} options={{headerShown: false}} />
 
-              <Stack.Screen name="storybook" component={StorybookScreen} />
+                <Stack.Screen name="storybook" component={StorybookScreen} />
 
-              <Stack.Screen name="playground" component={Playground} />
+                <Stack.Screen name="playground" component={Playground} />
 
-              <Stack.Screen name="portfolio-dashboard" component={PortfolioScreen} />
-            </Stack.Group>
-          )}
-        </Stack.Navigator>
-      </ModalProvider>
+                <Stack.Screen name="portfolio-dashboard" component={PortfolioScreen} />
+              </Stack.Group>
+            )}
+          </Stack.Navigator>
+        </ModalProvider>
+      </ClipboardProvider>
     </NavigationContainer>
   )
 }
diff --git a/apps/wallet-mobile/src/components/Button/Button.stories.tsx b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
index 43c1c62fe3..104b316ea1 100644
--- a/apps/wallet-mobile/src/components/Button/Button.stories.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
@@ -1,100 +1,252 @@
-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 {Accordion} from '../Accordion/Accordion'
 import {Icon} from '../Icon'
-import {Button} from './Button'
+import {Button, ButtonType} from './NewButton'
 
 storiesOf('Button', module).add('default', () => {
   const {color, isDark, selectThemeName} = useTheme()
+  const [expanded, setExpanded] = React.useState<ButtonType | null>(ButtonType.Primary)
 
   return (
-    <ScrollView style={{backgroundColor: color.bg_color_max}}>
-      <Row>
+    <ScrollView style={{backgroundColor: color.bg_color_max, padding: 16}}>
+      <Grid>
         <Button
           onPress={() => {
             selectThemeName(isDark ? 'default-light' : 'default-dark')
           }}
-          title="Toggle theme"
+          icon={Icon.Theme}
         />
-      </Row>
 
-      <Row>
-        <Button onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+        <View style={{flexDirection: 'row', gap: 16, paddingVertical: 16}}>
+          <Button type={ButtonType.Secondary} title="Cancel" />
 
-      <Row>
-        <Button block onPress={() => action('onPress')()} title="submit" />
-      </Row>
+          <Button title="Continue" icon={Icon.Bluetooth} />
+        </View>
+      </Grid>
 
-      <Row>
-        <Button block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+      <Accordion
+        label={ButtonType.Primary}
+        expanded={expanded === ButtonType.Primary}
+        onChange={() => setExpanded(expanded === ButtonType.Primary ? null : ButtonType.Primary)}
+      >
+        <Grid>
+          <Button title="Button" />
 
-      <Row>
-        <Button outlineOnLight block shelleyTheme onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+          <Button title="Button" isLoading />
 
-      <Row>
-        <Button outlineOnLight block shelleyTheme disabled onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+          <Button title="Button" disabled />
+        </Grid>
 
-      <Row>
-        <Button block outlineShelley outlineOnLight disabled onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+        <Grid>
+          <Button title="Button" icon={Icon.Clock} />
 
-      <Row>
-        <Button outlineOnLight block onPress={() => action('onPress')()} title="Submit" />
-      </Row>
+          <Button title="Button" icon={Icon.Clock} disabled />
+        </Grid>
 
-      <Row>
-        <Button
-          outlineShelley
-          withoutBackground
-          shelleyTheme
-          block
-          onPress={() => action('onPress')()}
-          title="Submit"
-        />
-      </Row>
+        <Grid>
+          <Button title="Button" size="S" />
 
-      <Row>
-        <Button block shelleyTheme iconImage={icon} onPress={() => action('onPress')()} title="Submit, with image" />
-      </Row>
+          <Button title="Button" size="S" isLoading />
 
-      <Row>
-        <Button
-          block
-          shelleyTheme
-          startContent={<Icon.Plus size={24} color="white" />}
-          onPress={() => action('onPress')()}
-          title="Submit, with start content"
-        />
-      </Row>
+          <Button title="Button" size="S" disabled />
+        </Grid>
 
-      <Row>
-        <Button
-          block
-          shelleyTheme
-          endContent={<Icon.Plus size={24} color="white" />}
-          onPress={() => action('onPress')()}
-          title="Submit, with end content"
-        />
-      </Row>
+        <Grid>
+          <Button title="Button" size="S" icon={Icon.Clock} />
+
+          <Button title="Button" size="S" icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.Secondary}
+        expanded={expanded === ButtonType.Secondary}
+        onChange={() => setExpanded(expanded === ButtonType.Secondary ? null : ButtonType.Secondary)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.Secondary} />
+
+          <Button title="Button" type={ButtonType.Secondary} isLoading />
+
+          <Button title="Button" type={ButtonType.Secondary} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Secondary} icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Secondary} icon={Icon.Clock} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Secondary} size="S" />
+
+          <Button title="Button" type={ButtonType.Secondary} size="S" isLoading />
+
+          <Button title="Button" type={ButtonType.Secondary} size="S" disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Secondary} size="S" icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Secondary} size="S" icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.Critical}
+        expanded={expanded === ButtonType.Critical}
+        onChange={() => setExpanded(expanded === ButtonType.Critical ? null : ButtonType.Critical)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.Critical} />
+
+          <Button title="Button" type={ButtonType.Critical} isLoading />
+
+          <Button title="Button" type={ButtonType.Critical} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Critical} icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Critical} icon={Icon.Clock} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Critical} size="S" />
+
+          <Button title="Button" type={ButtonType.Critical} size="S" isLoading />
+
+          <Button title="Button" type={ButtonType.Critical} size="S" disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Critical} size="S" icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Critical} size="S" icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.Text}
+        expanded={expanded === ButtonType.Text}
+        onChange={() => setExpanded(expanded === ButtonType.Text ? null : ButtonType.Text)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.Text} />
+
+          <Button title="Button" type={ButtonType.Text} isLoading />
+
+          <Button title="Button" type={ButtonType.Text} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Text} icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Text} icon={Icon.Clock} rightIcon />
+
+          <Button title="Button" type={ButtonType.Text} icon={Icon.Clock} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Text} size="S" />
+
+          <Button title="Button" type={ButtonType.Text} size="S" isLoading />
+
+          <Button title="Button" type={ButtonType.Text} size="S" disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Text} size="S" icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Text} size="S" icon={Icon.Clock} rightIcon />
+
+          <Button title="Button" type={ButtonType.Text} size="S" icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.SecondaryText}
+        expanded={expanded === ButtonType.SecondaryText}
+        onChange={() => setExpanded(expanded === ButtonType.SecondaryText ? null : ButtonType.SecondaryText)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.SecondaryText} />
+
+          <Button title="Button" type={ButtonType.SecondaryText} isLoading />
+
+          <Button title="Button" type={ButtonType.SecondaryText} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.SecondaryText} icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.SecondaryText} icon={Icon.Clock} rightIcon />
+
+          <Button title="Button" type={ButtonType.SecondaryText} icon={Icon.Clock} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" />
+
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" isLoading />
+
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" icon={Icon.Clock} rightIcon />
+
+          <Button title="Button" type={ButtonType.SecondaryText} size="S" icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.Circle}
+        expanded={expanded === ButtonType.Circle}
+        onChange={() => setExpanded(expanded === ButtonType.Circle ? null : ButtonType.Circle)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.Circle} icon={Icon.Clock} />
+
+          <Button title="Button" type={ButtonType.Circle} icon={Icon.Clock} disabled />
+        </Grid>
+      </Accordion>
+
+      <Accordion
+        label={ButtonType.Link}
+        expanded={expanded === ButtonType.Link}
+        onChange={() => setExpanded(expanded === ButtonType.Link ? null : ButtonType.Link)}
+      >
+        <Grid>
+          <Button title="Button" type={ButtonType.Link} />
+
+          <Button title="Button" type={ButtonType.Link} disabled />
+        </Grid>
+
+        <Grid>
+          <Button title="Button" type={ButtonType.Link} size="S" />
+
+          <Button title="Button" type={ButtonType.Link} size="S" disabled />
+        </Grid>
+      </Accordion>
     </ScrollView>
   )
 })
 
-const Row = (props: ViewProps) => <View {...props} style={styles.row} />
+const Grid = (props: ViewProps) => <View {...props} style={styles.grid} />
 
 const styles = StyleSheet.create({
-  row: {
+  grid: {
     flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: 16,
+    paddingVertical: 16,
     alignItems: 'center',
-    paddingHorizontal: 16,
-    paddingVertical: 8,
   },
 })
diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
index eb45b20914..36f6534abc 100644
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.tsx
@@ -1,30 +1,19 @@
-import {isNumber} from '@yoroi/common'
 import {useTheme} from '@yoroi/theme'
-import React, {type ReactNode} from 'react'
-import {Image, StyleSheet, TextStyle, TouchableOpacity, TouchableOpacityProps, View, ViewStyle} from 'react-native'
-import Animated, {FadeInDown, FadeOutDown, Layout} from 'react-native-reanimated'
+import React from 'react'
+import {StyleSheet, TextStyle, TouchableOpacity, TouchableOpacityProps, View, ViewStyle} from 'react-native'
 
 import {Text} from '../Text'
 
-export type ButtonProps = TouchableOpacityProps & {
+export type ButtonProps = {
   title: string
-  outline?: boolean
   outlineOnLight?: boolean
   containerStyle?: ViewStyle
   block?: boolean
-  iconImage?: number | ReactNode
-  withoutBackground?: boolean
   shelleyTheme?: boolean
-  mainTheme?: boolean
   warningTheme?: boolean
   outlineShelley?: boolean
   textStyles?: TextStyle
-  isCopying?: boolean
-  copiedText?: string
-  testId?: string
-  startContent?: ReactNode
-  endContent?: ReactNode
-}
+} & TouchableOpacityProps
 
 export const Button = (props: ButtonProps) => {
   const {
@@ -33,59 +22,28 @@ export const Button = (props: ButtonProps) => {
     block,
     style,
     containerStyle,
-    outline,
     outlineOnLight,
-    iconImage,
-    withoutBackground,
     shelleyTheme,
-    mainTheme,
     outlineShelley,
     textStyles,
-    isCopying,
-    copiedText,
-    testId,
-    startContent,
-    endContent,
-    warningTheme,
     ...rest
   } = props
 
   const {styles} = useStyles()
-  const {isDark} = useTheme()
 
   return (
-    <TouchableOpacity
-      onPress={onPress}
-      style={[block && styles.block, containerStyle]}
-      activeOpacity={0.5}
-      testID={testId}
-      {...rest}
-    >
-      {isCopying && (
-        <Animated.View layout={Layout} entering={FadeInDown} exiting={FadeOutDown} style={styles.isCopying}>
-          <Text style={styles.copiedText}>{copiedText}</Text>
-        </Animated.View>
-      )}
-
+    <TouchableOpacity onPress={onPress} style={[block && styles.block, containerStyle]} activeOpacity={0.5} {...rest}>
       <View
         style={[
           styles.button,
-          outline && styles.buttonOutline,
           outlineOnLight && styles.buttonOutlineOnLight,
           props.disabled && styles.buttonDisabled,
-          withoutBackground && styles.buttonTransparent,
           outlineShelley && styles.buttonOutlineShelley,
           shelleyTheme && styles.shelleyTheme,
-          mainTheme && styles.mainTheme,
-          warningTheme && styles.warningTheme,
           outlineOnLight && shelleyTheme && styles.shelleyOutlineOnLight,
           style,
         ]}
       >
-        {isNumber(iconImage) ? <Image source={iconImage} /> : React.isValidElement(iconImage) ? iconImage : null}
-
-        {startContent != null ? startContent : null}
-
         <Text
           style={[
             styles.text,
@@ -93,14 +51,11 @@ export const Button = (props: ButtonProps) => {
             outlineOnLight && shelleyTheme && styles.textShelleyOutlineOnLight,
             outlineShelley && styles.textOutlineShelley,
             props.disabled && !outlineOnLight && styles.buttonDisabledText,
-            warningTheme && isDark && styles.warningThemeText,
             textStyles,
           ]}
         >
           {title}
         </Text>
-
-        {endContent != null ? endContent : null}
       </View>
     </TouchableOpacity>
   )
@@ -127,15 +82,6 @@ const useStyles = () => {
       alignItems: 'center',
       justifyContent: 'center',
     },
-    buttonTransparent: {
-      backgroundColor: 'transparent',
-    },
-    buttonOutline: {
-      ...buttonOutline,
-    },
-    mainTheme: {
-      backgroundColor: color.primary_500,
-    },
     buttonOutlineOnLight: {
       ...buttonOutline,
       borderColor: color.secondary_500,
@@ -175,28 +121,6 @@ const useStyles = () => {
       color: color.primary_600,
       fontWeight: '600',
     },
-    isCopying: {
-      position: 'absolute',
-      backgroundColor: color.gray_max,
-      alignItems: 'center',
-      justifyContent: 'center',
-      top: -50,
-      alignSelf: 'center',
-      borderRadius: 4,
-      zIndex: 10,
-    },
-    copiedText: {
-      color: color.gray_min,
-      textAlign: 'center',
-      ...atoms.p_sm,
-      ...atoms.body_2_md_medium,
-    },
-    warningTheme: {
-      backgroundColor: color.sys_magenta_500,
-    },
-    warningThemeText: {
-      color: color.gray_min,
-    },
   })
 
   return {styles} as const
diff --git a/apps/wallet-mobile/src/components/Button/NewButton.tsx b/apps/wallet-mobile/src/components/Button/NewButton.tsx
new file mode 100644
index 0000000000..45d35291ea
--- /dev/null
+++ b/apps/wallet-mobile/src/components/Button/NewButton.tsx
@@ -0,0 +1,195 @@
+import {useTheme} from '@yoroi/theme'
+import React from 'react'
+import {ActivityIndicator, Pressable, PressableProps, StyleSheet, TextStyle, View, ViewStyle} from 'react-native'
+
+import type {IconProps} from '../Icon'
+import {Text} from '../Text'
+
+export const ButtonType = {
+  Primary: 'Primary',
+  Secondary: 'Secondary',
+  Critical: 'Critical',
+  Text: 'Text',
+  SecondaryText: 'SecondaryText',
+  Circle: 'Circle',
+  Link: 'Link',
+} as const
+
+export type ButtonType = (typeof ButtonType)[keyof typeof ButtonType]
+
+export type ButtonProps = {
+  type?: ButtonType
+  size?: 'M' | 'S'
+  title?: string
+  icon?: (p: IconProps) => React.JSX.Element
+  isLoading?: boolean
+  rightIcon?: boolean
+  style?: ViewStyle
+  fontOverride?: TextStyle
+} & Omit<PressableProps, 'style' | 'children'>
+
+export const Button = (props: ButtonProps) => {
+  const {type, size, title, icon: Icon, isLoading, rightIcon, disabled, style, fontOverride, ...rest} = props
+
+  const {styles, iconProps, iconPropsPressed} = useStyles({type, size, rightIcon, disabled, fontOverride})
+
+  return (
+    <Pressable
+      disabled={isLoading || disabled}
+      style={({pressed}) => [styles.container, pressed && styles.containerPressed, style]}
+      {...rest}
+    >
+      {isLoading ? (
+        <ActivityIndicator {...iconProps} />
+      ) : (
+        ({pressed}) => (
+          <>
+            {Icon && (
+              <View style={styles.iconWrapper}>
+                <Icon {...(pressed ? iconPropsPressed : iconProps)} />
+              </View>
+            )}
+
+            {title != null && type !== ButtonType.Circle && (
+              <Text style={[styles.text, pressed && styles.textPressed]}>{title}</Text>
+            )}
+          </>
+        )
+      )}
+    </Pressable>
+  )
+}
+
+type Colors = {
+  idle: string
+  pressed: string
+  disabled: string
+}
+
+const useStyles = ({
+  type = ButtonType.Primary,
+  size = 'M',
+  rightIcon,
+  disabled,
+  fontOverride,
+}: Pick<ButtonProps, 'type' | 'size' | 'rightIcon' | 'disabled' | 'fontOverride'>) => {
+  const {color, atoms} = useTheme()
+
+  const backgroundColors: Colors = {
+    [ButtonType.Primary]: {idle: color.primary_500, pressed: color.primary_600, disabled: color.primary_200},
+    [ButtonType.Secondary]: {idle: 'transparent', pressed: color.primary_100, disabled: 'transparent'},
+    [ButtonType.Critical]: {
+      idle: color.sys_magenta_500,
+      pressed: color.sys_magenta_600,
+      disabled: color.sys_magenta_300,
+    },
+    [ButtonType.Text]: {idle: 'transparent', pressed: color.gray_100, disabled: 'transparent'},
+    [ButtonType.SecondaryText]: {idle: 'transparent', pressed: color.gray_100, disabled: 'transparent'},
+    [ButtonType.Circle]: {idle: color.primary_500, pressed: color.primary_600, disabled: color.primary_200},
+    [ButtonType.Link]: {idle: 'transparent', pressed: 'transparent', disabled: 'transparent'},
+  }[type]
+
+  const foregroundColors: Colors = {
+    [ButtonType.Primary]: {idle: color.white_static, pressed: color.white_static, disabled: color.gray_min},
+    [ButtonType.Secondary]: {
+      idle: color.text_primary_medium,
+      pressed: color.text_primary_max,
+      disabled: color.text_primary_min,
+    },
+    [ButtonType.Critical]: {idle: color.white_static, pressed: color.white_static, disabled: color.white_static},
+    [ButtonType.Text]: {
+      idle: color.text_primary_medium,
+      pressed: color.text_primary_max,
+      disabled: color.text_primary_min,
+    },
+    [ButtonType.SecondaryText]: {
+      idle: color.text_gray_medium,
+      pressed: color.text_gray_max,
+      disabled: color.text_gray_min,
+    },
+    [ButtonType.Circle]: {idle: color.white_static, pressed: color.white_static, disabled: color.gray_min},
+    [ButtonType.Link]: {
+      idle: color.text_primary_medium,
+      pressed: color.text_primary_max,
+      disabled: color.text_primary_min,
+    },
+  }[type]
+
+  const backgroundColor = disabled ? backgroundColors.disabled : backgroundColors.idle
+  const foregroundColor = disabled ? foregroundColors.disabled : foregroundColors.idle
+
+  let shape: ViewStyle = {}
+  switch (type) {
+    case ButtonType.Primary:
+    case ButtonType.Secondary:
+    case ButtonType.Critical:
+      shape =
+        size === 'M'
+          ? {...atoms.py_lg, ...atoms.px_xl, ...atoms.gap_sm, ...atoms.rounded_sm}
+          : {...atoms.py_md, ...atoms.px_lg, ...atoms.gap_xs, ...atoms.rounded_sm}
+      break
+    case ButtonType.Text:
+    case ButtonType.SecondaryText:
+    case ButtonType.Link:
+      shape =
+        size === 'M'
+          ? {...atoms.p_md, ...atoms.gap_xs, ...atoms.rounded_sm}
+          : {...atoms.p_sm, ...atoms.gap_2xs, ...atoms.rounded_sm}
+      break
+    case ButtonType.Circle:
+      shape = {width: 48, height: 48, ...atoms.rounded_full}
+      break
+  }
+  const font =
+    fontOverride ??
+    (type === ButtonType.Link
+      ? size === 'M'
+        ? atoms.link_1_lg
+        : atoms.link_2_md
+      : size === 'M'
+      ? atoms.button_1_lg
+      : atoms.button_2_md)
+
+  const styles = StyleSheet.create({
+    container: {
+      backgroundColor,
+      ...atoms.flex,
+      ...atoms.flex_grow,
+      ...atoms.flex_row,
+      ...atoms.align_start,
+      ...atoms.justify_center,
+      ...shape,
+      ...(rightIcon && atoms.flex_row_reverse),
+      ...(type === ButtonType.Secondary && {borderWidth: 2, borderColor: foregroundColor}),
+    },
+    containerPressed: {
+      backgroundColor: backgroundColors.pressed,
+      ...(type === ButtonType.Secondary && {borderColor: foregroundColors.pressed}),
+    },
+    iconWrapper: {
+      ...atoms.justify_center,
+      height: font.lineHeight ?? 22,
+      overflow: 'visible',
+    },
+    text: {
+      ...atoms.flex_shrink,
+      color: foregroundColor,
+      ...font,
+    },
+    textPressed: {
+      color: foregroundColors.pressed,
+    },
+  })
+
+  const iconProps: IconProps = {
+    size: size === 'M' ? 28 : 24,
+    color: foregroundColor,
+  }
+
+  const iconPropsPressed: IconProps = {
+    size: iconProps.size,
+    color: foregroundColors.pressed,
+  }
+
+  return {styles, iconProps, iconPropsPressed} as const
+}
diff --git a/apps/wallet-mobile/src/components/Clipboard/ClipboardProvider.tsx b/apps/wallet-mobile/src/components/Clipboard/ClipboardProvider.tsx
new file mode 100644
index 0000000000..fabf742b21
--- /dev/null
+++ b/apps/wallet-mobile/src/components/Clipboard/ClipboardProvider.tsx
@@ -0,0 +1,97 @@
+import Clipboard from '@react-native-community/clipboard'
+import {useTheme} from '@yoroi/theme'
+import React from 'react'
+import {GestureResponderEvent, StyleSheet, useWindowDimensions} from 'react-native'
+import Animated, {FadeInDown, FadeOutDown, Layout} from 'react-native-reanimated'
+
+import {Text} from '../Text'
+
+const ClipboardContext = React.createContext<undefined | ClipboardContext>(undefined)
+
+type Props = {
+  children: React.ReactNode
+}
+
+type CopiedState = {
+  feedback: string
+  locationX: number
+  locationY: number
+}
+
+const FEEDBACK_TIMEOUT = 1500
+
+export const ClipboardProvider = ({children}: Props) => {
+  const styles = useStyles()
+  const [copied, setCopied] = React.useState<CopiedState | null>(null)
+  const {height, width} = useWindowDimensions()
+  const copy: ClipboardContext['copy'] = ({text, feedback = 'Copied', event}) => {
+    Clipboard.setString(text)
+    setCopied({
+      feedback,
+      locationY: event ? event.nativeEvent.pageY - 50 : height * 0.85,
+      locationX: (event?.nativeEvent.pageX ?? width * 0.5) - feedback.length * 4,
+    })
+    setTimeout(() => setCopied(null), FEEDBACK_TIMEOUT)
+  }
+
+  return (
+    <ClipboardContext.Provider value={{copy}}>
+      <>
+        {children}
+
+        {copied && (
+          <Animated.View
+            layout={Layout}
+            entering={FadeInDown}
+            exiting={FadeOutDown}
+            style={[styles.isCopying, {top: copied.locationY, left: copied.locationX}]}
+          >
+            <Text style={styles.textCopy}>{copied.feedback}</Text>
+          </Animated.View>
+        )}
+      </>
+    </ClipboardContext.Provider>
+  )
+}
+
+export const useCopy = () => {
+  const {copy: globalCopy} = React.useContext(ClipboardContext) ?? {copy: () => null}
+  const [isCopying, setIsCopying] = React.useState(false)
+  const copy = (props: CopyProps) => {
+    globalCopy(props)
+    setIsCopying(true)
+    setTimeout(() => setIsCopying(false), FEEDBACK_TIMEOUT)
+  }
+
+  return {copy, isCopying}
+}
+
+type CopyProps = {
+  text: string
+  feedback?: string
+  event?: GestureResponderEvent
+}
+type ClipboardContext = {
+  copy: (a: CopyProps) => void
+}
+
+const useStyles = () => {
+  const {atoms, color} = useTheme()
+  const styles = StyleSheet.create({
+    isCopying: {
+      position: 'absolute',
+      backgroundColor: color.gray_max,
+      alignItems: 'center',
+      justifyContent: 'center',
+      borderRadius: 4,
+      zIndex: 10,
+    },
+    textCopy: {
+      textAlign: 'center',
+      ...atoms.p_sm,
+      ...atoms.body_2_md_medium,
+      color: color.gray_min,
+    },
+  })
+  return styles
+}
diff --git a/apps/wallet-mobile/src/components/CopyButton.tsx b/apps/wallet-mobile/src/components/CopyButton.tsx
index 525e73235e..2beca8c003 100644
--- a/apps/wallet-mobile/src/components/CopyButton.tsx
+++ b/apps/wallet-mobile/src/components/CopyButton.tsx
@@ -1,14 +1,13 @@
 import {useTheme} from '@yoroi/theme'
 import React from 'react'
-import {StyleProp, StyleSheet, TouchableOpacity, View, ViewStyle} from 'react-native'
-import Animated, {FadeInDown, FadeOutDown, Layout} from 'react-native-reanimated'
+import {StyleProp, ViewStyle} from 'react-native'
 
-import {Text} from '../../../wallet-mobile/src/components/Text'
 import {Icon} from '../components/Icon'
-import {useCopy} from '../hooks/useCopy'
-import {isEmptyString} from '../kernel/utils'
+import {Button, ButtonType} from './Button/NewButton'
+import {useCopy} from './Clipboard/ClipboardProvider'
 
 type CopyButtonProps = {
+  title?: string
   value: string
   onCopy?: () => void
   children?: React.ReactNode
@@ -16,87 +15,22 @@ type CopyButtonProps = {
   message?: string
 }
 
-export const CopyButton = ({value, onCopy, children, style, message}: CopyButtonProps) => {
-  const [isCopying, copy] = useCopy()
+export const CopyButton = ({title, value, onCopy, message}: CopyButtonProps) => {
+  const {isCopying, copy} = useCopy()
+  const {atoms} = useTheme()
 
   return (
-    <AnimatedCopyButton
-      style={style}
-      isCopying={isCopying}
-      message={message}
-      onCopy={() => {
-        copy(value)
+    <Button
+      type={ButtonType.SecondaryText}
+      fontOverride={atoms.body_1_lg_regular}
+      style={{...atoms.p_0, ...atoms.justify_between}}
+      title={title}
+      icon={isCopying ? Icon.CopySuccess : Icon.Copy}
+      rightIcon
+      onPress={(event) => {
+        copy({text: value, feedback: message, event})
         onCopy?.()
       }}
-    >
-      {children}
-    </AnimatedCopyButton>
+    />
   )
 }
-
-const AnimatedCopyButton = ({
-  onCopy,
-  children,
-  style,
-  isCopying,
-  message,
-}: Omit<CopyButtonProps, 'value'> & {isCopying: boolean; message?: string}) => {
-  const {styles, colors} = useStyles()
-
-  return (
-    <TouchableOpacity onPress={onCopy} disabled={isCopying} testID="copyButton" style={style}>
-      {isCopying ? (
-        <View style={styles.rowContainer}>
-          {!isEmptyString(message) ? (
-            <Animated.View layout={Layout} entering={FadeInDown} exiting={FadeOutDown} style={styles.isCopying}>
-              <Text style={styles.copiedText}>{message}</Text>
-            </Animated.View>
-          ) : (
-            <View />
-          )}
-
-          <Icon.CopySuccess size={26} color={colors.gray} />
-        </View>
-      ) : (
-        <Icon.Copy size={26} color={colors.gray} />
-      )}
-
-      {children}
-    </TouchableOpacity>
-  )
-}
-
-const useStyles = () => {
-  const {color, atoms} = useTheme()
-
-  const colors = {
-    gray: color.gray_900,
-  }
-
-  const styles = StyleSheet.create({
-    isCopying: {
-      position: 'absolute',
-      backgroundColor: color.gray_max,
-      alignItems: 'center',
-      justifyContent: 'center',
-      bottom: 20,
-      right: 10,
-      alignSelf: 'center',
-      borderRadius: 4,
-      zIndex: 10,
-    },
-    copiedText: {
-      color: color.gray_min,
-      textAlign: 'center',
-      padding: 8,
-      flex: 1,
-      ...atoms.body_2_md_medium,
-    },
-    rowContainer: {
-      flexDirection: 'row',
-      alignItems: 'center',
-    },
-  })
-
-  return {styles, colors} as const
-}
diff --git a/apps/wallet-mobile/src/components/Icon/Ada.tsx b/apps/wallet-mobile/src/components/Icon/Ada.tsx
index e48bf52ddf..e1ea54cf12 100644
--- a/apps/wallet-mobile/src/components/Icon/Ada.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Ada.tsx
@@ -1,12 +1,12 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size: number; color?: string}
+import {IconProps} from '.'
 
-export const Ada = ({size, color}: Props) => (
+export const Ada = ({size = 20, color = '#000000'}: IconProps) => (
   <Svg viewBox="0 0 36.993 44" width={size} height={size}>
     <Path
-      fill={color != null ? color : '#000000'}
+      fill={color}
       d="M36.991 26.538c-.053-1.006-.952-1.773-1.984-1.773h-5.61l-1.534-3.89h3.466c1.005 0
       1.931-.74 1.984-1.772a1.838 1.838 0 0 0-1.825-1.932h-5.08l-6.35-16.007A1.848 1.848 0
       0 0 18.338 0c-.74 0-1.429.476-1.72 1.164l-6.085 15.981H5.559c-1.006 0-1.932.74-1.985
diff --git a/apps/wallet-mobile/src/components/Icon/Analytics.tsx b/apps/wallet-mobile/src/components/Icon/Analytics.tsx
index 821260f892..f0e36abb90 100644
--- a/apps/wallet-mobile/src/components/Icon/Analytics.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Analytics.tsx
@@ -1,11 +1,11 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Analytics = ({size = 24, color = '#000'}: Props) => {
+export const Analytics = ({size = 24, color = '#000'}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
+    <Svg width={size} height={size} viewBox="0 0 24 24">
       <Path
         d="M18.065 10.849l-.077-.031a3.019 3.019 0 00-.75-.194l-.825-.1-.158-.018.086-.135 4.925-7.75h0a.826.826 0 01.552-.382.821.821 0 01.665.155s0 0 0 0l-.058.081c.167.117.27.275.313.475a.68.68 0 01-.113.55l-4.56 7.349zm0 0l.044-.07 4.6-7.223-4.644 7.293zM5.912 12.044l2.262 2.646h0l.002.002c.188.207.43.301.718.283a.805.805 0 00.666-.398h0l3.193-5.215 1.038 1.593.045.068.076-.03c.247-.1.495-.186.742-.26.244-.073.497-.126.758-.159l.162-.02-.091-.135-2.075-3.074a.788.788 0 00-.724-.382.785.785 0 00-.695.41l-3.302 5.333-2.236-2.62h0l-.002-.003A.853.853 0 005.73 9.8a.805.805 0 00-.666.397s0 0 0 0L1.29 16.223h0v.002a.885.885 0 00-.114.617.798.798 0 00.34.54c.206.15.431.198.67.141a.872.872 0 00.548-.393v-.001l3.178-5.084zm11.556 8.276a4.276 4.276 0 001.096-.54l2.765 2.74s0 0 0 0a.834.834 0 00.608.255c.236 0 .44-.086.609-.254a.777.777 0 00.241-.6.868.868 0 00-.266-.592l-2.744-2.743c.218-.353.394-.725.53-1.116.145-.419.218-.85.218-1.295 0-1.21-.423-2.24-1.267-3.083-.844-.844-1.874-1.267-3.083-1.267-1.21 0-2.24.423-3.083 1.267-.844.844-1.267 1.874-1.267 3.083 0 1.21.423 2.24 1.267 3.083.844.844 1.873 1.267 3.083 1.267.444 0 .875-.068 1.293-.205zm.586-2.266a2.554 2.554 0 01-1.879.771c-.74 0-1.365-.256-1.88-.77a2.553 2.553 0 01-.77-1.88c0-.74.256-1.365.77-1.88a2.554 2.554 0 011.88-.77c.74 0 1.365.256 1.88.77.514.515.77 1.14.77 1.88s-.256 1.365-.77 1.88z"
         fill={color}
diff --git a/apps/wallet-mobile/src/components/Icon/AngleDown.tsx b/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
index 26b9d5ed6f..cfc5d7b4fc 100644
--- a/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
+++ b/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
@@ -1,12 +1,12 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size: number; color?: string}
+import {IconProps} from '.'
 
-export const AngleDown = ({size, color}: Props) => (
+export const AngleDown = ({size = 16, color = '#CF053A'}: IconProps) => (
   <Svg viewBox="0 0 16 16" width={size} height={size}>
     <Path
-      fill={color != null ? color : '#CF053A'}
+      fill={color}
       d="M7.4985 10.7599C7.76411 11.0635 8.23633 11.0635 8.50194 10.7599L11.6994 7.10567C12.0766 6.67461 11.7705 6 11.1977 6H4.80273C4.22996 6 3.92384 6.67461 4.30101 7.10567L7.4985 10.7599Z"
     />
   </Svg>
diff --git a/apps/wallet-mobile/src/components/Icon/AngleUp.tsx b/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
index 1296859192..dd281bd8a7 100644
--- a/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
@@ -1,12 +1,12 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size: number; color?: string}
+import {IconProps} from '.'
 
-export const AngleUp = ({size, color}: Props) => (
+export const AngleUp = ({size = 16, color = '#12705D'}: IconProps) => (
   <Svg viewBox="0 0 16 16" width={size} height={size}>
     <Path
-      fill={color != null ? color : '#12705D'}
+      fill={color}
       d="M4.30077 8.89366C3.92359 9.32471 4.22971 9.99932 4.80249 9.99932H11.1975C11.7702 9.99932 12.0764 9.32471 11.6992 8.89365L8.50169 5.23938C8.23608 4.93583 7.76386 4.93583 7.49826 5.23938L4.30077 8.89366Z"
     />
   </Svg>
diff --git a/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx b/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
index 22cefe9816..3dcefe576c 100644
--- a/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const ArrowDown = ({size, color = '#000'}: Props) => {
+export const ArrowDown = ({size = 17, color = '#000'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 15 17" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx b/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
index b4bc0ed1dd..dd305a717d 100644
--- a/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const ArrowRight = ({size, color = '#000000'}: Props) => {
+export const ArrowRight = ({size = 24, color = '#000000'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Assets.tsx b/apps/wallet-mobile/src/components/Icon/Assets.tsx
index 7fce43123e..63cbc9774e 100644
--- a/apps/wallet-mobile/src/components/Icon/Assets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Assets.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Assets = ({size = 36, color = 'black'}: Props) => (
+export const Assets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Backspace.tsx b/apps/wallet-mobile/src/components/Icon/Backspace.tsx
index 80fd1a7167..b2641ca4df 100644
--- a/apps/wallet-mobile/src/components/Icon/Backspace.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Backspace.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Backspace = ({color = 'black', size}: Props) => (
+export const Backspace = ({color = 'black', size = 24}: IconProps) => (
   <Svg width={size ?? 24} height={size ?? 17} viewBox="0 0 24 17" fill="none">
     <Path
       d="M11.0476 6.02515C10.7548 5.73224 10.7548 5.25739 11.0476 4.96448C11.3406 4.67157 11.8154 4.67157 12.1083 4.96448L14.5833 7.43939L17.0581 4.96448C17.351 4.67157 17.8258 4.67157 18.1188 4.96448C18.4116 5.25732 18.4116 5.73224 18.1188 6.02515L15.6438 8.5L18.1188 10.9749C18.4116 11.2678 18.4116 11.7427 18.1188 12.0355C17.8258 12.3284 17.351 12.3284 17.0581 12.0355L14.5833 9.56067L12.1083 12.0355C11.8154 12.3284 11.3406 12.3284 11.0477 12.0355C10.7548 11.7426 10.7548 11.2678 11.0477 10.9749L13.5226 8.50006L11.0476 6.02515Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Backward.tsx b/apps/wallet-mobile/src/components/Icon/Backward.tsx
index dd0e904ec0..f2107cd486 100644
--- a/apps/wallet-mobile/src/components/Icon/Backward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Backward.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Backward = ({size = 24, color = 'black'}: Props) => (
+export const Backward = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M12.707 5.707a1 1 0 00-1.414-1.414l-7 7a1 1 0 000 1.414l7 7a1 1 0 001.414-1.414L7.414 13H19a1 1 0 100-2H7.414l5.293-5.293z"
diff --git a/apps/wallet-mobile/src/components/Icon/Bio.tsx b/apps/wallet-mobile/src/components/Icon/Bio.tsx
index 7f13157e10..12c0985ce4 100644
--- a/apps/wallet-mobile/src/components/Icon/Bio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bio.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Bio = ({size = 36, color = 'black'}: Props) => (
+export const Bio = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M5 4C4.73478 4 4.48043 4.10536 4.29289 4.29289C4.10536 4.48043 4 4.73478 4 5V7C4 7.55228 3.55228 8 3 8C2.44772 8 2 7.55228 2 7V5C2 4.20435 2.31607 3.44129 2.87868 2.87868C3.44129 2.31607 4.20435 2 5 2H7C7.55228 2 8 2.44772 8 3C8 3.55228 7.55228 4 7 4H5Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx b/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
index e96c89d088..e40c4c2584 100644
--- a/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
@@ -1,14 +1,11 @@
 import * as React from 'react'
-import Svg, {Path, SvgProps} from 'react-native-svg'
+import Svg, {Path} from 'react-native-svg'
 
-type Props = SvgProps & {
-  color?: string
-  size?: number
-}
+import {IconProps} from '.'
 
-export const Bluetooth = ({color = '#4B6DDE', size = 25, ...props}: Props) => {
+export const Bluetooth = ({color = '#4B6DDE', size = 25}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 25 25" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 25 25" fill="none">
       <Path
         fillRule="evenodd"
         clipRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Bug.tsx b/apps/wallet-mobile/src/components/Icon/Bug.tsx
index 4eb9bf78e7..0ca98be349 100644
--- a/apps/wallet-mobile/src/components/Icon/Bug.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bug.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Bug = ({size = 40, color = 'black'}: Props) => {
+export const Bug = ({size = 40, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="-2 -2 28 28">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Burger.tsx b/apps/wallet-mobile/src/components/Icon/Burger.tsx
index b1b46a81b8..8ede4e753a 100644
--- a/apps/wallet-mobile/src/components/Icon/Burger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Burger.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Burger = ({size = 36, color = 'black'}: Props) => (
+export const Burger = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Cardano.tsx b/apps/wallet-mobile/src/components/Icon/Cardano.tsx
index 73fd5128bc..8d0c54eb92 100644
--- a/apps/wallet-mobile/src/components/Icon/Cardano.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Cardano.tsx
@@ -1,15 +1,11 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  width: number
-  height: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Cardano = ({width, height, color}: Props) => (
-  <Svg viewBox="0 0 2000 1848" {...{width, height}}>
-    <G fill={color != null ? color : '#000000'}>
+export const Cardano = ({size = 20, color = '#000000'}: IconProps) => (
+  <Svg viewBox="0 0 2000 1848" width={size} height={size}>
+    <G fill={color}>
       <Path d="M975.46 5.46c43.59-22.73 96.8 30 73.64 73.55-13.45 35.5-64.45 44.94-90.5 17.88C931 70.92 940 19.59 975.46 5.46M506.61 56c26.48-10.9 60 13.36 57.3 42.22 2.81 31.33-35.5 54.39-62.49 39.5-35.76-13.85-31.67-71.9 5.19-81.72M1466.87 138.6c-41.38-5-47.93-70.06-8.09-83.16 30.9-15.07 59.25 13.19 63.77 42.48-6.48 25.01-27.42 47.91-55.68 40.68M613.29 255.55c44.27-28 107.44 13.7 100.63 65.12-2.3 51.92-71.26 82-110.17 46.9-37.62-27.57-31.92-90.82 9.54-112.02M1289.1 285.26c19.75-50.9 99.78-52.44 122.26-2.89 22.22 38.56-5.11 86.31-44.7 99.42-52.44 9.79-102.25-46.9-77.56-96.53M919 378.9c-.43-43.75 39.42-76.35 81-79.33 27.58 5.53 57.64 17.28 69.47 45.11 22.05 38.39 2.47 91.25-37.37 108.87-18.22 10.21-39.76 6.38-59.6 5.19-30.33-14.89-55.87-44.09-53.5-79.84M221.75 442.65c40.44-24.86 95 20.51 79.69 64.44-8.43 38-59.51 53.46-88.71 29.2-31.17-22.73-26.23-77.38 9.02-93.64M1719 442.57c34.31-26.64 90.93 3.92 86.84 47.24 2.3 39.5-46.65 69.29-80.71 48.95-37.51-16.86-41.34-74.57-6.13-96.19M1115.08 521.22c56.62-20.34 123.87 4 156.14 54.48 42.57 61.71 19.92 155.69-46.14 191.1-68.45 41.88-168.4 6.38-193.68-70.06-28.7-68.43 13.11-154.07 83.68-175.52M782.88 527.95c62.75-29.62 147.2-4.77 177.51 59.42 35.67 62.48 8.09 149.48-55.68 181.74-63.85 36.26-153.93 8.77-184.83-58.31-34.65-64.87-3.88-152.98 63-182.85M450.25 641.67c4.77-40.43 42.91-66.74 81.39-69.46 41.46 5 74.58 37.2 79.09 79.16-2.72 41.54-34.82 82.14-78.84 81.89-48.43 4.17-90.89-44.01-81.64-91.59M1432.73 581c49.72-28.94 118.76 13.19 116.55 70.31 3.41 60.52-73 103.17-122.51 67.67-51.43-29.56-47.42-112.81 5.96-137.98M647.69 794.3c58.15-16 124.64 11.41 153.16 64.86 31.24 53.8 18.47 128.54-30.05 168-62.23 57.88-177 34.64-210.12-44.35-38.06-72.41 8.17-169.45 87.01-188.51M1277.78 794c56.53-16.17 122.94 5.62 153.33 57.12 40.18 58.9 21 146.75-38.82 184.72-62.66 44.09-159.72 20.94-194.2-48-41.8-71.31.26-172.09 79.69-193.84M273.68 861.2c50.23-19 105.91 36.43 85.56 86.23-12.43 45.37-76.37 62.14-109.4 28.69-38.65-31.41-24.34-101.3 23.84-114.92M1635.18 933.47c-1.45-41.62 29-78.48 71.68-80.78 34.4 5.45 67.85 33.2 65.13 70.65 3.15 49.46-56.45 83.08-98.59 59.84-19.75-10.04-29.88-30.3-38.22-49.71M26.7 885.63c30.22-13.19 67.6 13 60.7 46.56-1.62 38-57.72 52.61-78.33 20.86C-9.14 931 1.76 897 26.7 885.63zM1932.13 884.87c21.28-15.15 55.42-4.26 63.85 20.6 14.3 27.15-11.92 64.35-42.48 59.76-42.9 3.91-56.78-61.47-21.37-80.36M811.83 1067.28c79.52-20.68 165 45.63 165.5 127.51 5.19 82.74-79 156.11-160.4 137-62.92-10.13-112.29-70.74-110.25-134.32-.17-60.81 45.72-117.33 105.15-130.19M1126.75 1067.11c80.71-22.56 168.74 44.94 167.46 128.71 4.26 81.21-77.3 152.11-157 136-75-9.7-130.34-92.1-109.4-164.88 10.57-48.5 51.09-87.94 98.94-99.83M519.56 1117.51c55.85-9.53 108.21 52.78 85.56 105.81-16.52 56.51-98.76 71.84-135.12 25.68-42.65-44.33-10.81-125.37 49.56-131.49M1443.11 1120c49.8-20.86 110.93 22.22 107.1 76.27 2 59.5-73.47 100.53-122.17 65.8-55.16-31.18-45.12-122.94 15.07-142.07M1701.25 1378.92c-19.5-36.35 15.92-84.53 56.28-77.8 20.09-.34 34.14 15.49 47 28.77 2.64 21.54 7.07 47.24-10.81 63.84-24.28 30.73-79.28 21.96-92.47-14.81M221.58 1311.24c37.72-25.11 92 12.34 83.52 56.44-4.51 39-53.64 61.29-86 39.16-34.73-20.09-33.45-77.29 2.48-95.6M966.78 1392.88c49.38-21.79 112.29 21.2 107.61 75.59 3.66 60.1-74.15 101.72-122.43 65.63-53.63-30.99-44.69-122.16 14.82-141.22M621.63 1473.4c42.06-22.13 98.5 16.09 94.67 63.16 1.28 38.65-36.44 71.59-74.58 65.88-31.59-.68-52.19-29-62.32-55.93.52-29.35 12.6-62.04 42.23-73.11M1320.77 1474.08c43.25-26.73 104.72 11.66 100.63 62 1.11 52.61-68.36 86.31-108.63 51.75-38.99-27.09-34.23-92.21 8-113.75M1442.35 1774.65c-19.24-29.11 3.41-64.18 34.65-70.82 25.12 5.11 51.68 24 46.4 53.12-3.66 39.41-61.3 51.5-81.05 17.7M477.24 1749.37c7.66-23.07 26.22-46 53.38-40 39.59 2.81 51.34 62.48 16.69 80.87-31.16 21.01-67.31-7.76-70.07-40.87M942.85 1775.84c7.58-34.13 51.76-50.73 80.88-32.6 19.24 8.26 24.86 29.79 29.8 48.09-2.64 9.53-5 19.07-7.32 28.6-11.92 14.13-27.24 28.26-47.08 27.75-36.87 4.32-70.13-37.36-56.28-71.84" />
     </G>
   </Svg>
diff --git a/apps/wallet-mobile/src/components/Icon/Catalyst.tsx b/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
index c9125c1171..133b679f8b 100644
--- a/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Catalyst = ({size = 36, color = 'black'}: Props) => (
+export const Catalyst = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-1 -1 27 27">
     <Path
       d="M3 11.9998C3 7.02996 7.0293 2.99976 12 2.99976C16.9698 2.99976 21 7.02996 21 11.9998H15.9654C15.9654 11.3482 15.7926 10.7425 15.5145 10.1998C15.5145 10.1998 15.4092 9.98826 15.3426 9.88386C15.3321 9.86723 15.3224 9.85003 15.3126 9.83277C15.298 9.80705 15.2833 9.7812 15.2661 9.75696C15.1437 9.57876 15.0042 9.41316 14.8548 9.25836C14.8166 9.21807 14.7757 9.18047 14.7351 9.14306C14.723 9.132 14.711 9.12095 14.6991 9.10986C14.5794 8.99826 14.4552 8.89476 14.3229 8.79936C14.3095 8.78948 14.2962 8.77955 14.283 8.76963C14.2418 8.73888 14.2009 8.70824 14.1573 8.67966C13.9746 8.55996 13.782 8.45466 13.5795 8.36556C13.5471 8.35206 13.5129 8.34036 13.4787 8.32867C13.4635 8.32328 13.4481 8.31784 13.4337 8.31246C13.2627 8.24586 13.0872 8.19186 12.9072 8.14866C12.8877 8.14415 12.8682 8.14027 12.8492 8.1365C12.8454 8.13575 12.8416 8.135 12.8379 8.13426L12.8269 8.13168C12.7884 8.12265 12.7505 8.11375 12.711 8.10636C12.4797 8.06406 12.2439 8.03436 12 8.03436C11.7561 8.03436 11.5203 8.06406 11.2881 8.10636C11.2727 8.10902 11.2575 8.11262 11.2424 8.11624C11.2319 8.11874 11.2214 8.12125 11.2107 8.12346C11.1711 8.13156 11.1324 8.13966 11.0928 8.14866C10.9119 8.19186 10.7364 8.24586 10.5663 8.31246C10.5624 8.31389 10.5586 8.31518 10.5549 8.31644C10.5492 8.31835 10.5438 8.32019 10.5384 8.32236C10.5252 8.32716 10.5119 8.33176 10.4986 8.33636C10.472 8.34556 10.4454 8.35476 10.4196 8.36556C10.218 8.45466 10.0254 8.55996 9.8427 8.67966C9.80209 8.70631 9.76371 8.73475 9.72505 8.7634C9.70888 8.77539 9.69266 8.78741 9.6762 8.79936C9.5448 8.89476 9.4197 8.99826 9.3009 9.10986C9.29483 9.11542 9.28875 9.12096 9.28268 9.12651C9.23569 9.16943 9.18893 9.21213 9.1443 9.25836C8.9949 9.41316 8.8563 9.57876 8.733 9.75696C8.71668 9.78064 8.70221 9.80587 8.68779 9.83101C8.67755 9.84886 8.66734 9.86667 8.6565 9.88386C8.5908 9.98826 8.4855 10.1998 8.4855 10.1998C8.4846 10.2007 8.4846 10.2016 8.4846 10.2016H10.0929C10.5726 9.69396 11.2467 9.37356 12 9.37356C13.4508 9.37356 14.6262 10.549 14.6262 11.9998H12.918C12.918 11.4931 12.5067 11.0818 12 11.0818C11.4933 11.0818 11.082 11.4931 11.082 11.9998H6.2346C6.2346 11.3707 6.3381 10.7668 6.5253 10.1998C6.6171 9.91896 6.7314 9.64986 6.8637 9.39066C6.8664 9.38526 6.86887 9.37986 6.87135 9.37446C6.87382 9.36906 6.8763 9.36366 6.879 9.35826C7.0095 9.10716 7.158 8.86686 7.3227 8.63826C7.33393 8.62174 7.34614 8.6057 7.35824 8.5898C7.36262 8.58404 7.36699 8.5783 7.3713 8.57256C7.7016 8.12706 8.0931 7.73286 8.5359 7.39896C8.5692 7.37376 8.6025 7.34856 8.6367 7.32426C8.8536 7.16676 9.0804 7.02366 9.3189 6.89766C9.33512 6.88904 9.35163 6.88156 9.3681 6.8741C9.38087 6.86832 9.39362 6.86255 9.4062 6.85626C9.6285 6.74376 9.8589 6.64566 10.0965 6.56286C10.1129 6.55714 10.1289 6.55111 10.1449 6.54509C10.1667 6.53689 10.1885 6.52872 10.2108 6.52146C10.4628 6.43866 10.7229 6.37566 10.9884 6.32886C11.0451 6.31896 11.1018 6.31086 11.1585 6.30276C11.4339 6.26226 11.7138 6.23436 12 6.23436C12.2862 6.23436 12.5652 6.26226 12.8406 6.30276L12.8506 6.30419C12.9041 6.31182 12.9582 6.31954 13.0107 6.32886C13.2762 6.37566 13.5372 6.43866 13.7892 6.52146C13.8129 6.52917 13.8359 6.5379 13.8589 6.54661C13.8734 6.55212 13.8879 6.55762 13.9026 6.56286C14.1402 6.64566 14.3715 6.74376 14.5938 6.85626C14.6061 6.86243 14.6185 6.8681 14.6308 6.87378C14.6473 6.88135 14.6637 6.88891 14.6802 6.89766C14.9187 7.02366 15.1455 7.16676 15.3633 7.32426C15.3975 7.34855 15.4308 7.37373 15.4641 7.39892C15.906 7.73282 16.2975 8.12706 16.6278 8.57256C16.6337 8.58037 16.6396 8.58818 16.6456 8.59603C16.6562 8.6099 16.667 8.62389 16.6773 8.63826C16.842 8.86686 16.9905 9.10716 17.1201 9.35826C17.1243 9.36546 17.1277 9.37266 17.1311 9.37986C17.1328 9.38346 17.1345 9.38706 17.1363 9.39066C17.2686 9.64986 17.382 9.91896 17.4747 10.1998H18.9723C18.1704 7.09836 15.3489 4.79976 12 4.79976C8.6511 4.79976 5.8287 7.09836 5.0277 10.1998C4.8819 10.7812 4.7991 11.3572 4.737 11.9998H3Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Categories.tsx b/apps/wallet-mobile/src/components/Icon/Categories.tsx
index 3760183629..2f3ebde769 100644
--- a/apps/wallet-mobile/src/components/Icon/Categories.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Categories.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Categories = ({size = 36, color = 'black'}: Props) => (
+export const Categories = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M10 3H4C3.73478 3 3.48043 3.10536 3.29289 3.29289C3.10536 3.48043 3 3.73478 3 4V10C3 10.2652 3.10536 10.5196 3.29289 10.7071C3.48043 10.8946 3.73478 11 4 11H10C10.2652 11 10.5196 10.8946 10.7071 10.7071C10.8946 10.5196 11 10.2652 11 10V4C11 3.73478 10.8946 3.48043 10.7071 3.29289C10.5196 3.10536 10.2652 3 10 3ZM9 9H5V5H9V9ZM20 13H14C13.7348 13 13.4804 13.1054 13.2929 13.2929C13.1054 13.4804 13 13.7348 13 14V20C13 20.2652 13.1054 20.5196 13.2929 20.7071C13.4804 20.8946 13.7348 21 14 21H20C20.2652 21 20.5196 20.8946 20.7071 20.7071C20.8946 20.5196 21 20.2652 21 20V14C21 13.7348 20.8946 13.4804 20.7071 13.2929C20.5196 13.1054 20.2652 13 20 13ZM19 19H15V15H19V19ZM17 3C14.794 3 13 4.794 13 7C13 9.206 14.794 11 17 11C19.206 11 21 9.206 21 7C21 4.794 19.206 3 17 3ZM17 9C15.897 9 15 8.103 15 7C15 5.897 15.897 5 17 5C18.103 5 19 5.897 19 7C19 8.103 18.103 9 17 9ZM7 13C4.794 13 3 14.794 3 17C3 19.206 4.794 21 7 21C9.206 21 11 19.206 11 17C11 14.794 9.206 13 7 13ZM7 19C5.897 19 5 18.103 5 17C5 15.897 5.897 15 7 15C8.103 15 9 15.897 9 17C9 18.103 8.103 19 7 19Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Change.tsx b/apps/wallet-mobile/src/components/Icon/Change.tsx
index 8148badfb6..bad888b5a8 100644
--- a/apps/wallet-mobile/src/components/Icon/Change.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Change.tsx
@@ -1,13 +1,11 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Change = ({color = 'black'}: Props) => {
+export const Change = ({size = 20, color = 'black'}: IconProps) => {
   return (
-    <Svg width={20} height={14} fill="none">
+    <Svg width={size} height={size} fill="none">
       <Path
         fill={color}
         d="M4.707.293a1 1 0 00-1.414 0l-3 3a1 1 0 001.414 1.414L3 3.414V11a3 3 0 003 3h4a1 1 0 100-2H6a1 1 0 01-1-1V3.414l1.293 1.293a1 1 0 001.414-1.414zm7.586 9a1 1 0 011.414 0L15 10.586V3a1 1 0 00-1-1h-4a1 1 0 110-2h4a3 3 0 013 3v7.586l1.293-1.293a1 1 0 111.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414"
diff --git a/apps/wallet-mobile/src/components/Icon/Check.tsx b/apps/wallet-mobile/src/components/Icon/Check.tsx
index b03a5f046d..783d42e7e4 100644
--- a/apps/wallet-mobile/src/components/Icon/Check.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Check.tsx
@@ -1,14 +1,9 @@
 import React from 'react'
-import {ImageStyle} from 'react-native'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  style?: ImageStyle
-}
+import {IconProps} from '.'
 
-export const Check = ({size = 40, color = 'black'}: Props) => (
+export const Check = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx b/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
index a72c8cb542..fa39774739 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const CheckFilled = ({size = 40, color}: Props) => (
+export const CheckFilled = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx b/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
index 8830b3b7d2..10fce66849 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const CheckFilled2 = ({size = 20, color}: Props) => (
+export const CheckFilled2 = ({size = 20, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20">
     <Path
       d="M14.707 8.707a1 1 0 00-1.414-1.414L9 11.586 6.707 9.293a1 1 0 00-1.414 1.414l3 3a1 1 0 001.414 0l5-5z"
diff --git a/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx b/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
index 9737ad5faa..5e34a2c30f 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const CheckOutlined = ({size = 40, color}: Props) => (
+export const CheckOutlined = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Checkbox.tsx b/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
index 7045695d9b..19d9c1bb2b 100644
--- a/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
@@ -1,11 +1,13 @@
 import * as React from 'react'
-import Svg, {ClipPath, Defs, G, Path, Rect, SvgProps} from 'react-native-svg'
+import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-export const Checkbox = (props: SvgProps) => {
+import {IconProps} from '.'
+
+export const Checkbox = ({size = 16, color = '#4B6DDE'}: IconProps) => {
   return (
-    <Svg width={16} height={16} viewBox="0 0 16 16" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
       <G clipPath="url(#clip0_24683_1099)">
-        <Rect width={16} height={16} rx={2} fill="#4B6DDE" />
+        <Rect width={size} height={size} rx={2} fill={color} />
 
         <Path
           fillRule="evenodd"
@@ -17,7 +19,7 @@ export const Checkbox = (props: SvgProps) => {
 
       <Defs>
         <ClipPath id="clip0_24683_1099">
-          <Rect width={16} height={16} rx={2} fill="#fff" />
+          <Rect width={size} height={size} rx={2} fill="#fff" />
         </ClipPath>
       </Defs>
     </Svg>
diff --git a/apps/wallet-mobile/src/components/Icon/Chevron.tsx b/apps/wallet-mobile/src/components/Icon/Chevron.tsx
index cd9824beb2..2063b38833 100644
--- a/apps/wallet-mobile/src/components/Icon/Chevron.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Chevron.tsx
@@ -1,14 +1,13 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
+import {IconProps} from '.'
+
 export const Chevron = ({
   direction,
-  color,
+  color = 'black',
   size = 40,
-}: {
-  size?: number
-  backgroundColor?: string
-  color?: string
+}: IconProps & {
   direction: 'left' | 'right' | 'up' | 'down'
 }) => {
   const rotate = direction === 'down' ? 0 : direction === 'right' ? 270 : direction === 'left' ? 90 : 180
diff --git a/apps/wallet-mobile/src/components/Icon/Clock.tsx b/apps/wallet-mobile/src/components/Icon/Clock.tsx
index 4a4f0f471f..4584ef73ab 100644
--- a/apps/wallet-mobile/src/components/Icon/Clock.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Clock.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Clock = ({size = 40, color}: Props) => (
+export const Clock = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M13 8C13 7.44772 12.5523 7 12 7C11.4477 7 11 7.44772 11 8V13C11 13.5523 11.4477 14 12 14H16C16.5523 14 17 13.5523 17 13C17 12.4477 16.5523 12 16 12H13V8Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Close.tsx b/apps/wallet-mobile/src/components/Icon/Close.tsx
index 2a42b9c98d..bbdf3b57d0 100644
--- a/apps/wallet-mobile/src/components/Icon/Close.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Close.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Close = ({size = 40, color}: Props) => (
+export const Close = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20">
     <Path
       d="M13.7071 6.29289C14.0976 6.68342 14.0976 7.31658 13.7071 7.70711L11.4142 10L13.7071 12.2929C14.0976 12.6834 14.0976 13.3166 13.7071 13.7071C13.3166 14.0976 12.6834 14.0976 12.2929 13.7071L10 11.4142L7.70711 13.7071C7.31658 14.0976 6.68342 14.0976 6.29289 13.7071C5.90237 13.3166 5.90237 12.6834 6.29289 12.2929L8.58579 10L6.29289 7.70711C5.90237 7.31658 5.90237 6.68342 6.29289 6.29289C6.68342 5.90237 7.31658 5.90237 7.70711 6.29289L10 8.58579L12.2929 6.29289C12.6834 5.90237 13.3166 5.90237 13.7071 6.29289Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Coins.tsx b/apps/wallet-mobile/src/components/Icon/Coins.tsx
index 608293fcac..8e58bbc972 100644
--- a/apps/wallet-mobile/src/components/Icon/Coins.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Coins.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Coins = ({size = 36, color = 'black'}: Props) => (
+export const Coins = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M12 22C15.976 22 20 20.626 20 18V6C20 3.374 15.976 2 12 2C8.024 2 4 3.374 4 6V18C4 20.626 8.024 22 12 22ZM12 20C8.278 20 6 18.705 6 18V16.732C7.541 17.57 9.777 18 12 18C14.223 18 16.459 17.57 18 16.732V18C18 18.705 15.722 20 12 20ZM12 4C15.722 4 18 5.295 18 6C18 6.705 15.722 8 12 8C8.278 8 6 6.705 6 6C6 5.295 8.278 4 12 4ZM6 8.732C7.541 9.57 9.777 10 12 10C14.223 10 16.459 9.57 18 8.732V10C18 10.705 15.722 12 12 12C8.278 12 6 10.705 6 10V8.732ZM6 12.732C7.541 13.57 9.777 14 12 14C14.223 14 16.459 13.57 18 12.732V14C18 14.705 15.722 16 12 16C8.278 16 6 14.705 6 14V12.732Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Coins2.tsx b/apps/wallet-mobile/src/components/Icon/Coins2.tsx
index 2d760f6982..ce46bff19c 100644
--- a/apps/wallet-mobile/src/components/Icon/Coins2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Coins2.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Coins2 = ({size = 24, color = '#7C85A3'}: Props) => {
+export const Coins2 = ({size = 24, color = '#7C85A3'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Collateral.tsx b/apps/wallet-mobile/src/components/Icon/Collateral.tsx
index 4d1a983a5b..7b3bc9d94d 100644
--- a/apps/wallet-mobile/src/components/Icon/Collateral.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Collateral.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Collateral = ({size = 36, color = 'black'}: Props) => {
+export const Collateral = ({size = 36, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Connection.tsx b/apps/wallet-mobile/src/components/Icon/Connection.tsx
index 389cdee819..d63c43dd51 100644
--- a/apps/wallet-mobile/src/components/Icon/Connection.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Connection.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Connection = ({size = 36, color = '#000000'}: Props) => {
+export const Connection = ({size = 36, color = '#000000'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 21 20" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Copy.tsx b/apps/wallet-mobile/src/components/Icon/Copy.tsx
index 2f8f444e96..849e53200e 100644
--- a/apps/wallet-mobile/src/components/Icon/Copy.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Copy.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Copy = ({size = 36, color = 'black'}: Props) => (
+export const Copy = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M4 17C4 17.5523 3.55228 18 3 18C2.44772 18 2 17.5523 2 17V4.6C2 3.87477 2.35255 3.23324 2.79289 2.79289C3.23324 2.35255 3.87477 2 4.6 2H14C14.5523 2 15 2.44771 15 3C15 3.55229 14.5523 4 14 4H4.6C4.52523 4 4.36676 4.04745 4.20711 4.20711C4.04745 4.36676 4 4.52523 4 4.6V17Z"
diff --git a/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx b/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
index 7e17b33674..18ed764510 100644
--- a/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const CopySuccess = ({size = 36, color = 'black'}: Props) => (
+export const CopySuccess = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M3 18C3.55228 18 4 17.5523 4 17V4.6C4 4.52523 4.04745 4.36676 4.20711 4.20711C4.36676 4.04745 4.52523 4 4.6 4H14C14.5523 4 15 3.55229 15 3C15 2.44771 14.5523 2 14 2H4.6C3.87477 2 3.23324 2.35255 2.79289 2.79289C2.35255 3.23324 2 3.87477 2 4.6V17C2 17.5523 2.44772 18 3 18Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Cross.tsx b/apps/wallet-mobile/src/components/Icon/Cross.tsx
index a945f43355..55aa37f636 100644
--- a/apps/wallet-mobile/src/components/Icon/Cross.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Cross.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Cross = ({size = 36, color = 'black'}: Props) => (
+export const Cross = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M19.7071 5.70711C20.0976 5.31658 20.0976 4.68342 19.7071 4.29289C19.3166 3.90237 18.6834 3.90237 18.2929 4.29289L12 10.5858L5.70711 4.29289C5.31658 3.90237 4.68342 3.90237 4.29289 4.29289C3.90237 4.68342 3.90237 5.31658 4.29289 5.70711L10.5858 12L4.29289 18.2929C3.90237 18.6834 3.90237 19.3166 4.29289 19.7071C4.68342 20.0976 5.31658 20.0976 5.70711 19.7071L12 13.4142L18.2929 19.7071C18.6834 20.0976 19.3166 20.0976 19.7071 19.7071C20.0976 19.3166 20.0976 18.6834 19.7071 18.2929L13.4142 12L19.7071 5.70711Z"
diff --git a/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx b/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
index c338fdb598..97fd95bbdd 100644
--- a/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const CrossCircle = ({size = 36, color = 'black'}: Props) => (
+export const CrossCircle = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M15.7071 8.29289C16.0976 8.68342 16.0976 9.31658 15.7071 9.70711L13.4142 12L15.7071 14.2929C16.0976 14.6834 16.0976 15.3166 15.7071 15.7071C15.3166 16.0976 14.6834 16.0976 14.2929 15.7071L12 13.4142L9.70711 15.7071C9.31658 16.0976 8.68342 16.0976 8.29289 15.7071C7.90237 15.3166 7.90237 14.6834 8.29289 14.2929L10.5858 12L8.29289 9.70711C7.90237 9.31658 7.90237 8.68342 8.29289 8.29289C8.68342 7.90237 9.31658 7.90237 9.70711 8.29289L12 10.5858L14.2929 8.29289C14.6834 7.90237 15.3166 7.90237 15.7071 8.29289Z"
diff --git a/apps/wallet-mobile/src/components/Icon/DApp.tsx b/apps/wallet-mobile/src/components/Icon/DApp.tsx
index 9da78248a8..2ca5c04768 100644
--- a/apps/wallet-mobile/src/components/Icon/DApp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DApp.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const DApp = ({size = 24, color = 'black'}: Props) => {
+export const DApp = ({size = 24, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Danger.tsx b/apps/wallet-mobile/src/components/Icon/Danger.tsx
index b5ac2b5cbc..d820cfd7bb 100644
--- a/apps/wallet-mobile/src/components/Icon/Danger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Danger.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Danger = ({size = 36, color = '#000000'}: Props) => {
+export const Danger = ({size = 36, color = '#000000'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 50 50" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/DappConnector.tsx b/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
index acfefd8828..d727f856c9 100644
--- a/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const DappConnector = ({size = 36, color = 'black'}: Props) => (
+export const DappConnector = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M10.3845 7.98476C9.98818 8.12207 9.54895 8.01675 9.25249 7.72029C8.67127 7.13907 8.89674 6.13969 9.67533 5.87444C11.1686 5.36475 12.8029 5.38071 14.2869 5.92286L15.9851 4.22471C16.9494 3.26044 18.647 3.39619 19.7782 4.52742C20.9095 5.65864 21.0452 7.35627 20.0809 8.32054L18.3828 10.0187C18.9248 11.5026 18.9407 13.1368 18.431 14.6301C18.1658 15.4087 17.1664 15.6342 16.5852 15.053C16.2887 14.7565 16.1834 14.3173 16.3207 13.921C16.8895 12.2788 16.5353 10.3892 15.2262 9.0801C13.9163 7.77022 12.0267 7.41603 10.3845 7.98476Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Delete.tsx b/apps/wallet-mobile/src/components/Icon/Delete.tsx
index 347ef6640d..c592e012ac 100644
--- a/apps/wallet-mobile/src/components/Icon/Delete.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Delete.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Delete = ({size = 36, color = 'black'}: Props) => (
+export const Delete = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Device.tsx b/apps/wallet-mobile/src/components/Icon/Device.tsx
index c4a10ae05e..d83c3a85a6 100644
--- a/apps/wallet-mobile/src/components/Icon/Device.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Device.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Device = ({size = 36, color = 'black'}: Props) => (
+export const Device = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M5 16C5 15.4477 5.44772 15 6 15H6.01C6.56228 15 7.01 15.4477 7.01 16C7.01 16.5523 6.56228 17 6.01 17H6C5.44772 17 5 16.5523 5 16Z"
diff --git a/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx b/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
index f54578f93a..5aa6b51ee0 100644
--- a/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const DigitalAsset = ({size = 36, color = 'black'}: Props) => (
+export const DigitalAsset = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M6 7C6 6.44772 6.44772 6 7 6H9C9.55228 6 10 6.44772 10 7V10H11C11.5523 10 12 10.4477 12 11C12 11.5523 11.5523 12 11 12H7C6.44772 12 6 11.5523 6 11C6 10.4477 6.44772 10 7 10H8V8H7C6.44772 8 6 7.55228 6 7Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Direction.tsx b/apps/wallet-mobile/src/components/Icon/Direction.tsx
index 3f803c624d..ddb10e57a8 100644
--- a/apps/wallet-mobile/src/components/Icon/Direction.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Direction.tsx
@@ -6,14 +6,10 @@ import {TransactionDirection, TransactionInfo} from '../../yoroi-wallets/types/o
 import {Received} from '../Icon/Received'
 import {Send} from '../Icon/Send'
 import {Transaction} from '../Icon/Transaction'
+import {IconProps} from '.'
 import {MultiParty} from './MultiParty'
 
-type Props = {
-  transaction: TransactionInfo
-  size?: number
-}
-
-export const Direction = ({transaction, size = defaultSize}: Props) => {
+export const Direction = ({transaction, size = defaultSize}: IconProps & {transaction: TransactionInfo}) => {
   const {color} = useTheme()
   const {direction} = transaction
 
diff --git a/apps/wallet-mobile/src/components/Icon/Disconnect.tsx b/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
index 76573f7940..73171bf254 100644
--- a/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Disconnect = ({size = 24, color = 'black'}: Props) => {
+export const Disconnect = ({size = 24, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Document.tsx b/apps/wallet-mobile/src/components/Icon/Document.tsx
index 9a481f3ea3..2693792768 100644
--- a/apps/wallet-mobile/src/components/Icon/Document.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Document.tsx
@@ -1,13 +1,9 @@
 import React from 'react'
 import Svg, {G, Line, Rect} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  backgroundColor?: string
-}
+import {IconProps} from '.'
 
-export const Document = ({size = 40, color = 'black', backgroundColor = 'transparent'}: Props) => (
+export const Document = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <G transform="scale(1.25) translateX(-3px) translateY(-3px)">
       <Rect
@@ -19,7 +15,7 @@ export const Document = ({size = 40, color = 'black', backgroundColor = 'transpa
         width="14"
         height="18"
         rx="2"
-        fill={backgroundColor}
+        fill="transparent"
       />
 
       <G id="lines" stroke={color} strokeWidth="1.3" strokeLinecap="round" strokeLinejoin="round">
diff --git a/apps/wallet-mobile/src/components/Icon/Drag.tsx b/apps/wallet-mobile/src/components/Icon/Drag.tsx
index 404368cefd..4b053fc977 100644
--- a/apps/wallet-mobile/src/components/Icon/Drag.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Drag.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Drag = ({size = 36, color = 'black'}: Props) => (
+export const Drag = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M9 3C7.89543 3 7 3.89543 7 5C7 6.10457 7.89543 7 9 7C10.1046 7 11 6.10457 11 5C11 3.89543 10.1046 3 9 3Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Edit.tsx b/apps/wallet-mobile/src/components/Icon/Edit.tsx
index 74236b5bd8..7d7838b8da 100644
--- a/apps/wallet-mobile/src/components/Icon/Edit.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Edit.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Edit = ({size = 40, color = 'black'}: Props) => {
+export const Edit = ({size = 40, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx b/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
index 339d0773e7..50a2c91ff7 100644
--- a/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
@@ -1,24 +1,26 @@
 import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
-import Svg, {ClipPath, Defs, G, Path, Rect, SvgProps} from 'react-native-svg'
+import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-export const EmptyCheckbox = (props: SvgProps) => {
+import {IconProps} from '.'
+
+export const EmptyCheckbox = ({size = 16, color: defaultColor}: IconProps) => {
   const {color} = useTheme()
 
   return (
-    <Svg width={16} height={16} viewBox="0 0 16 16" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 16 16" fill="none">
       <G clipPath="url(#clip0_24683_486)">
         <Path
           fillRule="evenodd"
           clipRule="evenodd"
           d="M13 2H3a1 1 0 00-1 1v10a1 1 0 001 1h10a1 1 0 001-1V3a1 1 0 00-1-1zM2 0a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2V2a2 2 0 00-2-2H2z"
-          fill={color.gray_900}
+          fill={defaultColor ?? color.gray_900}
         />
       </G>
 
       <Defs>
         <ClipPath id="clip0_24683_486">
-          <Rect width={16} height={16} rx={2} fill="#fff" />
+          <Rect width={size} height={size} rx={2} fill="#fff" />
         </ClipPath>
       </Defs>
     </Svg>
diff --git a/apps/wallet-mobile/src/components/Icon/Emurgo.tsx b/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
index ec9977c244..d08b9a7896 100644
--- a/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
@@ -1,14 +1,11 @@
-import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {width: number; height: number; color?: string}
+import {IconProps} from '.'
 
-export const Emurgo = (props: Props) => {
-  const {color: colors} = useTheme()
-  const {width, height, color = colors.black_static} = props
+export const Emurgo = ({size = 36, color = 'black'}: IconProps) => {
   return (
-    <Svg viewBox="0 0 1671 626.86401" {...{width, height}}>
+    <Svg viewBox="0 0 1671 626.86401" width={size} height={size}>
       <G transform="matrix(1.3333333,0,0,-1.3333333,0,626.864)" id="g10">
         <G fill={color} id="g12">
           <G fill={color} id="g14">
diff --git a/apps/wallet-mobile/src/components/Icon/Exchange.tsx b/apps/wallet-mobile/src/components/Icon/Exchange.tsx
index cb5661251d..4d4d99c8ac 100644
--- a/apps/wallet-mobile/src/components/Icon/Exchange.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Exchange.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Exchange = ({size = 36, color = 'black'}: Props) => {
+export const Exchange = ({size = 36, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Export.tsx b/apps/wallet-mobile/src/components/Icon/Export.tsx
index 34af67c1c5..b427c6e0f4 100644
--- a/apps/wallet-mobile/src/components/Icon/Export.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Export.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Export = ({size = 40, color = 'black'}: Props) => {
+export const Export = ({size = 40, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="-2 -2 28 28">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx b/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
index 4f23763aba..2720c4be94 100644
--- a/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const ExternalLink = ({size = 36, color = 'black'}: Props) => {
+export const ExternalLink = ({size = 36, color = 'black'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 12 12">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/EyeOff.tsx b/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
index 3a12773f98..4a14b7b581 100644
--- a/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const EyeOff = ({size = 36, color = 'black'}: Props) => (
+export const EyeOff = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M12 19C12.946 19 13.81 18.897 14.598 18.719L12.841 16.962C12.568 16.983 12.291 17 12 17C6.64901 17 4.57601 13.154 4.07401 12C4.45096 11.1588 4.96006 10.3833 5.58201 9.70297L4.18401 8.30497C2.64601 9.97197 2.06301 11.651 2.05201 11.684C1.98303 11.8893 1.98303 12.1116 2.05201 12.317C2.07301 12.383 4.36701 19 12 19ZM12 4.99997C10.163 4.99997 8.65401 5.39597 7.39601 5.98097L4.41406 2.99983C4.02355 2.60942 3.39051 2.60947 3.00006 2.99992C2.60957 3.39041 2.60957 4.02352 3.00006 4.41402L19.586 21C19.9765 21.3904 20.6095 21.3904 21 21C21.3905 20.6095 21.3905 19.9764 21 19.586L18.388 16.974C21.002 15.023 21.935 12.359 21.949 12.317C22.018 12.1116 22.018 11.8893 21.949 11.684C21.927 11.617 19.633 4.99997 12 4.99997ZM16.972 15.558L14.692 13.278C14.882 12.888 15 12.459 15 12C15 10.359 13.641 8.99997 12 8.99997C11.541 8.99997 11.112 9.11797 10.723 9.30897L8.91501 7.50097C9.90753 7.16038 10.9507 6.99097 12 6.99997C17.351 6.99997 19.424 10.846 19.926 12C19.624 12.692 18.76 14.342 16.972 15.558Z"
diff --git a/apps/wallet-mobile/src/components/Icon/EyeOn.tsx b/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
index a858e9e3d2..72feb77290 100644
--- a/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const EyeOn = ({size = 36, color = 'black'}: Props) => (
+export const EyeOn = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Facebook.tsx b/apps/wallet-mobile/src/components/Icon/Facebook.tsx
index ae9d26c1b2..3bf7510e98 100644
--- a/apps/wallet-mobile/src/components/Icon/Facebook.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Facebook.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Facebook = ({size = 36, color = 'black'}: Props) => (
+export const Facebook = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M12 2C6.47745 2 2 6.50448 2 12.0604C2 17.081 5.65637 21.2424 10.4378 22V14.9691H7.89759V12.0604H10.4378V9.84385C10.4378 7.32046 11.931 5.92897 14.2142 5.92897C15.3083 5.92897 16.4544 6.12516 16.4544 6.12516V8.59926H15.1903C13.9502 8.59926 13.5622 9.37599 13.5622 10.1718V12.0584H16.3334L15.8904 14.9671H13.5622V21.998C18.3436 21.2444 22 17.082 22 12.0604C22 6.50448 17.5226 2 12 2Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Forward.tsx b/apps/wallet-mobile/src/components/Icon/Forward.tsx
index 5728614e6c..ee7e985d94 100644
--- a/apps/wallet-mobile/src/components/Icon/Forward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Forward.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Forward = ({size = 24, color = 'black'}: Props) => (
+export const Forward = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M12.707 4.293a1 1 0 10-1.414 1.414L16.586 11H5a1 1 0 100 2h11.586l-5.293 5.293a1 1 0 001.414 1.414l7-7a1 1 0 000-1.414l-7-7z"
diff --git a/apps/wallet-mobile/src/components/Icon/Gear.tsx b/apps/wallet-mobile/src/components/Icon/Gear.tsx
index eef8ef81d6..65f83f3791 100644
--- a/apps/wallet-mobile/src/components/Icon/Gear.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Gear.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Gear = ({size = 36, color = 'black'}: Props) => (
+export const Gear = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-3 -3 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Github.tsx b/apps/wallet-mobile/src/components/Icon/Github.tsx
index 223f54a3d4..bb3ea20dc8 100644
--- a/apps/wallet-mobile/src/components/Icon/Github.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Github.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Github = ({size = 36, color = 'black'}: Props) => (
+export const Github = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Globe.tsx b/apps/wallet-mobile/src/components/Icon/Globe.tsx
index a9fde60013..de58e3da73 100644
--- a/apps/wallet-mobile/src/components/Icon/Globe.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Globe.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Globe = ({size = 36, color = 'black'}: Props) => (
+export const Globe = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Google.tsx b/apps/wallet-mobile/src/components/Icon/Google.tsx
index 91da96414a..251e6b3e2b 100644
--- a/apps/wallet-mobile/src/components/Icon/Google.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Google.tsx
@@ -1,11 +1,9 @@
 import * as React from 'react'
 import Svg, {Defs, Image, Pattern, Rect, Use} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const Google = ({size = 40}: Props) => (
+export const Google = ({size = 40}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 40 40" fill="none">
     <Rect width={40} height={40} rx={8} fill="url(#pattern0_21862_14624)" />
 
diff --git a/apps/wallet-mobile/src/components/Icon/Governance.tsx b/apps/wallet-mobile/src/components/Icon/Governance.tsx
index ea5c472c02..6927c604e9 100644
--- a/apps/wallet-mobile/src/components/Icon/Governance.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Governance.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Governance = ({size = 36, color = '#6B7384'}: Props) => (
+export const Governance = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path
       d="M4.504 17.77v-6.02c0-.289.099-.532.297-.73a.992.992 0 01.728-.295 1 1 0 01.73.296c.2.197.3.44.3.729v6.026a.992.992 0 01-.294.73.983.983 0 01-.725.295c-.287 0-.532-.1-.734-.299a.99.99 0 01-.302-.732zm6.621.006V11.75c0-.289.098-.532.295-.73a.982.982 0 01.725-.295 1 1 0 01.73.296c.2.197.3.44.3.729v6.026a.993.993 0 01-.295.73.983.983 0 01-.725.295c-.287 0-.53-.099-.73-.296a.984.984 0 01-.3-.729zM3.075 22a1.04 1.04 0 01-.764-.31A1.03 1.03 0 012 20.931c0-.3.104-.554.311-.764.208-.21.462-.315.763-.315h18.152c.3 0 .555.103.763.31.207.206.311.459.311.759s-.104.554-.311.764c-.208.21-.462.315-.763.315H3.074zm14.666-4.23v-6.02c0-.289.1-.532.297-.73a.992.992 0 01.728-.295 1 1 0 01.73.296c.2.197.3.44.3.729v6.026a.993.993 0 01-.294.73.983.983 0 01-.725.295c-.287 0-.531-.1-.733-.299a.989.989 0 01-.303-.732zm3.15-8.101H3.26c-.35 0-.648-.123-.893-.367A1.21 1.21 0 012 8.412v-.777c0-.232.063-.456.19-.673.127-.216.297-.374.512-.473l8.496-4.245c.298-.163.615-.244.952-.244.337 0 .654.081.952.244l8.432 4.213c.232.116.418.287.557.512.14.225.209.473.209.744v.54c0 .397-.136.732-.407 1.006-.271.273-.605.41-1.003.41zM5.456 7.52h13.386L12.15 4.187 5.457 7.52z"
diff --git a/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx b/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
index e7cfb8b647..474f0c2cd8 100644
--- a/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
@@ -1,17 +1,13 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color1?: string
-  color2?: string
-}
+import {IconProps} from '.'
 
-export const HardwareWallet = ({size = 36, color1 = 'black', color2 = '#C4CAD7'}: Props) => (
+export const HardwareWallet = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M7.06298 6.24902L10.5223 4.37111C11.2381 3.98253 12.1332 4.23617 12.5388 4.9425L19.4899 17.0491C19.9253 17.8074 19.6225 18.7758 18.8327 19.1509L15.4344 20.7651C14.7339 21.0978 13.8953 20.8417 13.5001 20.1744L6.4879 8.33154C6.05467 7.59984 6.31566 6.65471 7.06298 6.24902Z"
-      fill={color1}
+      fill={color}
       stroke="black"
     />
 
@@ -19,7 +15,7 @@ export const HardwareWallet = ({size = 36, color1 = 'black', color2 = '#C4CAD7'}
       fillRule="evenodd"
       clipRule="evenodd"
       d="M9.5 3C7.01472 3 5 5.01472 5 7.5V20C5 21.1046 5.89543 22 7 22H12C13.1046 22 14 21.1046 14 20V7.5C14 5.01472 11.9853 3 9.5 3ZM9.5 10C10.8807 10 12 8.88071 12 7.5C12 6.11929 10.8807 5 9.5 5C8.11929 5 7 6.11929 7 7.5C7 8.88071 8.11929 10 9.5 10Z"
-      fill={color2}
+      fill="white"
     />
   </Svg>
 )
diff --git a/apps/wallet-mobile/src/components/Icon/Icon.stories.tsx b/apps/wallet-mobile/src/components/Icon/Icon.stories.tsx
index 9b8b6c9ad0..a81b0cb2c7 100644
--- a/apps/wallet-mobile/src/components/Icon/Icon.stories.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Icon.stories.tsx
@@ -19,33 +19,33 @@ storiesOf('Icon', module).add('Gallery', () => {
 
         <Item icon={<Icon.Received />} title="Received" />
 
-        <Item icon={<Icon.WalletAvatar image="" />} title="WalletAccount" />
+        <Item icon={<Icon.WalletAvatar />} title="WalletAccount" />
 
-        <Item icon={<Icon.Emurgo width={40} height={40} />} title="Emurgo" />
+        <Item icon={<Icon.Emurgo size={40} />} title="Emurgo" />
 
         <Item icon={<Icon.Check size={40} />} title="Check" />
 
-        <Item mode="dark" icon={<Icon.YoroiWallet height={40} width={40} />} title="YoroiWallet" />
+        <Item mode="dark" icon={<Icon.YoroiWallet size={40} />} title="YoroiWallet" />
 
-        <Item icon={<Icon.Cardano height={40} width={40} />} title="Cardano" />
+        <Item icon={<Icon.Cardano size={40} />} title="Cardano" />
 
         <Item icon={<Icon.Ada size={40} />} title="AdaIcon" />
 
-        <Item icon={<Icon.RewardManuallyPayout height={40} width={40} />} title="RewardManuallyPayout" />
+        <Item icon={<Icon.RewardManuallyPayout size={40} />} title="RewardManuallyPayout" />
 
-        <Item icon={<Icon.RewardWithdrawn height={40} width={40} />} title="RewardWithdrawn" />
+        <Item icon={<Icon.RewardWithdrawn size={40} />} title="RewardWithdrawn" />
 
-        <Item icon={<Icon.StakingKeyDeregistered height={40} width={40} />} title="StakingKeyDeregistered" />
+        <Item icon={<Icon.StakingKeyDeregistered size={40} />} title="StakingKeyDeregistered" />
 
-        <Item icon={<Icon.StakingKeyRegistered height={40} width={40} />} title="StakingKeyRegistered" />
+        <Item icon={<Icon.StakingKeyRegistered size={40} />} title="StakingKeyRegistered" />
 
         <Item icon={<Icon.Transaction size={40} />} title="Transaction" />
 
-        <Item icon={<Icon.TotalAda height={40} width={40} />} title="TotalAdaIcon" />
+        <Item icon={<Icon.TotalAda size={40} />} title="TotalAdaIcon" />
 
-        <Item icon={<Icon.TotalDelegated height={40} width={40} />} title="TotalDelegated" />
+        <Item icon={<Icon.TotalDelegated size={40} />} title="TotalDelegated" />
 
-        <Item icon={<Icon.TotalReward height={40} width={40} />} title="TotalReward" />
+        <Item icon={<Icon.TotalReward size={40} />} title="TotalReward" />
 
         <Item icon={<Icon.Chevron direction="down" />} title="ChevronDown" />
 
diff --git a/apps/wallet-mobile/src/components/Icon/Image.tsx b/apps/wallet-mobile/src/components/Icon/Image.tsx
index 0c2b2c5066..6cc13f1b1b 100644
--- a/apps/wallet-mobile/src/components/Icon/Image.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Image.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Image = ({size = 36, color = 'black'}: Props) => (
+export const Image = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Info.tsx b/apps/wallet-mobile/src/components/Icon/Info.tsx
index 1ffb8f80f1..af68451ea8 100644
--- a/apps/wallet-mobile/src/components/Icon/Info.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Info.tsx
@@ -1,16 +1,11 @@
 import * as React from 'react'
-import {ImageStyle} from 'react-native'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  style?: ImageStyle
-}
+import {IconProps} from '.'
 
-export const Info = ({size = 40, color = 'black', style = {}}: Props) => {
+export const Info = ({size = 40, color = 'black'}: IconProps) => {
   return (
-    <Svg width={size} height={size} {...style} viewBox="-2 -2 25 25">
+    <Svg width={size} height={size} viewBox="-2 -2 25 25">
       <Path
         d="M12 7C11.4477 7 11 7.44771 11 8C11 8.55229 11.4477 9 12 9H12.01C12.5623 9 13.01 8.55229 13.01 8C13.01 7.44771 12.5623 7 12.01 7H12Z"
         fill={color}
diff --git a/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx b/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
index 6f733afd91..82ca9cb4fd 100644
--- a/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const InfoCircle = ({size = 16, color = '#4B6DDE'}: Props) => (
+export const InfoCircle = ({size = 16, color = '#4B6DDE'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 16 16">
     <Path
       d="M8 4.665A.667.667 0 0 0 8 6h.007a.667.667 0 0 0 0-1.334zm0 2a.667.667 0 0 0-.667.667v3.333a.667.667 0 0 0 1.334 0V7.332A.667.667 0 0 0 8 6.665"
diff --git a/apps/wallet-mobile/src/components/Icon/Language.tsx b/apps/wallet-mobile/src/components/Icon/Language.tsx
index d1d01989b8..941f141694 100644
--- a/apps/wallet-mobile/src/components/Icon/Language.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Language.tsx
@@ -1,16 +1,11 @@
 import * as React from 'react'
-import {ImageStyle} from 'react-native'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  style?: ImageStyle
-}
+import {IconProps} from '.'
 
-export const Language = ({size = 24, color = '#6B7384', ...props}: Props) => {
+export const Language = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 24 24" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <G fill={color}>
         <Path d="M8 2a1 1 0 011 1v2h4.002a.997.997 0 01.995.921.997.997 0 01-.19.67l-.002.002-.022.032a28.803 28.803 0 01-.41.558c-.278.373-.675.897-1.15 1.5a52.525 52.525 0 01-2.82 3.305l1.304 1.305a1 1 0 01-1.414 1.414l-1.306-1.306c-.972.898-1.778 1.492-2.388 1.88-.377.24-.677.4-.894.504a4.552 4.552 0 01-.342.147l-.028.01-.01.004-.005.001-.002.001a1 1 0 11-.623-1.902c.026-.01.076-.031.147-.065.143-.069.373-.19.684-.387.49-.313 1.183-.817 2.045-1.609L4.293 9.707a1 1 0 011.414-1.414l2.28 2.28a50.853 50.853 0 002.666-3.13L10.999 7H3a1 1 0 010-2h4V3a1 1 0 011-1z" />
 
diff --git a/apps/wallet-mobile/src/components/Icon/Launchpad.tsx b/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
index 40e5377e08..119014c99f 100644
--- a/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Launchpad = ({size = 36, color = 'black'}: Props) => (
+export const Launchpad = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M5 3C3.89543 3 3 3.89543 3 5C3 6.10457 3.89543 7 5 7C6.10457 7 7 6.10457 7 5C7 3.89543 6.10457 3 5 3Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Ledger.tsx b/apps/wallet-mobile/src/components/Icon/Ledger.tsx
index dda15bcd0b..8250a0f4d6 100644
--- a/apps/wallet-mobile/src/components/Icon/Ledger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Ledger.tsx
@@ -1,16 +1,14 @@
 import * as React from 'react'
-import Svg, {Path, SvgProps} from 'react-native-svg'
+import Svg, {Path} from 'react-native-svg'
 
-type Props = SvgProps & {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const Ledger = ({size = 24, ...props}: Props) => {
+export const Ledger = ({size = 24, color = '#4B6DDE'}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 24 24" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
       <Path
         d="M10.284 3.932L6.824 5.81a2 2 0 00-.766 2.776L13.07 20.43a2 2 0 002.579.788l3.398-1.614a2 2 0 00.877-2.803L12.972 4.694a2 2 0 00-2.688-.762z"
-        fill="#4B6DDE"
+        fill={color}
       />
 
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Lightning.tsx b/apps/wallet-mobile/src/components/Icon/Lightning.tsx
index 4e96aaa746..d69410490e 100644
--- a/apps/wallet-mobile/src/components/Icon/Lightning.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Lightning.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Lightning = ({size = 36, color = 'black'}: Props) => (
+export const Lightning = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Link.tsx b/apps/wallet-mobile/src/components/Icon/Link.tsx
index 65c3ae8b09..50e5df231e 100644
--- a/apps/wallet-mobile/src/components/Icon/Link.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Link.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Link = ({size = 36, color = 'black'}: Props) => (
+export const Link = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M16.4437 2.00021C14.9719 1.98733 13.5552 2.55719 12.4986 3.58488L12.4882 3.59513L10.7923 5.29339C10.4021 5.68419 10.4025 6.31736 10.7933 6.70761C11.1841 7.09785 11.8173 7.09741 12.2075 6.70661L13.8979 5.01382C14.5778 4.3551 15.4855 3.99191 16.4262 4.00014C17.3692 4.00839 18.2727 4.38923 18.9416 5.06286C19.6108 5.73671 19.9916 6.64971 19.9998 7.6056C20.008 8.55874 19.6452 9.4758 18.9912 10.1607L16.2346 12.9367C15.8688 13.3052 15.429 13.5897 14.9453 13.7714C14.4616 13.9531 13.945 14.0279 13.4304 13.9907C12.9159 13.9536 12.4149 13.8055 11.9616 13.5561C11.5822 13.3473 11.1843 12.9175 10.8027 12.4037C10.4734 11.9603 9.847 11.8679 9.40364 12.1972C8.96029 12.5266 8.86785 13.1529 9.19718 13.5963C9.60661 14.1475 10.218 14.8795 10.9975 15.3084C11.7032 15.6966 12.4838 15.9277 13.2866 15.9856C14.0893 16.0435 14.8949 15.9268 15.6486 15.6437C16.4022 15.3606 17.0861 14.9177 17.654 14.3457L20.4168 11.5635L20.429 11.551C21.4491 10.4874 22.0125 9.0642 21.9997 7.58834C21.987 6.11247 21.3992 4.69931 20.3607 3.65359C19.3221 2.60764 17.9155 2.01309 16.4437 2.00021Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Lock.tsx b/apps/wallet-mobile/src/components/Icon/Lock.tsx
index 27e6a2ce8a..be739debd1 100644
--- a/apps/wallet-mobile/src/components/Icon/Lock.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Lock.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Lock = ({size = 36, color = 'black'}: Props) => (
+export const Lock = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/LockFilled.tsx b/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
index d2e27c3538..512efad0af 100644
--- a/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const LockFilled = ({size = 16, color = 'black'}: Props) => (
+export const LockFilled = ({size = 16, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 16 16">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Logout.tsx b/apps/wallet-mobile/src/components/Icon/Logout.tsx
index 2a0b3b031d..681a661022 100644
--- a/apps/wallet-mobile/src/components/Icon/Logout.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Logout.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Logout = ({size = 36, color = 'black'}: Props) => (
+export const Logout = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path
       d="M5 4a1 1 0 00-1 1v14a1 1 0 001 1h4a1 1 0 110 2H5a3 3 0 01-3-3V5a3 3 0 013-3h4a1 1 0 010 2H5z"
diff --git a/apps/wallet-mobile/src/components/Icon/Magnify.tsx b/apps/wallet-mobile/src/components/Icon/Magnify.tsx
index b3d2114f44..510f5d07cd 100644
--- a/apps/wallet-mobile/src/components/Icon/Magnify.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Magnify.tsx
@@ -1,12 +1,11 @@
 import * as React from 'react'
-import {ImageStyle} from 'react-native'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string; style?: ImageStyle}
+import {IconProps} from '.'
 
-export const Magnify = ({size = 40, color = 'black', style = {}}: Props) => {
+export const Magnify = ({size = 40, color = 'black'}: IconProps) => {
   return (
-    <Svg width={size} {...style} height={size} viewBox="-2 -2 28 28">
+    <Svg width={size} height={size} viewBox="-2 -2 28 28">
       <Path
         fillRule="evenodd"
         clipRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Megaphone.tsx b/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
index 6f153fe043..6c89d52d8a 100644
--- a/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Megaphone = ({size = 36, color = 'black'}: Props) => (
+export const Megaphone = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Message.tsx b/apps/wallet-mobile/src/components/Icon/Message.tsx
index 1474b9220a..1a67483a98 100644
--- a/apps/wallet-mobile/src/components/Icon/Message.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Message.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Message = ({size = 36, color = 'black'}: Props) => (
+export const Message = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/MinSwap.tsx b/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
index 778fdbdcc9..9d3b9a32be 100644
--- a/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const MinSwap = ({size = 36}: Props) => (
+export const MinSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 164 164" fill="none">
     <Path
       fill="#89AAFF"
diff --git a/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx b/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
index dae3bb7846..6b32261e7d 100644
--- a/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const MuesliSwap = ({size = 36}: Props) => (
+export const MuesliSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 36 36">
     <G fill="none" fillRule="evenodd">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/MultiParty.tsx b/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
index 73c65a7a97..0be03b951e 100644
--- a/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
@@ -1,14 +1,11 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const MultiParty = ({size = 40, color = '#242838', ...props}: Props) => {
+export const MultiParty = ({size = 40, color = '#242838'}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 40 40" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 40 40" fill="none">
       <Path
         fillRule="evenodd"
         clipRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx b/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
index c4daa00593..7b24efc7b4 100644
--- a/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const MultipleWallets = ({size = 36, color = 'black'}: Props) => (
+export const MultipleWallets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/NftAsset.tsx b/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
index 7907c05602..42f09422bb 100644
--- a/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
+++ b/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const NftAsset = ({size = 36, color = 'black'}: Props) => (
+export const NftAsset = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M7.70711 6.29289C7.42111 6.00689 6.99099 5.92134 6.61732 6.07612C6.24364 6.2309 6 6.59554 6 7V11C6 11.5523 6.44772 12 7 12C7.55228 12 8 11.5523 8 11V9.41421L10.2929 11.7071C10.5789 11.9931 11.009 12.0787 11.3827 11.9239C11.7564 11.7691 12 11.4045 12 11V7C12 6.44771 11.5523 6 11 6C10.4477 6 10 6.44771 10 7V8.58578L7.70711 6.29289Z"
diff --git a/apps/wallet-mobile/src/components/Icon/NoNfts.tsx b/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
index 3e037ddc7b..239b09acc6 100644
--- a/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
+++ b/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
@@ -1,11 +1,9 @@
 import * as React from 'react'
 import Svg, {Defs, G, LinearGradient, Path, Stop} from 'react-native-svg'
 
-interface Props {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const NoNfts = ({size = 36}: Props) => (
+export const NoNfts = ({size = 36}: IconProps) => (
   <Svg width={size} height={(size / 143) * 101} viewBox="0 0 143 101">
     <G stroke="#1D45BA" strokeWidth={0.5}>
       <Path d="m48.874 99.14 93.081-53.396M13.553 72.55l86.8-49.851M43.506 16.36l98.019 56.136M1.045 52.942 83.175 100" />
diff --git a/apps/wallet-mobile/src/components/Icon/Pin.tsx b/apps/wallet-mobile/src/components/Icon/Pin.tsx
index 08e8f67591..17bf6846c8 100644
--- a/apps/wallet-mobile/src/components/Icon/Pin.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Pin.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Pin = ({size = 36, color = 'black'}: Props) => (
+export const Pin = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M2.6628 14.1571C2.56736 14.1 2.51964 14.019 2.51964 13.9143C2.51964 13.8667 2.54085 13.8048 2.58326 13.7286C2.58326 13.719 2.60978 13.6905 2.6628 13.6429L3.68086 12.8714L2.36056 12.8L2.23331 12.7714C2.14847 12.7524 2.08484 12.7048 2.04242 12.6286C2 12.5429 1.9894 12.4571 2.0106 12.3714L2.47191 11.1C2.49312 11.0238 2.54615 10.9667 2.63099 10.9286C2.72643 10.8905 2.81657 10.881 2.90141 10.9L3.02867 10.9429L4.14217 11.5714L3.83993 10.4286L3.82403 10.3143C3.82403 10.2381 3.85584 10.1667 3.91947 10.1C3.9937 10.0333 4.07854 10 4.17399 10H5.65336C5.7488 10 5.82834 10.0333 5.89196 10.1C5.9662 10.1667 6.00331 10.2381 6.00331 10.3143L5.98741 10.4286L5.65336 11.5857L6.78277 10.9429L6.91003 10.9C6.93123 10.8905 6.95775 10.8857 6.98956 10.8857C7.0744 10.8857 7.14863 10.9048 7.21226 10.9429C7.2865 10.981 7.32892 11.0333 7.33952 11.1L7.81674 12.3714L7.83264 12.4571C7.83264 12.5238 7.80613 12.5905 7.75311 12.6571C7.71069 12.7143 7.65236 12.7524 7.57813 12.7714L7.46678 12.8L6.13057 12.8857L7.16454 13.6429C7.21756 13.6905 7.24408 13.719 7.24408 13.7286C7.2865 13.8048 7.30771 13.8667 7.30771 13.9143C7.30771 14.019 7.25998 14.1 7.16454 14.1571L5.9715 14.9571C5.90787 14.9857 5.83894 15 5.76471 15C5.63745 15 5.542 14.9571 5.47838 14.8714L5.41475 14.7857L4.90572 13.6714L4.41259 14.7857C4.38078 14.8333 4.35427 14.8619 4.33306 14.8714C4.26943 14.9571 4.17399 15 4.04673 15C3.97249 15 3.90356 14.9857 3.83993 14.9571L2.6628 14.1571Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Placeholder.tsx b/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
index 3a7825f537..13941cf887 100644
--- a/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Placeholder = ({size = 36, color = 'black'}: Props) => (
+export const Placeholder = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx b/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
index 7318823ba7..e211738c07 100644
--- a/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
+++ b/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const PlateNumber = ({size = 36, color = 'black'}: Props) => (
+export const PlateNumber = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Plus.tsx b/apps/wallet-mobile/src/components/Icon/Plus.tsx
index be35d3d52e..6112ed75f5 100644
--- a/apps/wallet-mobile/src/components/Icon/Plus.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Plus.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Plus = ({size = 36, color = 'black'}: Props) => (
+export const Plus = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M13 5C13 4.44772 12.5523 4 12 4C11.4477 4 11 4.44772 11 5V11H5C4.44772 11 4 11.4477 4 12C4 12.5523 4.44772 13 5 13H11V19C11 19.5523 11.4477 20 12 20C12.5523 20 13 19.5523 13 19V13H19C19.5523 13 20 12.5523 20 12C20 11.4477 19.5523 11 19 11H13V5Z"
diff --git a/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx b/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
index ab0f297a72..52999aff48 100644
--- a/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const PlusCircle = ({size = 36, color = 'black'}: Props) => (
+export const PlusCircle = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M12 7C12.5523 7 13 7.44772 13 8V11H16C16.5523 11 17 11.4477 17 12C17 12.5523 16.5523 13 16 13H13V16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16V13H8C7.44772 13 7 12.5523 7 12C7 11.4477 7.44772 11 8 11H11V8C11 7.44772 11.4477 7 12 7Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Portfolio.tsx b/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
index b1b2b35726..e0f2435323 100644
--- a/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Portfolio = ({size = 36, color = 'black'}: Props) => (
+export const Portfolio = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 18" fill="none">
     <Path
       d="M18 4V2C18 0.897 17.103 0 16 0H3C1.346 0 0 1.346 0 3V15C0 17.201 1.794 18 3 18H18C19.103 18 20 17.103 20 16V6C20 4.897 19.103 4 18 4ZM16 13H14V9H16V13ZM3 4C2.74252 3.98848 2.49941 3.87809 2.32128 3.69182C2.14315 3.50554 2.04373 3.25774 2.04373 3C2.04373 2.74226 2.14315 2.49446 2.32128 2.30818C2.49941 2.12191 2.74252 2.01152 3 2H16V4H3Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Qr.tsx b/apps/wallet-mobile/src/components/Icon/Qr.tsx
index 73c29fff12..b914921cb0 100644
--- a/apps/wallet-mobile/src/components/Icon/Qr.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Qr.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Qr = ({size = 36, color = 'black'}: Props) => (
+export const Qr = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M6 5C5.44772 5 5 5.44772 5 6C5 6.55228 5.44772 7 6 7H6.01C6.56228 7 7.01 6.55228 7.01 6C7.01 5.44772 6.56228 5 6.01 5H6Z"
diff --git a/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx b/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
index 00d3b931ac..62230591ba 100644
--- a/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
+++ b/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const QuestionMark = ({size = 36, color = 'black'}: Props) => (
+export const QuestionMark = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M12.2581 8.02431C11.7926 7.94446 11.3138 8.03194 10.9066 8.27126C10.4994 8.51057 10.1901 8.88628 10.0333 9.33184C9.85006 9.85282 9.27914 10.1266 8.75815 9.94333C8.23716 9.76005 7.96339 9.18914 8.14666 8.66815C8.46013 7.77704 9.07886 7.02562 9.89327 6.54699C10.7077 6.06836 11.6652 5.8934 12.5962 6.0531C13.5273 6.2128 14.3717 6.69685 14.9801 7.41952C15.5883 8.14204 15.9213 9.05647 15.92 10.0009C15.9195 11.5313 14.7849 12.5419 13.9747 13.082C13.5391 13.3725 13.1105 13.586 12.7949 13.7263C12.6356 13.7971 12.5015 13.8508 12.4049 13.8876C12.3565 13.906 12.3173 13.9203 12.2887 13.9305L12.254 13.9427L12.2429 13.9464L12.239 13.9477L12.2375 13.9483L12.2362 13.9487C11.7123 14.1233 11.146 13.8402 10.9713 13.3162C10.7968 12.7926 11.0794 12.2267 11.6027 12.0517L11.6187 12.0461C11.6341 12.0406 11.6593 12.0314 11.6929 12.0186C11.7603 11.9929 11.8606 11.9529 11.9826 11.8987C12.2294 11.789 12.5509 11.6275 12.8653 11.4179C13.5549 10.9582 13.92 10.4691 13.92 9.99999L13.92 9.9985C13.9207 9.52618 13.7542 9.06886 13.45 8.70752C13.1459 8.34618 12.7236 8.10416 12.2581 8.02431Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Received.tsx b/apps/wallet-mobile/src/components/Icon/Received.tsx
index 19d8241269..1ab86a7dc5 100644
--- a/apps/wallet-mobile/src/components/Icon/Received.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Received.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Received = ({size = 24, color = 'black'}: Props) => (
+export const Received = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
     <Path
       d="M12.5 7a1 1 0 011 1v5.586l2.293-2.293a1 1 0 011.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 111.414-1.414l2.293 2.293V8a1 1 0 011-1z"
diff --git a/apps/wallet-mobile/src/components/Icon/Refresh.tsx b/apps/wallet-mobile/src/components/Icon/Refresh.tsx
index 95854b1d3a..abfa37c4df 100644
--- a/apps/wallet-mobile/src/components/Icon/Refresh.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Refresh.tsx
@@ -1,13 +1,9 @@
 import React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  active?: boolean
-}
+import {IconProps} from '.'
 
-export const Refresh = ({size = 24, color = '#242838', active = false}: Props) => (
+export const Refresh = ({size = 24, color = '#242838', active = false}: IconProps & {active: boolean}) => (
   <Svg width={size} height={size} viewBox="0 0 32 32" fill="none">
     <G clipPath="url(#clip0_1396_4310)">
       <Rect
diff --git a/apps/wallet-mobile/src/components/Icon/Reload.tsx b/apps/wallet-mobile/src/components/Icon/Reload.tsx
index 8d9e77dfe3..aad8f35270 100644
--- a/apps/wallet-mobile/src/components/Icon/Reload.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Reload.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Reload = ({size = 24, color = 'black'}: Props) => (
+export const Reload = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M7.555 5.348A8 8 0 0112 4c2.251 0 4.412.892 6.04 2.454l.546.546H16a1 1 0 100 2h5a.997.997 0 001-1V3a1 1 0 10-2 0v2.586l-.553-.553-.014-.014C17.443 3.105 14.786 2 12 2a10 10 0 1010 10 1 1 0 10-2 0A8 8 0 117.555 5.348z"
diff --git a/apps/wallet-mobile/src/components/Icon/Resync.tsx b/apps/wallet-mobile/src/components/Icon/Resync.tsx
index cdd9f9cb3b..a2d66183c4 100644
--- a/apps/wallet-mobile/src/components/Icon/Resync.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Resync.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Resync = ({size = 36, color = 'black'}: Props) => (
+export const Resync = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path
       d="M21 3a1 1 0 10-2 0v3.194l-.997-.898L18 5.294a8.997 8.997 0 00-15 6.705 1 1 0 102 .002 7.013 7.013 0 014.145-6.392 6.993 6.993 0 017.52 1.174l.001.001L18.016 8H14a1 1 0 100 2h6a1 1 0 001-1V3zM3 15a1 1 0 011-1h6a1 1 0 110 2H5.984l1.35 1.216A6.997 6.997 0 0019 12a1 1 0 112 .002 9.013 9.013 0 01-5.33 8.216A8.993 8.993 0 016 18.706l-.003-.002L5 17.805V21a1 1 0 11-2 0v-6z"
diff --git a/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx b/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
index 2c05a12d89..8eac5f27a1 100644
--- a/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
+++ b/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
@@ -1,14 +1,10 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  width?: number
-  height?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const RewardManuallyPayout = ({width = 36, height = 36, color = '#6B7384'}: Props) => (
-  <Svg viewBox="0 0 36 36" {...{width, height}}>
+export const RewardManuallyPayout = ({size = 36, color = '#6B7384'}: IconProps) => (
+  <Svg viewBox="0 0 36 36" width={size} height={size}>
     <G stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
       <G transform="translate(-760.000000, -561.000000)" fill={color}>
         <G transform="translate(760.000000, 561.000000)">
diff --git a/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx b/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
index 44c97b1ba7..2cb12ba827 100644
--- a/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
+++ b/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
@@ -1,14 +1,10 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  width?: number
-  height?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const RewardWithdrawn = ({width = 36, height = 36, color = '#6B7384'}: Props) => (
-  <Svg viewBox="0 0 36 36" {...{width, height}}>
+export const RewardWithdrawn = ({size = 36, color = '#6B7384'}: IconProps) => (
+  <Svg viewBox="0 0 36 36" width={size} height={size}>
     <G stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
       <G transform="translate(-760.000000, -425.000000)" fill={color}>
         <G transform="translate(760.000000, 425.000000)">
diff --git a/apps/wallet-mobile/src/components/Icon/Sandbox.tsx b/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
index 5e44a8e706..ce1ccbb3e5 100644
--- a/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Sandbox = ({size = 36, color = 'black'}: Props) => (
+export const Sandbox = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Send.tsx b/apps/wallet-mobile/src/components/Icon/Send.tsx
index 176304c885..4c76ffdc2f 100644
--- a/apps/wallet-mobile/src/components/Icon/Send.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Send.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Send = ({size = 24, color = '#6B7384'}: Props) => (
+export const Send = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24">
     <Path
       d="M7.793 11.293l4-4a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L13.5 10.414V16a1 1 0 11-2 0v-5.586l-2.293 2.293a1 1 0 01-1.414-1.414z"
diff --git a/apps/wallet-mobile/src/components/Icon/Settings.tsx b/apps/wallet-mobile/src/components/Icon/Settings.tsx
index 0268e0fafe..9a1c334c6e 100644
--- a/apps/wallet-mobile/src/components/Icon/Settings.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Settings.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Settings = ({size = 36, color = 'black'}: Props) => (
+export const Settings = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M10 5C10 3.89543 10.8954 3 12 3C13.1046 3 14 3.89543 14 5C14 6.10457 13.1046 7 12 7C10.8954 7 10 6.10457 10 5Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Share.tsx b/apps/wallet-mobile/src/components/Icon/Share.tsx
index 370cf830c3..fa7f12029c 100644
--- a/apps/wallet-mobile/src/components/Icon/Share.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Share.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Share = ({size = 36, color = '#000000'}: Props) => {
+export const Share = ({size = 36, color = '#000000'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 24 25" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Share2.tsx b/apps/wallet-mobile/src/components/Icon/Share2.tsx
index 4efc74fcb1..b71d1af5b4 100644
--- a/apps/wallet-mobile/src/components/Icon/Share2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Share2.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Share2 = ({size = 24, color = 'black'}: Props) => (
+export const Share2 = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M11.293 2.293a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L13 5.414V16a1 1 0 11-2 0V5.414L8.707 7.707a1 1 0 01-1.414-1.414l4-4z"
diff --git a/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx b/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
index dcdce074ed..927b90d710 100644
--- a/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const SliderSettings = ({size = 36, color = 'black'}: Props) => (
+export const SliderSettings = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/SortTable.tsx b/apps/wallet-mobile/src/components/Icon/SortTable.tsx
index 19f2ac4b2a..b3af083cff 100644
--- a/apps/wallet-mobile/src/components/Icon/SortTable.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SortTable.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const SortTable = ({size = 36, color = 'black'}: Props) => (
+export const SortTable = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M11.5588 18.7626C11.614 18.8372 11.682 18.897 11.758 18.9379C11.834 18.9788 11.9164 19 11.9998 19C12.0832 19 12.1656 18.9788 12.2416 18.9379C12.3177 18.897 12.3856 18.8372 12.4409 18.7626L15.8494 14.1753C16.1883 13.7204 15.9179 13 15.4084 13H8.59124C8.08228 13 7.81187 13.7204 8.15018 14.176L11.5588 18.7626Z"
diff --git a/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx b/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
index 502012c011..bfa42baba7 100644
--- a/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const SpectrumSwap = ({size = 36}: Props) => (
+export const SpectrumSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 44 41" fill="none">
     <G clipPath="url(#clip0_8294_205086)">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Square.tsx b/apps/wallet-mobile/src/components/Icon/Square.tsx
index 9ae0ae0d95..ba3d0ad68e 100644
--- a/apps/wallet-mobile/src/components/Icon/Square.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Square.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Square = ({size = 24, color = 'black'}: Props) => (
+export const Square = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Staking.tsx b/apps/wallet-mobile/src/components/Icon/Staking.tsx
index 0db2bc089e..604adfdb28 100644
--- a/apps/wallet-mobile/src/components/Icon/Staking.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Staking.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Staking = ({size = 36, color = 'black'}: Props) => (
+export const Staking = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx b/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
index 45bb46e63a..4d73e0caff 100644
--- a/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
@@ -1,14 +1,10 @@
 import React from 'react'
 import Svg, {Circle, G, Line, Path, Rect} from 'react-native-svg'
 
-type Props = {
-  width?: number
-  height?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const StakingKeyDeregistered = ({width = 36, height = 36, color = '#6B7384'}: Props) => (
-  <Svg viewBox="0 0 36 36" {...{width, height}}>
+export const StakingKeyDeregistered = ({size = 36, color = '#6B7384'}: IconProps) => (
+  <Svg viewBox="0 0 36 36" width={size} height={size}>
     <G stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
       <G transform="translate(-760.000000, -305.000000)">
         <G transform="translate(760.000000, 305.000000)">
diff --git a/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx b/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
index 9c6177c453..a721e72da3 100644
--- a/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
@@ -1,14 +1,10 @@
 import React from 'react'
 import Svg, {G, Line, Path, Polyline, Rect} from 'react-native-svg'
 
-type Props = {
-  width?: number
-  height?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const StakingKeyRegistered = ({width = 36, height = 36, color = '#6B7384'}: Props) => (
-  <Svg viewBox="0 0 36 36" {...{width, height}}>
+export const StakingKeyRegistered = ({size = 36, color = '#6B7384'}: IconProps) => (
+  <Svg viewBox="0 0 36 36" width={size} height={size}>
     <G stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
       <G transform="translate(-760.000000, -245.000000)">
         <G transform="translate(760.000000, 245.000000)">
diff --git a/apps/wallet-mobile/src/components/Icon/StarFilled.tsx b/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
index 9ff5d7370f..bd205c3554 100644
--- a/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const StarFilled = ({size = 36, color = 'black'}: Props) => (
+export const StarFilled = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx b/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
index 7fd88f01c8..197b178a28 100644
--- a/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const StarOutlined = ({size = 36, color = 'black'}: Props) => (
+export const StarOutlined = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx b/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
index c11744f735..ae98736a86 100644
--- a/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const SundaeSwap = ({size = 36}: Props) => (
+export const SundaeSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 85.489 83.521" fill="none">
     <Path
       fill="#6b7495"
diff --git a/apps/wallet-mobile/src/components/Icon/Support.tsx b/apps/wallet-mobile/src/components/Icon/Support.tsx
index db1efa4b0e..68ce265654 100644
--- a/apps/wallet-mobile/src/components/Icon/Support.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Support.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Support = ({size = 36, color = 'black'}: Props) => (
+export const Support = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Swap.tsx b/apps/wallet-mobile/src/components/Icon/Swap.tsx
index 7881c4d56f..84a5f98414 100644
--- a/apps/wallet-mobile/src/components/Icon/Swap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Swap.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const Swap = ({size = 24, color}: Props) => (
+export const Swap = ({size = 24, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
     <Path
       d="M16.793 2.293a1 1 0 011.414 0l4 4a1 1 0 01-1.414 1.414L18.5 5.414V15a1 1 0 11-2 0V5.414l-2.293 2.293a1 1 0 11-1.414-1.414l4-4zM8.5 9a1 1 0 00-2 0v9.586l-2.293-2.293a1 1 0 00-1.414 1.414l4 4a1 1 0 001.414 0l4-4a1 1 0 00-1.414-1.414L8.5 18.586V9z"
diff --git a/apps/wallet-mobile/src/components/Icon/Switch.tsx b/apps/wallet-mobile/src/components/Icon/Switch.tsx
index 212273fdd8..85952e1b1b 100644
--- a/apps/wallet-mobile/src/components/Icon/Switch.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Switch.tsx
@@ -2,9 +2,9 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size: number; color?: string}
+import {IconProps} from '.'
 
-export const Switch = (props: Props) => {
+export const Switch = (props: IconProps) => {
   const {color: colors} = useTheme()
   const {size, color = colors.primary_500} = props
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx b/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
index f8e50ad87d..015187508a 100644
--- a/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabDiscover = ({size = 36, color = 'black'}: Props) => (
+export const TabDiscover = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx b/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
index bb5b85c702..97d9628bde 100644
--- a/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabDiscoverActive = ({size = 24, color = '#6B7384'}: Props) => {
+export const TabDiscoverActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/TabMenu.tsx b/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
index 875369154a..74dd0e5815 100644
--- a/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabMenu = ({size = 36, color = 'black'}: Props) => (
+export const TabMenu = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size - 1} viewBox="0 0 25 24" fill="none">
     <G fill={color}>
       <Path d="M7.125 7a1 1 0 000 2h10a1 1 0 100-2h-10zM6.125 12a1 1 0 011-1h10a1 1 0 110 2h-10a1 1 0 01-1-1zM7.125 15a1 1 0 100 2h10a1 1 0 100-2h-10z" />
diff --git a/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx b/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
index 9d8d8671a7..b797ff1380 100644
--- a/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabMenuActive = ({size = 24, color = '#6B7384'}: Props) => {
+export const TabMenuActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx b/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
index 97230c5788..5c46beaea7 100644
--- a/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const TabPortfolio = ({size = 24, color = '#6B7384'}: Props) => (
+export const TabPortfolio = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <Path
       d="M10.625 3h-6a1 1 0 00-1 1v6a1 1 0 001 1h6a1 1 0 001-1V4a1 1 0 00-1-1zm-1 6h-4V5h4v4zm11 4h-6a1 1 0 00-1 1v6a1 1 0 001 1h6a1 1 0 001-1v-6a1 1 0 00-1-1zm-1 6h-4v-4h4v4zm-2-16c-2.206 0-4 1.794-4 4s1.794 4 4 4 4-1.794 4-4-1.794-4-4-4zm0 6c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm-10 4c-2.206 0-4 1.794-4 4s1.794 4 4 4 4-1.794 4-4-1.794-4-4-4zm0 6c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2z"
diff --git a/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx b/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
index 361d82e17d..f42830307a 100644
--- a/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabPortfolioActive = ({size = 24, color = '#6B7384'}: Props) => {
+export const TabPortfolioActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/TabStaking.tsx b/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
index c7bb50cb83..59f09516b9 100644
--- a/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
@@ -1,9 +1,9 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-type Props = {size?: number; color?: string}
+import {IconProps} from '.'
 
-export const TabStaking = ({size = 24, color = '#6B7384'}: Props) => (
+export const TabStaking = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
     <G stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
       <G transform="translate(2.751854, 2.000000)" fill={color} fillRule="nonzero">
diff --git a/apps/wallet-mobile/src/components/Icon/TabWallet.tsx b/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
index 18b62b1151..34092b8eb9 100644
--- a/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
@@ -1,12 +1,9 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabWallet = ({size = 24, color = '#6B7384'}: Props) => {
+export const TabWallet = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx b/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
index 4b05bff9d2..7f234e23ba 100644
--- a/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TabWalletActive = ({size = 24, color = '#6B7384'}: Props) => {
+export const TabWalletActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
     <Svg width={size} height={size - 1} viewBox="0 0 25 24" fill="none">
       <Path
diff --git a/apps/wallet-mobile/src/components/Icon/Table.tsx b/apps/wallet-mobile/src/components/Icon/Table.tsx
index dd5f73deff..ca0e5972b2 100644
--- a/apps/wallet-mobile/src/components/Icon/Table.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Table.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Table = ({size = 36, color = 'black'}: Props) => (
+export const Table = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Telegram.tsx b/apps/wallet-mobile/src/components/Icon/Telegram.tsx
index 157a0d3e73..c754fd9f32 100644
--- a/apps/wallet-mobile/src/components/Icon/Telegram.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Telegram.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Telegram = ({size = 36, color = 'black'}: Props) => (
+export const Telegram = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M20.65 4.1052L2.93388 10.6219C1.72482 11.0851 1.73182 11.7285 2.71205 12.0154L7.2605 13.3689L17.7843 7.03519C18.2819 6.74638 18.7365 6.90175 18.3628 7.21819L9.83648 14.5584H9.83448L9.83648 14.5594L9.52273 19.0315C9.98237 19.0315 10.1852 18.8304 10.443 18.5931L12.6523 16.5438L17.2477 19.7817C18.095 20.2268 18.7036 19.998 18.9144 19.0334L21.931 5.47202C22.2398 4.29107 21.4584 3.75635 20.65 4.1052Z"
diff --git a/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx b/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
index 31129e5070..5e3c57ca52 100644
--- a/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TermsOfUse = ({size = 36, color = 'black'}: Props) => (
+export const TermsOfUse = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Theme.tsx b/apps/wallet-mobile/src/components/Icon/Theme.tsx
index 6866c7ed53..6e9273e2ac 100644
--- a/apps/wallet-mobile/src/components/Icon/Theme.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Theme.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Theme = ({size = 20, color = '#6B7384'}: Props) => (
+export const Theme = ({size = 20, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20" fill="none">
     <Path
       d="M16 8.5C16 9.32843 15.3284 10 14.5 10C13.6716 10 13 9.32843 13 8.5C13 7.67157 13.6716 7 14.5 7C15.3284 7 16 7.67157 16 8.5Z"
diff --git a/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx b/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
index c7eede7d13..cb014012a2 100644
--- a/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const ThumbsUp = ({size = 36, color = 'black'}: Props) => (
+export const ThumbsUp = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Tokens.tsx b/apps/wallet-mobile/src/components/Icon/Tokens.tsx
index 4305748546..ec55ba9c46 100644
--- a/apps/wallet-mobile/src/components/Icon/Tokens.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Tokens.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Tokens = ({size = 36, color = 'black'}: Props) => (
+export const Tokens = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M9.83203 6.4453C9.64657 6.1671 9.33434 6 8.99998 6C8.66563 6 8.3534 6.1671 8.16793 6.4453L6.16793 9.4453C5.86158 9.90483 5.98576 10.5257 6.44528 10.8321C6.90481 11.1384 7.52568 11.0142 7.83203 10.5547L8.99998 8.80278L10.1679 10.5547C10.4743 11.0142 11.0952 11.1384 11.5547 10.8321C12.0142 10.5257 12.1384 9.90483 11.832 9.4453L9.83203 6.4453Z"
diff --git a/apps/wallet-mobile/src/components/Icon/TotalAda.tsx b/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
index 8b5a05fe75..0ea75d360d 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
@@ -1,17 +1,12 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-type Props = {
-  width: number
-  height: number
-  backgroundColor?: string
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TotalAda = ({width, height, backgroundColor = '#F0F3F5', color = 'black'}: Props) => (
-  <Svg viewBox="0 0 44 44" {...{width, height}}>
+export const TotalAda = ({size = 44, color = 'black'}: IconProps) => (
+  <Svg viewBox="0 0 44 44" width={size} height={size}>
     <G id="icon/total-ada.inline" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-      <G id="icon/bg-for-icon" fill={backgroundColor}>
+      <G id="icon/bg-for-icon" fill="#F0F3F5">
         <Circle id="Oval-Copy-4" cx="22" cy="22" r="22" />
       </G>
 
diff --git a/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx b/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
index 0bd68f8611..79432b0d5a 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
@@ -1,17 +1,12 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-type Props = {
-  width: number
-  height: number
-  backgroundColor?: string
-  color?: string
-}
-
-export const TotalDelegated = ({width, height, backgroundColor = '#F0F3F5', color = 'black'}: Props) => (
-  <Svg viewBox="0 0 44 44" {...{width, height}}>
+import {IconProps} from '.'
+
+export const TotalDelegated = ({size = 44, color = 'black'}: IconProps) => (
+  <Svg viewBox="0 0 44 44" width={size} height={size}>
     <G id="icon/total-delegated.inline" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-      <G id="icon/bg-for-icon" fill={backgroundColor}>
+      <G id="icon/bg-for-icon" fill="#F0F3F5">
         <Circle id="Oval-Copy-4" cx="22" cy="22" r="22" />
       </G>
 
diff --git a/apps/wallet-mobile/src/components/Icon/TotalReward.tsx b/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
index abd57a00df..3a6a259af7 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
@@ -1,17 +1,12 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-type Props = {
-  width: number
-  height: number
-  backgroundColor?: string
-  color?: string
-}
+import {IconProps} from '.'
 
-export const TotalReward = ({width, height, backgroundColor = '#F0F3F5', color = 'black'}: Props) => (
-  <Svg viewBox="0 0 44 44" {...{width, height}}>
+export const TotalReward = ({size = 44, color = 'black'}: IconProps) => (
+  <Svg viewBox="0 0 44 44" width={size} height={size}>
     <G id="icon/total-rewards.inline" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-      <G id="icon/bg-for-icon" fill={backgroundColor}>
+      <G id="icon/bg-for-icon" fill="#F0F3F5">
         <Circle id="Oval-Copy-4" cx="22" cy="22" r="22" />
       </G>
 
diff --git a/apps/wallet-mobile/src/components/Icon/Transaction.tsx b/apps/wallet-mobile/src/components/Icon/Transaction.tsx
index 2dd0df696c..244d3d52b3 100644
--- a/apps/wallet-mobile/src/components/Icon/Transaction.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Transaction.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Transaction = ({size = 24, color = '#242838'}: Props) => (
+export const Transaction = ({size = 24, color = '#242838'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path
       d="M7.445 8.168a1 1 0 00-.277 1.387L8.798 12l-1.63 2.445a1 1 0 101.664 1.11l2-3a1 1 0 000-1.11l-2-3a1 1 0 00-1.387-.277zM16.832 9.555a1 1 0 00-1.664-1.11l-2 3a1 1 0 000 1.11l2 3a1 1 0 001.664-1.11L15.202 12l1.63-2.445z"
diff --git a/apps/wallet-mobile/src/components/Icon/Twitter.tsx b/apps/wallet-mobile/src/components/Icon/Twitter.tsx
index 593e9cbc28..410d7abbe4 100644
--- a/apps/wallet-mobile/src/components/Icon/Twitter.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Twitter.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Twitter = ({size = 36, color = 'black'}: Props) => (
+export const Twitter = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M19.9452 7.98747C19.9585 8.16289 19.9585 8.3373 19.9585 8.51172C19.9585 13.8494 15.8337 20 8.29554 20C5.97313 20 3.81559 19.3374 2 18.1867C2.32974 18.2238 2.64726 18.2368 2.99023 18.2368C4.83533 18.2412 6.62818 17.6335 8.07979 16.5117C7.22432 16.4965 6.39505 16.2185 5.70775 15.7166C5.02046 15.2146 4.50945 14.5139 4.24608 13.7121C4.49949 13.7492 4.75392 13.7742 5.02056 13.7742C5.38795 13.7742 5.75738 13.7241 6.10035 13.6369C5.17195 13.4523 4.33714 12.9566 3.73786 12.2342C3.13857 11.5119 2.81182 10.6073 2.81315 9.67448V9.62436C3.35966 9.92407 3.99369 10.1115 4.66538 10.1366C4.10268 9.76828 3.64128 9.26854 3.32235 8.68191C3.00342 8.09528 2.83687 7.44003 2.83757 6.77459C2.83757 6.02481 3.0401 5.33718 3.39528 4.73775C4.42534 5.98574 5.71006 7.0067 7.16623 7.73453C8.6224 8.46235 10.2175 8.88081 11.8484 8.96279C11.7853 8.66207 11.7466 8.35033 11.7466 8.03759C11.7463 7.50729 11.8522 6.98214 12.0581 6.49216C12.264 6.00218 12.5659 5.55697 12.9467 5.182C13.3274 4.80702 13.7794 4.50962 14.2769 4.30681C14.7743 4.10399 15.3075 3.99974 15.8459 4C17.0265 4 18.092 4.48716 18.841 5.27503C19.7588 5.10023 20.6389 4.77025 21.4423 4.29971C21.1364 5.23274 20.4956 6.02391 19.6399 6.525C20.4539 6.43356 21.2494 6.22273 22 5.89951C21.4394 6.70452 20.7447 7.41044 19.9452 7.98747Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Usb.tsx b/apps/wallet-mobile/src/components/Icon/Usb.tsx
index 0ebb57c3aa..2438d40c12 100644
--- a/apps/wallet-mobile/src/components/Icon/Usb.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Usb.tsx
@@ -1,14 +1,11 @@
 import * as React from 'react'
-import Svg, {Path, SvgProps} from 'react-native-svg'
+import Svg, {Path} from 'react-native-svg'
 
-type Props = SvgProps & {
-  color?: string
-  size?: number
-}
+import {IconProps} from '.'
 
-export const Usb = ({color = '#4B6DDE', size = 25, ...props}: Props) => {
+export const Usb = ({color = '#4B6DDE', size = 25}: IconProps) => {
   return (
-    <Svg width={size} height={size} viewBox="0 0 25 25" fill="none" {...props}>
+    <Svg width={size} height={size} viewBox="0 0 25 25" fill="none">
       <Path
         d="M16.5 10h1v2h-4V6h2l-3-4-3 4h2v8h-4v-2.277a1.992 1.992 0 00.414-3.137A2 2 0 004.5 10c0 .738.404 1.376 1 1.723V14c0 1.103.897 2 2 2h4v2.277a1.99 1.99 0 00-.414 3.137A2 2 0 0014.5 20c0-.738-.404-1.376-1-1.723V14h4c1.103 0 2-.897 2-2v-2h1V6h-4v4z"
         fill={color}
diff --git a/apps/wallet-mobile/src/components/Icon/Verify.tsx b/apps/wallet-mobile/src/components/Icon/Verify.tsx
index d75b9027d8..280dcf4a44 100644
--- a/apps/wallet-mobile/src/components/Icon/Verify.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Verify.tsx
@@ -1,13 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-  backgroundColor?: string
-}
+import {IconProps} from '.'
 
-export const Verify = ({size = 40, color = 'black'}: Props) => (
+export const Verify = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M16.7071 10.7071C17.0976 10.3166 17.0976 9.68342 16.7071 9.29289C16.3166 8.90237 15.6834 8.90237 15.2929 9.29289L11 13.5858L8.70711 11.2929C8.31658 10.9024 7.68342 10.9024 7.29289 11.2929C6.90237 11.6834 6.90237 12.3166 7.29289 12.7071L10.2929 15.7071C10.6834 16.0976 11.3166 16.0976 11.7071 15.7071L16.7071 10.7071Z"
diff --git a/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx b/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
index 2aa521ce35..b7acd24ec6 100644
--- a/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const VyfiSwap = ({size = 36}: Props) => (
+export const VyfiSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 40 40" fill="none">
     <Path
       d="M21.6886 0C21.7946 0.217 22.0656 0.025 22.1886 0.2C22.3406 0.272 22.4886 0.291 22.6016 0.486C22.8366 0.892 23.2856 1.105 23.6416 1.401C25.1216 2.635 26.6126 3.856 28.1126 5.065C29.7686 6.4 31.4076 7.759 33.1076 9.04C34.7426 10.271 36.3216 11.573 37.9376 12.829C38.1626 13.004 38.3786 13.188 38.6876 13.182C38.9196 13.55 39.0496 13.952 39.0876 14.385C39.0996 14.605 38.9396 14.527 38.8596 14.492C37.3366 13.832 35.8416 13.117 34.4596 12.186C34.3926 12.029 34.2796 11.915 34.1426 11.812C31.7556 10.012 29.4216 8.142 27.0526 6.318C26.1476 5.621 25.3116 4.83 24.3186 4.249C24.0176 4.133 23.9006 3.832 23.6916 3.624C22.6336 2.57 21.6156 1.473 20.4086 0.579C20.2506 0.462 19.9736 0.361 20.1326 0.057C20.3506 0.024 20.5786 0.106 20.7896 0H21.6896H21.6886Z"
diff --git a/apps/wallet-mobile/src/components/Icon/Wallet.tsx b/apps/wallet-mobile/src/components/Icon/Wallet.tsx
index 48e7ed88fe..c18eee1927 100644
--- a/apps/wallet-mobile/src/components/Icon/Wallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Wallet.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Wallet = ({size = 36, color = 'black'}: Props) => (
+export const Wallet = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx b/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
index b0e0327187..b307416c23 100644
--- a/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
@@ -3,13 +3,9 @@ import {Image} from 'expo-image'
 import React from 'react'
 import {StyleSheet, View, ViewStyle} from 'react-native'
 
-type Props = {
-  image: string
-  style?: ViewStyle
-  size?: number
-}
+import {IconProps} from '.'
 
-export const WalletAvatar = ({image = '', size = 40, style}: Props) => {
+export const WalletAvatar = ({image = '', size = 40, style}: IconProps & {image?: string; style?: ViewStyle}) => {
   const styles = useStyles()
 
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/WalletStack.tsx b/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
index ee59271f41..b511fe3c54 100644
--- a/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const WalletStack = ({size = 36, color = 'black'}: Props) => (
+export const WalletStack = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path d="M8 2C6.89543 2 6 2.89543 6 4H18C18 2.89543 17.1046 2 16 2H8Z" fill={color} />
 
diff --git a/apps/wallet-mobile/src/components/Icon/Wallets.tsx b/apps/wallet-mobile/src/components/Icon/Wallets.tsx
index b7be443805..3cb3b11bea 100644
--- a/apps/wallet-mobile/src/components/Icon/Wallets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Wallets.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Wallets = ({size = 36, color = 'black'}: Props) => (
+export const Wallets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       fillRule="evenodd"
diff --git a/apps/wallet-mobile/src/components/Icon/Warning.tsx b/apps/wallet-mobile/src/components/Icon/Warning.tsx
index 8517a9c920..b5cc52396c 100644
--- a/apps/wallet-mobile/src/components/Icon/Warning.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Warning.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const Warning = ({size = 36, color = 'black'}: Props) => (
+export const Warning = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
     <Path d="M12 8a1 1 0 011 1v4a1 1 0 11-2 0V9a1 1 0 011-1zM12 15a1 1 0 100 2h.01a1 1 0 100-2H12z" fill={color} />
 
diff --git a/apps/wallet-mobile/src/components/Icon/WingRiders.tsx b/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
index 6aa8c7656a..8538254a26 100644
--- a/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
@@ -2,10 +2,9 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
-export const WingRiders = ({size = 36}: Props) => {
+import {IconProps} from '.'
+
+export const WingRiders = ({size = 36}: IconProps) => {
   const {color} = useTheme()
 
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx b/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
index 4bcda88191..80dd6a9616 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
@@ -1,11 +1,9 @@
 import React from 'react'
 import Svg, {Defs, LinearGradient, Path, Rect, Stop} from 'react-native-svg'
 
-type Props = {
-  size?: number
-}
+import {IconProps} from '.'
 
-export const YoroiApp = ({size = 36}: Props) => {
+export const YoroiApp = ({size = 36}: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 49 48" fill="none">
       <Rect x={0.5} width={48} height={48} rx={8} fill="url(#paint0_linear_16084_126466)" />
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx b/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
index 64fdfa8715..4c79015105 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
@@ -1,12 +1,9 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-type Props = {
-  size?: number
-  color?: string
-}
+import {IconProps} from '.'
 
-export const YoroiNightly = ({size = 36, color = 'black'}: Props) => (
+export const YoroiNightly = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
     <Path
       d="M21.4376 16.0369C21.5294 16.0559 21.6134 16.1019 21.6788 16.169C21.7434 16.2373 21.7859 16.3235 21.8009 16.4163C21.816 16.5091 21.8028 16.6043 21.7631 16.6895C21.0174 18.2978 19.8905 19.6996 18.4802 20.7732C17.07 21.8469 15.419 22.5598 13.6707 22.85C11.9224 23.1403 10.1297 22.9991 8.44832 22.4388C6.76696 21.8785 5.2478 20.9159 4.0228 19.6348C2.7978 18.3537 1.90402 16.7927 1.41911 15.0875C0.934202 13.3823 0.872828 11.5845 1.24032 9.85017C1.60781 8.11586 2.39306 6.49754 3.52784 5.1358C4.66262 3.77406 6.1126 2.71009 7.75183 2.03633C7.83918 1.99933 7.93571 1.98975 8.02863 2.00886C8.12154 2.02797 8.20646 2.07487 8.27213 2.14334C8.33781 2.21182 8.38113 2.29863 8.39638 2.39229C8.41162 2.48595 8.39806 2.58204 8.35749 2.66781C7.51042 4.4833 7.23133 6.51242 7.55677 8.4893C7.88222 10.4662 8.79702 12.2986 10.1813 13.7465C11.5656 15.1944 13.3549 16.1902 15.3146 16.6034C17.2743 17.0166 19.3131 16.828 21.1638 16.0623C21.2505 16.0267 21.3459 16.0179 21.4376 16.0369Z"
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx b/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
index e90c453dd9..44af722583 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
@@ -1,15 +1,11 @@
-import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {G, Path, Polygon} from 'react-native-svg'
 
-type Props = {width?: number; height?: number; color?: string}
-
-export const YoroiWallet = (props: Props) => {
-  const {color: colors} = useTheme()
-  const {width = 210, height = 60, color = colors.white_static} = props
+import {IconProps} from '.'
 
+export const YoroiWallet = ({color = 'white', size = 210}: IconProps) => {
   return (
-    <Svg width={width} height={height} viewBox="0 0 210 60">
+    <Svg width={size} height={size / 3.5} viewBox="0 0 210 60">
       <G id="logo-yoroi" fill="none">
         <G id="logo">
           <G id="Group">
diff --git a/apps/wallet-mobile/src/components/Icon/index.ts b/apps/wallet-mobile/src/components/Icon/index.ts
index 37bb92c860..7139647865 100644
--- a/apps/wallet-mobile/src/components/Icon/index.ts
+++ b/apps/wallet-mobile/src/components/Icon/index.ts
@@ -287,3 +287,8 @@ export const Icon = {
   AngleUp,
   AngleDown,
 }
+
+export type IconProps = {
+  size?: number
+  color?: string
+}
diff --git a/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.stories.tsx b/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.stories.tsx
index 9e59d4775c..9b03ef553e 100644
--- a/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.stories.tsx
+++ b/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.stories.tsx
@@ -17,7 +17,6 @@ storiesOf('Receive ShareQRCodeCard', module)
       onLongPress={action('onLongPress')}
       title="Title"
       shareLabel="share label"
-      copiedText="copied text"
     />
   ))
 
diff --git a/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.tsx b/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.tsx
index 55c55c85b4..ab59525782 100644
--- a/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.tsx
+++ b/apps/wallet-mobile/src/components/ShareQRCodeCard/ShareQRCodeCard.tsx
@@ -1,10 +1,16 @@
 import {useTheme} from '@yoroi/theme'
 import _ from 'lodash'
 import * as React from 'react'
-import {StyleSheet, TouchableOpacity, TouchableWithoutFeedback, useWindowDimensions, View} from 'react-native'
+import {
+  GestureResponderEvent,
+  StyleSheet,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  useWindowDimensions,
+  View,
+} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 import QRCode from 'react-native-qrcode-svg'
-import Animated, {FadeInDown, FadeOutDown, Layout} from 'react-native-reanimated'
 import Share from 'react-native-share'
 import ViewShot, {captureRef} from 'react-native-view-shot'
 
@@ -16,24 +22,20 @@ type ShareQRCodeCardProps = {
   qrContent: string
   shareContent: string
   title: string
-  isCopying?: boolean
-  onLongPress: () => void
-  testId?: string
+  onLongPress: (event: GestureResponderEvent) => void
+  testID?: string
   onShare?: () => void
   shareLabel: string
-  copiedText: string
 }
 
 export const ShareQRCodeCard = ({
   qrContent,
   shareContent,
   title,
-  isCopying,
   onLongPress,
-  testId,
+  testID,
   onShare,
   shareLabel,
-  copiedText,
 }: ShareQRCodeCardProps) => {
   const {styles, colors, qrSize} = useStyles()
 
@@ -84,12 +86,12 @@ export const ShareQRCodeCard = ({
 
           <Spacer height={16} />
 
-          <Text style={styles.title} testID={`${testId}-title`}>
+          <Text style={styles.title} testID={`${testID}-title`}>
             {title}
           </Text>
 
           <View style={styles.addressContainer}>
-            <View style={styles.qrCode} testID={`${testId}-qr`}>
+            <View style={styles.qrCode} testID={`${testID}-qr`}>
               <QRCode value={qrContent} size={qrSize} backgroundColor={colors.white} color={colors.black} />
             </View>
 
@@ -102,12 +104,6 @@ export const ShareQRCodeCard = ({
             <Text style={styles.textShareAddress}>{shareLabel}</Text>
           </TouchableOpacity>
         </View>
-
-        {isCopying && (
-          <Animated.View layout={Layout} entering={FadeInDown} exiting={FadeOutDown} style={styles.isCopying}>
-            <Text style={styles.copiedText}>{copiedText}</Text>
-          </Animated.View>
-        )}
       </>
     </TouchableWithoutFeedback>
   )
@@ -153,22 +149,6 @@ const useStyles = () => {
       textTransform: 'uppercase',
       letterSpacing: 0.5,
     },
-    copiedText: {
-      color: color.gray_min,
-      textAlign: 'center',
-      padding: 8,
-      ...atoms.body_2_md_medium,
-    },
-    isCopying: {
-      position: 'absolute',
-      backgroundColor: color.gray_max,
-      alignItems: 'center',
-      justifyContent: 'center',
-      bottom: 60,
-      alignSelf: 'center',
-      borderRadius: 4,
-      zIndex: 10,
-    },
   })
 
   const colors = {
diff --git a/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx b/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
index 794ddc1caa..2e5d8283cc 100644
--- a/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
+++ b/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {Platform, ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {useStrings} from '../common/useStrings'
@@ -40,18 +40,9 @@ export const AskConfirmation = ({address, url, code, onContinue}: Props) => {
       </ScrollView>
 
       <Actions>
-        <Button
-          title={strings.cancel}
-          onPress={closeModal}
-          withoutBackground
-          outlineShelley
-          block
-          disabled={isLoading}
-        />
-
-        <Spacer width={20} />
-
-        <Button title={strings.continue} onPress={onContinue} shelleyTheme block disabled={isLoading} />
+        <Button size="S" type={ButtonType.Secondary} title={strings.cancel} onPress={closeModal} disabled={isLoading} />
+
+        <Button size="S" title={strings.continue} onPress={onContinue} disabled={isLoading} />
       </Actions>
     </View>
   )
@@ -84,10 +75,8 @@ const useStyles = () => {
     },
     actions: {
       ...atoms.flex_row,
-      ...atoms.align_end,
       ...atoms.pb_lg,
-      minHeight: 48,
-      maxHeight: 54,
+      ...atoms.gap_lg,
     },
     item: {
       ...atoms.self_stretch,
diff --git a/apps/wallet-mobile/src/features/Exchange/common/AmountCard/AmountCard.tsx b/apps/wallet-mobile/src/features/Exchange/common/AmountCard/AmountCard.tsx
index f75cdbb42c..21fdfe9e42 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/AmountCard/AmountCard.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/AmountCard/AmountCard.tsx
@@ -19,7 +19,7 @@ type AmountCardProps = {
   inputEditable?: boolean
   touched?: boolean
   amount: Portfolio.Token.Amount
-  testId?: string
+  testID?: string
 }
 
 export const AmountCard: React.FC<AmountCardProps> = ({
@@ -31,7 +31,7 @@ export const AmountCard: React.FC<AmountCardProps> = ({
   inputEditable,
   touched,
   amount,
-  testId,
+  testID,
 }: AmountCardProps) => {
   const [isFocused, setIsFocused] = React.useState(false)
 
@@ -75,7 +75,7 @@ export const AmountCard: React.FC<AmountCardProps> = ({
               onFocus={() => setIsFocused(true)}
               onBlur={() => setIsFocused(false)}
               keyboardAppearance={isDark ? 'dark' : 'light'}
-              testID={testId}
+              testID={testID}
             />
           </Pressable>
 
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
index 695159cdbb..3e14330692 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {Dimensions, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
@@ -44,11 +44,9 @@ export const BuyBannerBig = () => {
 
         <Button
           testID="rampOnOffButton"
-          mainTheme
+          size="S"
           title={strings.buyCrypto.toLocaleUpperCase()}
           onPress={handleExchange}
-          style={styles.spaceButton}
-          textStyles={styles.spaceButtonText}
         />
       </LinearGradient>
     </View>
@@ -70,9 +68,6 @@ const useStyles = () => {
       flexDirection: 'column',
       alignItems: 'center',
     },
-    spaceButtonText: {
-      ...atoms.p_0,
-    },
     label: {
       ...atoms.heading_3_medium,
       color: color.gray_max,
@@ -84,9 +79,6 @@ const useStyles = () => {
       color: color.gray_max,
       textAlign: 'center',
     },
-    spaceButton: {
-      ...atoms.px_lg,
-    },
   })
   const colors = {
     gradientColor: color.bg_gradient_2,
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
index b80e9ebe42..a59c0d8f64 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
@@ -42,13 +42,7 @@ export const BuyBannerSmall = ({onClose}: SmallBannerProps) => {
 
           <Spacer height={8} />
 
-          <Button
-            testID="rampOnOffButton"
-            mainTheme
-            title={strings.buyCrypto.toLocaleUpperCase()}
-            onPress={handleExchange}
-            style={styles.spaceButton}
-          />
+          <Button testID="rampOnOffButton" title={strings.buyCrypto.toLocaleUpperCase()} onPress={handleExchange} />
         </LinearGradient>
       </View>
 
@@ -86,9 +80,6 @@ const useStyles = () => {
       ...atoms.body_1_lg_regular,
       color: color.gray_max,
     },
-    spaceButton: {
-      maxWidth: 100,
-    },
   })
   const colors = {
     gradientColor: color.bg_gradient_1,
diff --git a/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx b/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
index 24ef2d1ed6..6abf888e44 100644
--- a/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
@@ -6,7 +6,7 @@ import DeviceInfo from 'react-native-device-info'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {Space} from '../../../components/Space/Space'
 import {useEnableAuthWithOs} from '../../Auth/common/hooks'
 import {useStrings} from '../common'
@@ -36,9 +36,8 @@ export const ChooseBiometricLoginScreen = () => {
 
       <View>
         <Button
+          type={ButtonType.Text}
           title={strings.ignoreButton}
-          withoutBackground
-          textStyles={styles.textOutlineButton}
           onPress={() => {
             setScreenShown()
           }}
@@ -49,7 +48,6 @@ export const ChooseBiometricLoginScreen = () => {
 
         <Button
           title={strings.enableButton}
-          style={styles.enableButton}
           onPress={async () => {
             const isSimulator = await DeviceInfo.isEmulator()
             if (isSimulator) {
@@ -97,12 +95,6 @@ const useStyles = () => {
       ...atoms.text_center,
       ...atoms.px_lg,
     },
-    textOutlineButton: {
-      color: color.text_gray_max,
-    },
-    enableButton: {
-      backgroundColor: color.primary_500,
-    },
   })
 
   return {styles} as const
diff --git a/apps/wallet-mobile/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx b/apps/wallet-mobile/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx
index 8949d67b5c..94d1d4ab31 100644
--- a/apps/wallet-mobile/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx
@@ -157,15 +157,11 @@ const SelectableMedia = ({info}: {info: Portfolio.Token.Info}) => {
   )
 }
 
-const MetadataRow = ({title, copyText, children}: {title: string; children: ReactNode; copyText?: string}) => {
+const MetadataRow = ({title, children}: {title: string; children: ReactNode}) => {
   const styles = useStyles()
   return (
     <View style={styles.rowContainer}>
-      <View style={styles.rowBetween}>
-        <Text style={styles.title}>{title}</Text>
-
-        {copyText !== undefined ? <CopyButton value={copyText} /> : null}
-      </View>
+      <Text style={styles.title}>{title}</Text>
 
       <Spacer height={4} />
 
@@ -195,12 +191,12 @@ const NftOverview = ({info, explorers, traits}: NftOverviewProps) => {
         <Text style={styles.name}>{normalizeMetadataString(info.description)}</Text>
       </MetadataRow>
 
-      <MetadataRow title={strings.fingerprint} copyText={info.fingerprint}>
-        <Text style={styles.name}>{info.fingerprint}</Text>
+      <MetadataRow title={strings.fingerprint}>
+        <CopyButton title={info.fingerprint} value={info.fingerprint} />
       </MetadataRow>
 
-      <MetadataRow title={strings.policyId} copyText={policyId}>
-        <Text style={styles.name}>{policyId}</Text>
+      <MetadataRow title={strings.policyId}>
+        <CopyButton title={policyId} value={policyId} />
       </MetadataRow>
 
       {traits?.traits.map((trait) => (
@@ -272,9 +268,7 @@ const NftMetadata = ({discovery}: {discovery: Portfolio.Token.Discovery}) => {
   return (
     <View>
       <View style={styles.copyMetadata}>
-        <CopyButton value={stringifiedMetadata} style={styles.copyButton}>
-          <Text style={styles.copyText}>{strings.copyMetadata}</Text>
-        </CopyButton>
+        <CopyButton title={strings.copyMetadata} value={stringifiedMetadata} style={styles.copyButton} />
       </View>
 
       <Spacer height={14} />
@@ -307,11 +301,6 @@ const useStyles = () => {
       flex: 1,
       textDecorationLine: 'underline',
     },
-    copyText: {
-      color: color.gray_900,
-      ...atoms.body_2_md_medium,
-      textTransform: 'uppercase',
-    },
     container: {
       flex: 1,
       backgroundColor: color.bg_color_max,
diff --git a/apps/wallet-mobile/src/features/Portfolio/common/TokenAmountItem/TokenInfoIcon.tsx b/apps/wallet-mobile/src/features/Portfolio/common/TokenAmountItem/TokenInfoIcon.tsx
index 7ce268e1fe..268ca39418 100644
--- a/apps/wallet-mobile/src/features/Portfolio/common/TokenAmountItem/TokenInfoIcon.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/common/TokenAmountItem/TokenInfoIcon.tsx
@@ -62,7 +62,7 @@ const PrimaryIcon = ({size = 'md', imageStyle}: {size?: 'sm' | 'md'; imageStyle?
   const {styles} = useStyles()
   return (
     <View style={[size === 'sm' ? styles.iconSmall : styles.iconMedium, styles.primary, imageStyle]}>
-      <Icon.Cardano color="white" height={size === 'sm' ? 20 : 35} width={size === 'sm' ? 20 : 35} />
+      <Icon.Cardano color="white" size={size === 'sm' ? 20 : 35} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
index c15e0ec7df..2585bfb593 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../../components/Button/Button'
+import {Button} from '../../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useNavigateTo} from '../../../../common/hooks/useNavigateTo'
 import {useStrings} from '../../../../common/hooks/useStrings'
@@ -29,13 +29,7 @@ export const BuyADABanner = () => {
 
         <Spacer height={16} />
 
-        <Button
-          mainTheme
-          title={strings.buyCrypto.toLocaleUpperCase()}
-          onPress={handleExchange}
-          style={styles.spaceButton}
-          textStyles={styles.spaceButtonText}
-        />
+        <Button title={strings.buyCrypto.toLocaleUpperCase()} onPress={handleExchange} />
 
         <View style={styles.assetImageBox}>
           <AssetImage />
@@ -57,13 +51,6 @@ const useStyles = () => {
       ...atoms.overflow_hidden,
       backgroundColor: color.bg_color_max,
     },
-    spaceButtonText: {
-      ...atoms.p_0,
-    },
-    spaceButton: {
-      ...atoms.px_lg,
-      minHeight: 40,
-    },
     title: {
       ...atoms.body_1_lg_medium,
       ...atoms.font_semibold,
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
index 534c33c636..c08676a8da 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {useNavigateTo} from '../../../common/hooks/useNavigateTo'
 import {useStrings} from '../../../common/hooks/useStrings'
 import {TradeTokensAsset} from './TradeTokensAsset'
@@ -22,13 +22,7 @@ export const TradeTokensBanner = () => {
       <LinearGradient style={styles.gradientRoot} colors={colors.gradientColor} start={{x: 0, y: 0}} end={{x: 1, y: 0}}>
         <Text style={styles.title}>{strings.tradeTokens}</Text>
 
-        <Button
-          mainTheme
-          title={strings.swap.toLocaleUpperCase()}
-          style={styles.spaceButton}
-          textStyles={styles.spaceButtonText}
-          onPress={handleSwap}
-        />
+        <Button title={strings.swap} onPress={handleSwap} />
 
         <View style={styles.assetBox}>
           <TradeTokensAsset />
@@ -56,13 +50,6 @@ const useStyles = () => {
       ...atoms.overflow_hidden,
       backgroundColor: color.bg_color_max,
     },
-    spaceButtonText: {
-      ...atoms.p_0,
-    },
-    spaceButton: {
-      ...atoms.px_lg,
-      minHeight: 40,
-    },
     title: {
       ...atoms.body_1_lg_medium,
       ...atoms.font_semibold,
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
index bba9c7d567..31659013af 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
@@ -5,7 +5,7 @@ import {Chain, Portfolio} from '@yoroi/types'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {useSwapForm} from '../../../Swap/common/SwapFormProvider'
@@ -18,7 +18,7 @@ type Props = {
   tokenInfo: Portfolio.Token.Info
 }
 export const Actions = ({tokenInfo}: Props) => {
-  const {styles, colors} = useStyles()
+  const {styles} = useStyles()
   const strings = useStrings()
   const navigateTo = useNavigateTo()
   const swap = useSwap()
@@ -58,22 +58,9 @@ export const Actions = ({tokenInfo}: Props) => {
   return (
     <View style={styles.root}>
       <View style={styles.container}>
-        <Button
-          block
-          shelleyTheme
-          outlineOnLight
-          title={strings.send.toLocaleUpperCase()}
-          startContent={<Icon.Send color={colors.primary} size={24} />}
-          onPress={navigateTo.send}
-        />
+        <Button type={ButtonType.Secondary} title={strings.send} icon={Icon.Send} onPress={navigateTo.send} />
 
-        <Button
-          block
-          shelleyTheme
-          title={strings.swap.toLocaleUpperCase()}
-          startContent={<Icon.Swap color={colors.white} size={24} />}
-          onPress={handleOnSwap}
-        />
+        <Button title={strings.swap} icon={Icon.Swap} onPress={handleOnSwap} />
       </View>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/PortfolioTokenInfo/Overview/Overview.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/PortfolioTokenInfo/Overview/Overview.tsx
index 68a2abf123..a2ef824e88 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/PortfolioTokenInfo/Overview/Overview.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/PortfolioTokenInfo/Overview/Overview.tsx
@@ -70,9 +70,7 @@ export const Overview = () => {
 
               <Spacer height={4} />
 
-              <CopyButton value={policyId ?? ''} style={styles.copyButton}>
-                <Text style={styles.copyText}>{policyId ?? '--'}</Text>
-              </CopyButton>
+              <CopyButton title={policyId ?? '--'} value={policyId ?? ''} style={styles.copyButton} />
             </View>
 
             <Spacer height={24} />
@@ -82,9 +80,11 @@ export const Overview = () => {
 
               <Spacer height={4} />
 
-              <CopyButton value={tokenInfo.info?.fingerprint ?? ''} style={styles.copyButton}>
-                <Text style={styles.copyText}>{tokenInfo.info?.fingerprint ?? '--'}</Text>
-              </CopyButton>
+              <CopyButton
+                title={tokenInfo.info?.fingerprint ?? '--'}
+                value={tokenInfo.info?.fingerprint ?? ''}
+                style={styles.copyButton}
+              />
             </View>
 
             <Spacer height={24} />
@@ -172,11 +172,6 @@ const useStyles = () => {
       ...atoms.align_start,
       ...atoms.gap_sm,
     },
-    copyText: {
-      ...atoms.flex_1,
-      ...atoms.body_2_md_regular,
-      color: color.gray_600,
-    },
   })
 
   const colors = {
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
index 14c9550fdb..55180314ed 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {TxHistoryRouteNavigation} from '../../../../../kernel/navigation'
 import {useStrings} from '../../../common/hooks/useStrings'
@@ -30,13 +30,7 @@ export const TradeTokensBannerBig = () => {
 
         <Spacer height={37} />
 
-        <Button
-          mainTheme
-          title={strings.startSwapping.toLocaleUpperCase()}
-          style={styles.spaceButton}
-          textStyles={styles.spaceButtonText}
-          onPress={handleSwap}
-        />
+        <Button title={strings.startSwapping} onPress={handleSwap} />
 
         <View style={styles.assetBox}>
           <TradeTokensAsset />
@@ -63,13 +57,6 @@ const useStyles = () => {
       ...atoms.overflow_hidden,
       backgroundColor: color.bg_color_max,
     },
-    spaceButtonText: {
-      ...atoms.p_0,
-    },
-    spaceButton: {
-      ...atoms.px_lg,
-      minHeight: 40,
-    },
     title: {
       ...atoms.body_1_lg_medium,
       ...atoms.font_semibold,
diff --git a/apps/wallet-mobile/src/features/Receive/common/AddressDetailCard/AddressDetailCard.tsx b/apps/wallet-mobile/src/features/Receive/common/AddressDetailCard/AddressDetailCard.tsx
index ba119d52eb..9e8e0d7b30 100644
--- a/apps/wallet-mobile/src/features/Receive/common/AddressDetailCard/AddressDetailCard.tsx
+++ b/apps/wallet-mobile/src/features/Receive/common/AddressDetailCard/AddressDetailCard.tsx
@@ -3,9 +3,9 @@ import * as React from 'react'
 import {StyleSheet, useWindowDimensions, View} from 'react-native'
 import Animated, {Layout} from 'react-native-reanimated'
 
+import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {ShareQRCodeCard} from '../../../../components/ShareQRCodeCard/ShareQRCodeCard'
 import {Spacer} from '../../../../components/Spacer/Spacer'
-import {useCopy} from '../../../../hooks/useCopy'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {isEmptyString} from '../../../../kernel/utils'
 import {useKeyHashes} from '../../../../yoroi-wallets/hooks'
@@ -34,7 +34,7 @@ type CardItem = {
 
 export const AddressDetailCard = ({title}: AddressDetailCardProps) => {
   const {styles, colors} = useStyles()
-  const [isCopying, copy] = useCopy()
+  const {copy} = useCopy()
   const {track} = useMetrics()
   const strings = useStrings()
 
@@ -76,12 +76,10 @@ export const AddressDetailCard = ({title}: AddressDetailCardProps) => {
             title={item.title}
             qrContent={item.address}
             shareContent={`${strings.address} ${item.address}`}
-            onLongPress={() => copy(item.address)}
-            isCopying={isCopying}
-            testId="receive:address-detail-card"
+            onLongPress={(event) => copy({text: item.address, feedback: strings.addressCopiedMsg, event})}
+            testID="receive:address-detail-card"
             onShare={() => track.receiveShareAddressClicked()}
             shareLabel={strings.shareLabel}
-            copiedText={strings.addressCopiedMsg}
           />
         )
       case 'Details':
diff --git a/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx b/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
index ac225d2d06..bfe639c373 100644
--- a/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
+++ b/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
@@ -3,7 +3,7 @@ import {Wallet} from '@yoroi/types'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useAddressMode} from '../../../WalletManager/common/hooks/useAddressMode'
@@ -55,14 +55,9 @@ export const SingleOrMultipleAddressesModal = ({onConfirm}: Props) => {
       <Spacer fill height={16} />
 
       <View style={styles.actions}>
-        <Button
-          withoutBackground
-          textStyles={styles.multipleButtonTitle}
-          title={strings.selectMultiple}
-          onPress={handleOnMultiple}
-        />
-
-        <Button shelleyTheme title={strings.singleAddressWallet} onPress={handleOnSingle} />
+        <Button type={ButtonType.Text} title={strings.selectMultiple} onPress={handleOnMultiple} />
+
+        <Button title={strings.singleAddressWallet} onPress={handleOnSingle} />
       </View>
     </View>
   )
@@ -80,7 +75,10 @@ const useStyles = () => {
       ...atoms.py_lg,
     },
     actions: {
-      ...atoms.self_stretch,
+      ...atoms.flex_col,
+      ...atoms.gap_sm,
+      ...atoms.w_full,
+      height: 120,
     },
     details: {
       color: color.text_gray_medium,
@@ -88,9 +86,6 @@ const useStyles = () => {
       ...atoms.justify_center,
       ...atoms.text_center,
     },
-    multipleButtonTitle: {
-      color: color.text_primary_max,
-    },
   })
 
   return {styles} as const
diff --git a/apps/wallet-mobile/src/features/Receive/common/SmallAddressCard/SmallAddressCard.tsx b/apps/wallet-mobile/src/features/Receive/common/SmallAddressCard/SmallAddressCard.tsx
index 494122469c..90024126e7 100644
--- a/apps/wallet-mobile/src/features/Receive/common/SmallAddressCard/SmallAddressCard.tsx
+++ b/apps/wallet-mobile/src/features/Receive/common/SmallAddressCard/SmallAddressCard.tsx
@@ -2,10 +2,10 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
-import Animated, {FadeInDown, FadeInUp, FadeOut, FadeOutDown, Layout} from 'react-native-reanimated'
+import Animated, {FadeInUp, FadeOut, Layout} from 'react-native-reanimated'
 
+import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {Spacer} from '../../../../components/Spacer/Spacer'
-import {useCopy} from '../../../../hooks/useCopy'
 import {SkeletonSmallCardAddress} from '../SkeletonAddressDetail/SkeletonAddressDetail'
 import {useStrings} from '../useStrings'
 
@@ -15,12 +15,12 @@ type SmallAddressCardProps = {
   loading?: boolean
   date?: string
   onPress?: () => void
-  testId?: string
+  testID?: string
 }
 
-export const SmallAddressCard = ({address, isUsed, date, onPress, loading, testId}: SmallAddressCardProps) => {
+export const SmallAddressCard = ({address, isUsed, date, onPress, loading, testID}: SmallAddressCardProps) => {
   const strings = useStrings()
-  const [isCopying, copy] = useCopy()
+  const {copy} = useCopy()
   const {styles, colors} = useStyles()
 
   if (loading) {
@@ -39,9 +39,9 @@ export const SmallAddressCard = ({address, isUsed, date, onPress, loading, testI
         <TouchableOpacity
           style={styles.smallAddressCard}
           activeOpacity={0.6}
-          onLongPress={() => copy(address)}
+          onLongPress={(event) => copy({text: address, feedback: strings.addressCopiedMsg, event})}
           onPress={onPress}
-          testID={testId}
+          testID={testID}
         >
           <LinearGradient
             style={[StyleSheet.absoluteFill, {opacity: 1}]}
@@ -67,12 +67,6 @@ export const SmallAddressCard = ({address, isUsed, date, onPress, loading, testI
       </Animated.View>
 
       <Spacer height={16} />
-
-      {isCopying && (
-        <Animated.View layout={Layout} entering={FadeInDown} exiting={FadeOutDown} style={styles.isCopying}>
-          <Text style={styles.copiedText}>{strings.addressCopiedMsg}</Text>
-        </Animated.View>
-      )}
     </>
   )
 }
@@ -131,22 +125,6 @@ const useStyles = () => {
       ...atoms.body_2_md_regular,
       color: color.gray_700,
     },
-    copiedText: {
-      color: color.gray_min,
-      textAlign: 'center',
-      padding: 8,
-      ...atoms.body_2_md_medium,
-    },
-    isCopying: {
-      position: 'absolute',
-      backgroundColor: color.gray_max,
-      alignItems: 'center',
-      justifyContent: 'center',
-      top: 0,
-      alignSelf: 'center',
-      borderRadius: 4,
-      zIndex: 10,
-    },
   })
 
   const colors = {
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
index cce408cb1a..59c4e37336 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
@@ -2,13 +2,13 @@ import {useFocusEffect} from '@react-navigation/native'
 import {useTheme} from '@yoroi/theme'
 import {Wallet} from '@yoroi/types'
 import * as React from 'react'
-import {ScrollView, StyleSheet, View} from 'react-native'
+import {GestureResponderEvent, ScrollView, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import Icon from '../../../assets/img/copy.png'
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
+import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
-import {useCopy} from '../../../hooks/useCopy'
 import {useMetrics} from '../../../kernel/metrics/metricsManager'
 import {isEmptyString} from '../../../kernel/utils'
 import {useAddressMode} from '../../WalletManager/common/hooks/useAddressMode'
@@ -26,7 +26,7 @@ import {useStrings} from '../common/useStrings'
 
 export const DescribeSelectedAddressScreen = () => {
   const strings = useStrings()
-  const {styles, colors} = useStyles()
+  const {styles} = useStyles()
   const navigateTo = useNavigateTo()
   const {selectedAddress} = useReceive()
   const {isSingle, addressMode} = useAddressMode()
@@ -37,12 +37,12 @@ export const DescribeSelectedAddressScreen = () => {
 
   const {track} = useMetrics()
 
-  const [isCopying, copy] = useCopy()
+  const {copy} = useCopy()
   const hasAddress = !isEmptyString(selectedAddress)
 
-  const handleOnPressCopy = () => {
+  const onCopy = (event: GestureResponderEvent) => {
     track.receiveCopyAddressClicked({copy_address_location: 'CTA Copy Address'})
-    copy(selectedAddress)
+    copy({text: selectedAddress, feedback: strings.addressCopiedMsg, event})
   }
 
   const handleOnModalConfirm = React.useCallback(
@@ -83,26 +83,17 @@ export const DescribeSelectedAddressScreen = () => {
         </View>
       </ScrollView>
 
-      <Button
-        withoutBackground
-        title={strings.requestSpecificAmountButton}
-        textStyles={{
-          color: colors.requestSpecificAmountTextColor,
-        }}
-        onPress={navigateTo.requestSpecificAmount}
-        disabled={!hasAddress}
-        testID="receive:request-specific-amount-link"
-      />
+      <View style={styles.actions}>
+        <Button
+          type={ButtonType.Text}
+          title={strings.requestSpecificAmountButton}
+          onPress={navigateTo.requestSpecificAmount}
+          disabled={!hasAddress}
+          testID="receive:request-specific-amount-link"
+        />
 
-      <Button
-        shelleyTheme
-        onPress={handleOnPressCopy}
-        disabled={!hasAddress}
-        title={strings.copyAddressButton}
-        iconImage={Icon}
-        isCopying={isCopying}
-        copiedText={strings.addressCopiedMsg}
-      />
+        <Button onPress={onCopy} disabled={!hasAddress} title={strings.copyAddressButton} icon={Icon.Copy} />
+      </View>
     </SafeAreaView>
   )
 }
@@ -121,6 +112,10 @@ const useStyles = () => {
     address: {
       ...atoms.align_center,
     },
+    actions: {
+      ...atoms.flex_col,
+      ...atoms.gap_sm,
+    },
   })
 
   const colors = {
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
index 51d1c359a3..6c57f40d3d 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
@@ -59,7 +59,7 @@ export const ListMultipleAddressesScreen = () => {
           selectedAddressChanged(item.address)
           navigate.showAddressDetails()
         }}
-        testId={`receive:small-address-card-${index + 1}`} // Add index + 1 to include count
+        testID={`receive:small-address-card-${index + 1}`} // Add index + 1 to include count
         // date={}  // TODO define with project
       />
     ),
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
index 87cf8f3fc2..a1685b8676 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
@@ -2,16 +2,24 @@ import {useFocusEffect} from '@react-navigation/native'
 import {configCardanoLegacyTransfer, linksCardanoModuleMaker} from '@yoroi/links'
 import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
-import {ScrollView as RNScrollView, StyleSheet, Text, useWindowDimensions, View} from 'react-native'
+import {
+  GestureResponderEvent,
+  ScrollView as RNScrollView,
+  StyleSheet,
+  Text,
+  useWindowDimensions,
+  View,
+} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
+import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
+import {Icon} from '../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {ScrollView, useScrollView} from '../../../components/ScrollView/ScrollView'
 import {ShareQRCodeCard} from '../../../components/ShareQRCodeCard/ShareQRCodeCard'
 import {TextInput} from '../../../components/TextInput/TextInput'
-import {useCopy} from '../../../hooks/useCopy'
 import {useMetrics} from '../../../kernel/metrics/metricsManager'
 import {isEmptyString} from '../../../kernel/utils'
 import {editedFormatter} from '../../../yoroi-wallets/utils/amountUtils'
@@ -81,7 +89,6 @@ export const RequestSpecificAmountScreen = () => {
 
         <View style={[styles.actions, isScrollBarShown && {borderTopWidth: 1, borderTopColor: colors.lightGray}]}>
           <Button
-            shelleyTheme
             onPress={handleOnGenerateLink}
             disabled={!hasAmount}
             title={strings.generateLink}
@@ -115,8 +122,7 @@ const Modal = ({amount, address}: {amount: string; address: string}) => {
   const content = hasAmount ? requestData.link : address
   const title = hasAmount ? `${amount} ${portfolioPrimaryTokenInfo.ticker.toLocaleUpperCase()}` : ''
 
-  const [isCopying, copy] = useCopy()
-  const handOnCopy = () => copy(content)
+  const {copy} = useCopy()
 
   return (
     <View style={[styles.container, styles.flex]}>
@@ -126,11 +132,12 @@ const Modal = ({amount, address}: {amount: string; address: string}) => {
             title={title}
             shareContent={`${strings.address} ${content}`}
             qrContent={content}
-            onLongPress={handOnCopy}
-            testId="receive:specific-amount"
+            onLongPress={(event: GestureResponderEvent) =>
+              copy({text: content, feedback: strings.addressCopiedMsg, event})
+            }
+            testID="receive:specific-amount"
             onShare={() => track.receiveShareAddressClicked()}
             shareLabel={strings.shareLabel}
-            copiedText={strings.addressCopiedMsg}
           />
         ) : (
           <View style={styles.root}>
@@ -141,13 +148,10 @@ const Modal = ({amount, address}: {amount: string; address: string}) => {
 
       <View style={styles.actions}>
         <Button
-          shelleyTheme
-          onPress={handOnCopy}
+          onPress={(event: GestureResponderEvent) => copy({text: content, feedback: strings.copyLinkMsg, event})}
           disabled={!hasAmount}
           title={strings.copyLinkBtn}
-          iconImage={require('../../../assets/img/copy.png')}
-          isCopying={isCopying}
-          copiedText={strings.copyLinkMsg}
+          icon={Icon.Copy}
           testID="receive:request-specific-amount:copy-link-button"
         />
       </View>
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
index 09530bc45b..0f0b7529f2 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
@@ -6,10 +6,10 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Button} from '../../../../components/Button/Button'
 import {Checkbox} from '../../../../components/Checkbox/Checkbox'
+import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {ShareQRCodeCard} from '../../../../components/ShareQRCodeCard/ShareQRCodeCard'
 import {Space} from '../../../../components/Space/Space'
 import {useAllowScreenshot} from '../../../../hooks/useAllowScreenShot'
-import {useCopy} from '../../../../hooks/useCopy'
 import {useBlockGoBack} from '../../../../kernel/navigation'
 import {useNavigateTo} from '../../CatalystNavigator'
 import {Actions, Description} from '../../common/components'
@@ -26,8 +26,7 @@ export const QrCode = () => {
 
   if (votingKeyEncrypted === null) throw new Error('votingKeyEncrypted cannot be null')
 
-  const [isCopying, copy] = useCopy()
-  const handleOnCopy = () => copy(votingKeyEncrypted)
+  const {copy, isCopying} = useCopy()
 
   const onNext = () => {
     navigateTo.txHistory()
@@ -44,9 +43,8 @@ export const QrCode = () => {
           title={strings.step4QrTitle}
           qrContent={votingKeyEncrypted}
           shareContent={votingKeyEncrypted}
-          onLongPress={handleOnCopy}
+          onLongPress={(event) => copy({text: votingKeyEncrypted, feedback: strings.step4QrCopiedText, event})}
           shareLabel={strings.step4QrShareLabel}
-          copiedText={strings.step4QrCopiedText}
         />
 
         <Space height="lg" />
diff --git a/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx b/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
index fff982f18a..74becaa8fd 100644
--- a/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
+++ b/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
@@ -146,8 +146,8 @@ export const SettingsScreenNavigator = () => {
           options={{
             title: strings.networkTitle,
             headerRight: () => (
-              <TouchableOpacity onPress={handleOpenModal} activeOpacity={0.5}>
-                <Icon.Info size={24} color={color.gray_900} style={{...atoms.px_lg}} />
+              <TouchableOpacity onPress={handleOpenModal} activeOpacity={0.5} style={{...atoms.px_lg}}>
+                <Icon.Info size={24} color={color.gray_900} />
               </TouchableOpacity>
             ),
           }}
diff --git a/apps/wallet-mobile/src/features/SetupWallet/common/ButtonCard/ButtonCard.tsx b/apps/wallet-mobile/src/features/SetupWallet/common/ButtonCard/ButtonCard.tsx
index a6d46cb892..729ddda6b3 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/common/ButtonCard/ButtonCard.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/common/ButtonCard/ButtonCard.tsx
@@ -10,10 +10,10 @@ type ButtonCardProps = {
   subTitle?: string
   icon?: React.ReactNode
   onPress: () => void
-  testId?: string
+  testID?: string
 }
 
-export const ButtonCard = ({title, subTitle, icon = null, onPress, testId}: ButtonCardProps) => {
+export const ButtonCard = ({title, subTitle, icon = null, onPress, testID}: ButtonCardProps) => {
   const {styles, colors} = useStyles()
 
   return (
@@ -21,7 +21,7 @@ export const ButtonCard = ({title, subTitle, icon = null, onPress, testId}: Butt
       activeOpacity={0.5}
       style={[styles.container, icon !== null && styles.justifySpaceBetween]}
       onPress={onPress}
-      testID={testId}
+      testID={testID}
     >
       <LinearGradient
         style={[StyleSheet.absoluteFill, {opacity: 1}]}
diff --git a/apps/wallet-mobile/src/features/SetupWallet/common/CardAboutPhrase/CardAboutPhrase.tsx b/apps/wallet-mobile/src/features/SetupWallet/common/CardAboutPhrase/CardAboutPhrase.tsx
index 3baaa8f652..11c549c83c 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/common/CardAboutPhrase/CardAboutPhrase.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/common/CardAboutPhrase/CardAboutPhrase.tsx
@@ -15,7 +15,7 @@ type CardAboutPhraseProps = {
   includeSpacing?: boolean
   checksumImage?: string
   checksumLine?: number
-  testId?: string
+  testID?: string
 }
 
 export const CardAboutPhrase = ({
@@ -25,7 +25,7 @@ export const CardAboutPhrase = ({
   includeSpacing,
   checksumImage,
   checksumLine,
-  testId,
+  testID,
 }: CardAboutPhraseProps) => {
   const {styles, colors} = useStyles(includeSpacing, showBackgroundColor)
   const strings = useStrings()
@@ -43,7 +43,7 @@ export const CardAboutPhrase = ({
 
       {title !== undefined && (
         <>
-          <Text style={styles.title} testID={testId}>
+          <Text style={styles.title} testID={testID}>
             {title}
           </Text>
 
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseMnemonicType/ChooseMnemonicTypeScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseMnemonicType/ChooseMnemonicTypeScreen.tsx
index 2b17322623..f9875cc5d9 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseMnemonicType/ChooseMnemonicTypeScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseMnemonicType/ChooseMnemonicTypeScreen.tsx
@@ -51,7 +51,7 @@ export const ChooseMnemonicTypeScreen = () => {
           title={strings.choose15WordsMnemonicTitle}
           icon={<Mnemonic15Words style={styles.icon} />}
           onPress={handle15Words}
-          testId="mnemonic-15-word"
+          testID="mnemonic-15-word"
         />
 
         <Space height="lg" />
@@ -60,7 +60,7 @@ export const ChooseMnemonicTypeScreen = () => {
           title={strings.choose24WordsMnemonicTitle}
           icon={<Mnemonic24Words style={styles.icon} />}
           onPress={handle24Words}
-          testId="mnemonic-24-word"
+          testID="mnemonic-24-word"
         />
 
         <Space height="lg" />
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseSetupType/ChooseSetupTypeScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseSetupType/ChooseSetupTypeScreen.tsx
index d9292ce4d2..60b452dc10 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseSetupType/ChooseSetupTypeScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/ChooseSetupType/ChooseSetupTypeScreen.tsx
@@ -64,7 +64,7 @@ export const ChooseSetupTypeScreen = () => {
             title={strings.createWalletButtonCard}
             icon={<CreateWallet style={styles.icon} />}
             onPress={handleCreate}
-            testId="setup-create-new-wallet-button"
+            testID="setup-create-new-wallet-button"
           />
 
           <Space height="lg" />
@@ -73,7 +73,7 @@ export const ChooseSetupTypeScreen = () => {
             title={strings.restoreWalletButtonCard}
             icon={<RestoreWallet style={styles.icon} />}
             onPress={handleRestore}
-            testId="setup-restore-wallet-button"
+            testID="setup-restore-wallet-button"
           />
 
           <Space height="lg" />
@@ -82,7 +82,7 @@ export const ChooseSetupTypeScreen = () => {
             title={strings.connectWalletButtonCard}
             icon={<HardwareWallet style={styles.icon} />}
             onPress={handleHw}
-            testId="setup-connect-HW-wallet-button"
+            testID="setup-connect-HW-wallet-button"
           />
 
           <Space height="lg" />
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
index 8baaf54c2b..925b538c59 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
@@ -72,7 +72,7 @@ export const RecoveryPhraseScreen = () => {
             closeModal()
             showCreateWalletInfoModalChanged(false)
           }}
-          testId="setup-step2-continue-button"
+          testID="setup-step2-continue-button"
         />
 
         <Space height="_2xl" />
@@ -107,7 +107,7 @@ export const RecoveryPhraseScreen = () => {
         <Text style={styles.title}>
           {strings.recoveryPhraseTitle(bold)}
 
-          <Info onPress={handleOnShowModal} testId="step2-info-icon" />
+          <Info onPress={handleOnShowModal} testID="step2-info-icon" />
         </Text>
 
         <View style={styles.mnemonicWords}>
@@ -154,7 +154,7 @@ export const RecoveryPhraseScreen = () => {
           mnemonicChanged(mnemonic)
           navigation.navigate('setup-wallet-verify-recovery-phrase-mnemonic')
         }}
-        testId="setup-step2-next-button"
+        testID="setup-step2-next-button"
       />
 
       <Space height="lg" />
@@ -162,12 +162,12 @@ export const RecoveryPhraseScreen = () => {
   )
 }
 
-const Info = ({onPress, testId}: {onPress: () => void; testId?: string}) => {
+const Info = ({onPress, testID}: {onPress: () => void; testID?: string}) => {
   const {styles} = useStyles()
   const {color, isDark} = useTheme()
   return (
     <TouchableOpacity style={styles.info} onPress={onPress}>
-      <View style={styles.infoIcon} testID={testId}>
+      <View style={styles.infoIcon} testID={testID}>
         <InfoIcon size={24} color={isDark ? color.white_static : color.black_static} />
       </View>
     </TouchableOpacity>
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
index a69a998320..9145c16278 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
@@ -111,7 +111,7 @@ export const VerifyRecoveryPhraseScreen = () => {
 
             navigation.navigate('setup-wallet-details-form')
           }}
-          testId="setup-next-button"
+          testID="setup-next-button"
         />
       </View>
     </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
index eac247960a..ace46d79d1 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
@@ -190,7 +190,7 @@ export const WalletDetailsScreen = () => {
               closeModal()
               showRestoreWalletInfoModalChanged(false)
             }}
-            testId="setup-modal-continue-button"
+            testID="setup-modal-continue-button"
           />
         </View>
       </View>,
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
index 8b36ebe587..f0214c8305 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
@@ -246,7 +246,7 @@ export const SaveNanoXScreen = () => {
             shelleyTheme
             title={strings.next}
             onPress={handleOnSubmit}
-            testId="setup-restore-step2-next-button"
+            testID="setup-restore-step2-next-button"
             disabled={disabled}
           />
         </View>
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
index c07d935055..adbe3e057a 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {Alert, Platform, StyleSheet, Text, View} from 'react-native'
 import DeviceInfo from 'react-native-device-info'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {Space} from '../../../../components/Space/Space'
 import {SetupWalletRouteNavigation} from '../../../../kernel/navigation'
@@ -39,7 +39,6 @@ export const SelectHwConnectionModal = () => {
 }
 
 const SelectBluetoothSection = () => {
-  const {styles, colors} = useStyles()
   const strings = useStrings()
   const {useUSBChanged: USBChanged, walletImplementationChanged, setupTypeChanged} = useSetupWallet()
   const navigation = useNavigation<SetupWalletRouteNavigation>()
@@ -64,11 +63,9 @@ const SelectBluetoothSection = () => {
       <Space height="xl" />
 
       <Button
-        iconImage={<Icon.Bluetooth color={colors.blue} />}
-        textStyles={styles.buttonText}
+        type={ButtonType.Secondary}
         title={strings.hwModalBtButton}
-        outlineOnLight
-        shelleyTheme
+        icon={Icon.Bluetooth}
         onPress={() => request()}
       />
     </>
@@ -76,7 +73,7 @@ const SelectBluetoothSection = () => {
 }
 
 const SelectUsbSection = () => {
-  const {styles, colors} = useStyles()
+  const {styles} = useStyles()
   const strings = useStrings()
   const isAndroidUsbSupported = useIsAndroidUsbSupported()
   const {useUSBChanged: USBChanged, walletImplementationChanged, setupTypeChanged} = useSetupWallet()
@@ -106,11 +103,9 @@ const SelectUsbSection = () => {
       <Space height="xl" />
 
       <Button
-        iconImage={<Icon.Usb color={colors.blue} />}
-        textStyles={styles.buttonText}
+        type={ButtonType.Secondary}
         title={strings.hwModalUsbButton}
-        outlineOnLight
-        shelleyTheme
+        icon={Icon.Usb}
         onPress={() => {
           USBChanged(true)
           navigateHw()
@@ -131,9 +126,6 @@ const useStyles = () => {
       ...atoms.body_1_lg_regular,
       color: color.text_gray_medium,
     },
-    buttonText: {
-      ...atoms.py_lg,
-    },
     iosWarning: {
       color: color.text_gray_low,
       ...atoms.body_2_md_regular,
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/MnemonicInput/MnemonicInput.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/MnemonicInput/MnemonicInput.tsx
index 5af388f3db..42c1b0fa4b 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/MnemonicInput/MnemonicInput.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/MnemonicInput/MnemonicInput.tsx
@@ -92,7 +92,7 @@ export const MnemonicInput = ({
             mnenonicRefs.forEach((ref) => ref.current?.selectWord(''))
             mnenonicRefs[0].current?.focus()
           }}
-          testId="clearAll-button"
+          testID="clearAll-button"
         />
       )}
 
@@ -101,11 +101,11 @@ export const MnemonicInput = ({
   )
 }
 
-const ClearAllButton = ({onPress, testId}: {onPress: () => void; testId?: string}) => {
+const ClearAllButton = ({onPress, testID}: {onPress: () => void; testID?: string}) => {
   const {styles} = useStyles()
   const strings = useStrings()
   return (
-    <View style={styles.textView} testID={testId}>
+    <View style={styles.textView} testID={testID}>
       <TouchableOpacity activeOpacity={0.5} onPress={onPress}>
         <Text style={styles.clearAll}>{strings.clearAll}</Text>
       </TouchableOpacity>
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
index 574750d05e..7a07887f4c 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
@@ -308,7 +308,7 @@ export const RestoreWalletDetailsScreen = () => {
                 accountVisual,
               })
             }
-            testId="setup-restore-step2-next-button"
+            testID="setup-restore-step2-next-button"
             disabled={disabled}
           />
         </View>
diff --git a/apps/wallet-mobile/src/features/Swap/common/AmountCard/AmountCard.tsx b/apps/wallet-mobile/src/features/Swap/common/AmountCard/AmountCard.tsx
index b260b05ce3..8a47a508cb 100644
--- a/apps/wallet-mobile/src/features/Swap/common/AmountCard/AmountCard.tsx
+++ b/apps/wallet-mobile/src/features/Swap/common/AmountCard/AmountCard.tsx
@@ -23,7 +23,7 @@ type Props = {
   inputRef?: React.RefObject<TextInput>
   inputEditable?: boolean
   error?: string
-  testId?: string
+  testID?: string
 }
 
 export const AmountCard = ({
@@ -36,7 +36,7 @@ export const AmountCard = ({
   inputRef,
   inputEditable = true,
   error,
-  testId,
+  testID,
 }: Props) => {
   const [isFocused, setIsFocused] = React.useState(false)
   const strings = useStrings()
@@ -63,7 +63,7 @@ export const AmountCard = ({
           <Pressable
             style={styles.amountWrapper}
             onPress={() => (!info ? navigateTo?.() : focusInput())}
-            testID={`${testId}-token-input`}
+            testID={`${testID}-token-input`}
           >
             <TextInput
               keyboardType="numeric"
@@ -81,7 +81,7 @@ export const AmountCard = ({
               selectTextOnFocus
               onFocus={() => setIsFocused(true)}
               onBlur={() => setIsFocused(false)}
-              testID={`${testId}-amount-input`}
+              testID={`${testID}-amount-input`}
               keyboardAppearance={isDark ? 'dark' : 'light'} // ios feature
               {...(!info && {onPressIn: navigateTo})}
             />
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditBuyAmount/EditBuyAmount.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditBuyAmount/EditBuyAmount.tsx
index 2e13184692..785ed21a2b 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditBuyAmount/EditBuyAmount.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditBuyAmount/EditBuyAmount.tsx
@@ -39,7 +39,7 @@ export const EditBuyAmount = () => {
       touched={isBuyTouched}
       inputRef={buyInputRef}
       error={buyError}
-      testId="swap:buy-edit"
+      testID="swap:buy-edit"
     />
   )
 }
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSellAmount/EditSellAmount.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSellAmount/EditSellAmount.tsx
index 93d8f5eea4..2396fe899b 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSellAmount/EditSellAmount.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSellAmount/EditSellAmount.tsx
@@ -32,7 +32,7 @@ export const EditSellAmount = () => {
       touched={isSellTouched}
       inputRef={sellInputRef}
       error={error}
-      testId="swap:sell-edit"
+      testID="swap:sell-edit"
     />
   )
 }
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
index 44c65b02b9..efd89f267c 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
@@ -10,7 +10,7 @@ import React, {useRef} from 'react'
 import {useIntl} from 'react-intl'
 import {ActivityIndicator, Alert, Linking, StyleSheet, TouchableOpacity, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../../components/Button/NewButton'
 import {
   ExpandableInfoCard,
   ExpandableInfoCardSkeleton,
@@ -661,19 +661,11 @@ const ModalContentButtons = ({onBack, onConfirm}: {onBack: () => void; onConfirm
   const {styles} = useStyles()
   return (
     <View style={styles.buttons}>
-      <Button
-        title={strings.listOrdersSheetBack}
-        style={{backgroundColor: 'transparent'}}
-        onPress={onBack}
-        block
-        withoutBackground
-        outlineShelley
-        shelleyTheme
-      />
+      <Button type={ButtonType.Secondary} title={strings.listOrdersSheetBack} onPress={onBack} />
 
       <Spacer width={20} />
 
-      <Button title={strings.listOrdersSheetConfirm} onPress={onConfirm} warningTheme block />
+      <Button type={ButtonType.Critical} title={strings.listOrdersSheetConfirm} onPress={onConfirm} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/AddressModal/AddressModal.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/AddressModal/AddressModal.tsx
index c6c0152a7c..ce28adfb12 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/AddressModal/AddressModal.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/AddressModal/AddressModal.tsx
@@ -44,13 +44,7 @@ export const AddressModal = ({address, path}: Props) => {
       <View style={styles.info}>
         <Text style={styles.subtitle}>{strings.walletAddress}</Text>
 
-        <View style={styles.row}>
-          <Text style={styles.address}>{address}</Text>
-
-          <Spacer width={16} />
-
-          <CopyButton value={address} />
-        </View>
+        <CopyButton title={address} value={address} />
 
         <Spacer width={8} />
 
@@ -68,25 +62,19 @@ export const AddressModal = ({address, path}: Props) => {
 
         <Text style={styles.subtitle}>{strings.staking}</Text>
 
-        <View style={styles.row}>
-          <Text style={styles.address}>{keyHashes?.staking}</Text>
-
-          <Spacer width={16} />
-
-          <CopyButton value={keyHashes?.staking ?? ''} />
-        </View>
+        {keyHashes?.staking != null && keyHashes.staking !== '' && (
+          <>
+            <CopyButton title={keyHashes.staking} value={keyHashes.staking} />
 
-        <Spacer width={8} />
+            <Spacer width={8} />
+          </>
+        )}
 
         <Text style={styles.subtitle}>{strings.spending}</Text>
 
-        <View style={styles.row}>
-          <Text style={styles.address}>{keyHashes?.spending}</Text>
-
-          <Spacer width={16} />
-
-          <CopyButton value={keyHashes?.spending ?? ''} />
-        </View>
+        {keyHashes?.spending != null && keyHashes.spending !== '' && (
+          <CopyButton title={keyHashes.spending} value={keyHashes.spending} />
+        )}
       </View>
     </ScrollView>
   )
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
index fd582c9dbc..356d0e837c 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
@@ -179,13 +179,7 @@ export const TxDetails = () => {
 
           <Label>{strings.transactionId}</Label>
 
-          <View style={styles.dataContainer}>
-            <Text secondary monospace numberOfLines={1} ellipsizeMode="middle">
-              {transaction.id}
-            </Text>
-
-            <CopyButton value={transaction.id} />
-          </View>
+          <CopyButton title={transaction.id} value={transaction.id} />
         </ScrollView>
 
         {network !== Chain.Network.Sancho && (
@@ -398,11 +392,6 @@ const useStyles = () => {
       borderTopWidth: 1,
       borderColor: color.gray_200,
     },
-    dataContainer: {
-      ...atoms.flex_row,
-      paddingRight: 70,
-      marginBottom: 20,
-    },
     address: {
       color: color.text_gray_medium,
       ...atoms.body_2_md_regular,
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
index 1fbf7a7748..bd25653fa3 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
@@ -4,13 +4,12 @@ import {useTheme} from '@yoroi/theme'
 import {useTransfer} from '@yoroi/transfer'
 import {Chain} from '@yoroi/types'
 import React from 'react'
-import {StyleSheet, TouchableOpacity, View} from 'react-native'
-import Animated, {FadeInDown, FadeOutDown, Layout} from 'react-native-reanimated'
+import {GestureResponderEvent, StyleSheet, TouchableOpacity, View} from 'react-native'
 
+import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../../components/Icon'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
-import {useCopy} from '../../../../hooks/useCopy'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
 import {useReceive} from '../../../Receive/common/ReceiveProvider'
@@ -30,7 +29,7 @@ export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
   const {isSingle, addressMode} = useAddressMode()
   const {next: nextReceiveAddress, used: usedAddresses} = useReceiveAddressesStatus(addressMode)
   const {selectedAddressChanged} = useReceive()
-  const [isCopying, copy] = useCopy()
+  const {copy} = useCopy()
   const {hideMultipleAddressesInfo, isShowingMultipleAddressInfo} = useMultipleAddressesInfo()
 
   const {reset: resetSendState} = useTransfer()
@@ -102,9 +101,9 @@ export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
     navigateTo.receiveSingleAddress()
   }
 
-  const handleOnLongPressReceive = () => {
+  const handleOnLongPressReceive = (event: GestureResponderEvent) => {
     track.receiveCopyAddressClicked({copy_address_location: 'Long Press wallet Address'})
-    copy(nextReceiveAddress)
+    copy({text: nextReceiveAddress, event})
   }
 
   const iconProps = {
@@ -118,12 +117,6 @@ export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
 
       <View style={styles.centralized}>
         <View style={[styles.row, disabled && styles.disabled]}>
-          {isCopying && (
-            <Animated.View layout={Layout} entering={FadeInDown} exiting={FadeOutDown} style={styles.isCopying}>
-              <Text style={styles.textCopy}>{strings.addressCopiedMsg}</Text>
-            </Animated.View>
-          )}
-
           <View style={styles.centralized}>
             <TouchableOpacity
               style={styles.actionIcon}
@@ -223,22 +216,6 @@ const useStyles = () => {
     disabled: {
       opacity: 0.5,
     },
-    isCopying: {
-      position: 'absolute',
-      backgroundColor: color.gray_max,
-      alignItems: 'center',
-      justifyContent: 'center',
-      top: -40,
-      borderRadius: 4,
-      zIndex: 10,
-      left: -25,
-    },
-    textCopy: {
-      textAlign: 'center',
-      ...atoms.p_sm,
-      ...atoms.body_2_md_medium,
-      color: color.gray_min,
-    },
   })
 
   const colors = {
diff --git a/apps/wallet-mobile/src/hooks/useCopy.ts b/apps/wallet-mobile/src/hooks/useCopy.ts
deleted file mode 100644
index 629bac0e2b..0000000000
--- a/apps/wallet-mobile/src/hooks/useCopy.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import Clipboard from '@react-native-community/clipboard'
-import {useEffect, useState} from 'react'
-
-const MESSAGE_TIMEOUT = 1500
-
-export const useCopy = () => {
-  const [text, setText] = useState<string>('')
-
-  useEffect(() => {
-    const isCopying = !!text
-
-    let timeout: ReturnType<typeof setTimeout> | undefined
-    if (isCopying) {
-      Clipboard.setString(text)
-      timeout = setTimeout(() => setText(''), MESSAGE_TIMEOUT)
-    }
-
-    return () => clearTimeout(timeout)
-  }, [text])
-
-  return [!!text, setText, text] as const
-}
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
index 5dfb74f53f..85bb51d5eb 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
@@ -37,12 +37,7 @@ export const UserSummary = ({totalAdaSum, totalRewards, totalDelegated, onWithdr
       <View style={styles.stats}>
         <View style={styles.row}>
           <View style={styles.icon}>
-            <Icon.TotalAda
-              color={color.el_primary_medium}
-              backgroundColor={color.gray_200}
-              width={ICON_DIM}
-              height={ICON_DIM}
-            />
+            <Icon.TotalAda color={color.el_primary_medium} size={ICON_DIM} />
           </View>
 
           <Space width="lg" />
@@ -64,12 +59,7 @@ export const UserSummary = ({totalAdaSum, totalRewards, totalDelegated, onWithdr
 
         <View style={styles.row}>
           <View style={styles.icon}>
-            <Icon.TotalReward
-              color={color.el_primary_medium}
-              backgroundColor={color.gray_200}
-              width={ICON_DIM}
-              height={ICON_DIM}
-            />
+            <Icon.TotalReward color={color.el_primary_medium} size={ICON_DIM} />
           </View>
 
           <Space width="lg" />
@@ -91,12 +81,7 @@ export const UserSummary = ({totalAdaSum, totalRewards, totalDelegated, onWithdr
 
         <View style={styles.row}>
           <View style={styles.icon}>
-            <Icon.TotalDelegated
-              color={color.el_primary_medium}
-              backgroundColor={color.gray_200}
-              width={ICON_DIM}
-              height={ICON_DIM}
-            />
+            <Icon.TotalDelegated color={color.el_primary_medium} size={ICON_DIM} />
           </View>
 
           <Space width="lg" />
diff --git a/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
index 9d302a6657..a695862341 100644
--- a/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {SafeArea} from '../../../components/SafeArea'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
@@ -28,11 +28,11 @@ export const FailedTxScreen = () => {
 
       <Spacer height={22} />
 
-      <Button onPress={navigateTo.buyAda} title={strings.buyAda} shelleyTheme />
+      <Button onPress={navigateTo.buyAda} title={strings.buyAda} />
 
       <Space height="lg" />
 
-      <Button onPress={navigateTo.main} title={strings.goToMain} textStyles={styles.outlineText} outline />
+      <Button type={ButtonType.Text} onPress={navigateTo.main} title={strings.goToMain} />
     </SafeArea>
   )
 }
@@ -86,9 +86,6 @@ const useStyles = () => {
       textAlign: 'center',
       maxWidth: 330,
     },
-    outlineText: {
-      color: color.primary_500,
-    },
   })
   return styles
 }
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
index a95fdd25ea..a3acf6e589 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {Image, StyleSheet, Text, View, ViewProps} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {ScrollView, useScrollView} from '../../../components/ScrollView/ScrollView'
@@ -139,20 +139,9 @@ export const PoolTransitionModal = ({
       {isScrollBarShown && <View style={styles.line} />}
 
       <Actions>
-        <Button
-          withoutBackground
-          title={strings.skipNoRewards.toLocaleUpperCase()}
-          textStyles={styles.outlineButton}
-          onPress={handleOnSkip}
-        />
-
-        <Button
-          shelleyTheme
-          title={strings.updateKeepEarning}
-          onPress={handleOnUpdate}
-          textStyles={styles.button}
-          disabled={isLoading}
-        />
+        <Button type={ButtonType.SecondaryText} title={strings.skipNoRewards} onPress={handleOnSkip} />
+
+        <Button title={strings.updateKeepEarning} onPress={handleOnUpdate} disabled={isLoading} />
       </Actions>
 
       <Space height="xl" />
@@ -239,20 +228,12 @@ const useStyles = () => {
     },
     actions: {
       ...atoms.px_lg,
-      alignSelf: 'stretch',
       gap: 4,
     },
     details: {
       ...atoms.body_1_lg_regular,
       color: color.gray_900,
     },
-    outlineButton: {
-      color: color.gray_900,
-      ...atoms.button_2_md,
-    },
-    button: {
-      ...atoms.button_1_lg,
-    },
     arrowDown: {
       ...atoms.flex_1,
       ...atoms.align_center,
diff --git a/apps/wallet-mobile/translations/messages/src/AppNavigator.json b/apps/wallet-mobile/translations/messages/src/AppNavigator.json
index 04368d7964..049abf8af2 100644
--- a/apps/wallet-mobile/translations/messages/src/AppNavigator.json
+++ b/apps/wallet-mobile/translations/messages/src/AppNavigator.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Enter PIN",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 233,
+      "line": 236,
       "column": 17,
-      "index": 8555
+      "index": 8867
     },
     "end": {
-      "line": 236,
+      "line": 239,
       "column": 3,
-      "index": 8645
+      "index": 8957
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Set PIN",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 237,
+      "line": 240,
       "column": 18,
-      "index": 8665
+      "index": 8977
     },
     "end": {
-      "line": 240,
+      "line": 243,
       "column": 3,
-      "index": 8763
+      "index": 9075
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Auth with OS changes",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 241,
+      "line": 244,
       "column": 25,
-      "index": 8790
+      "index": 9102
     },
     "end": {
-      "line": 244,
+      "line": 247,
       "column": 3,
-      "index": 8904
+      "index": 9216
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Auth with OS changed detected",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 245,
+      "line": 248,
       "column": 27,
-      "index": 8933
+      "index": 9245
     },
     "end": {
-      "line": 248,
+      "line": 251,
       "column": 3,
-      "index": 9054
+      "index": 9366
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
index 8fed328406..d260d3203e 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!NFT Details",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 358,
+      "line": 347,
       "column": 9,
-      "index": 10056
+      "index": 9687
     },
     "end": {
-      "line": 361,
+      "line": 350,
       "column": 3,
-      "index": 10127
+      "index": 9758
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Overview",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 362,
+      "line": 351,
       "column": 12,
-      "index": 10141
+      "index": 9772
     },
     "end": {
-      "line": 365,
+      "line": 354,
       "column": 3,
-      "index": 10212
+      "index": 9843
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Metadata",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 366,
+      "line": 355,
       "column": 12,
-      "index": 10226
+      "index": 9857
     },
     "end": {
-      "line": 369,
+      "line": 358,
       "column": 3,
-      "index": 10297
+      "index": 9928
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!NFT Name",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 370,
+      "line": 359,
       "column": 11,
-      "index": 10310
+      "index": 9941
     },
     "end": {
-      "line": 373,
+      "line": 362,
       "column": 3,
-      "index": 10380
+      "index": 10011
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Created",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 374,
+      "line": 363,
       "column": 13,
-      "index": 10395
+      "index": 10026
     },
     "end": {
-      "line": 377,
+      "line": 366,
       "column": 3,
-      "index": 10466
+      "index": 10097
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Description",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 378,
+      "line": 367,
       "column": 15,
-      "index": 10483
+      "index": 10114
     },
     "end": {
-      "line": 381,
+      "line": 370,
       "column": 3,
-      "index": 10560
+      "index": 10191
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Author",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 382,
+      "line": 371,
       "column": 10,
-      "index": 10572
+      "index": 10203
     },
     "end": {
-      "line": 385,
+      "line": 374,
       "column": 3,
-      "index": 10639
+      "index": 10270
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Fingerprint",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 386,
+      "line": 375,
       "column": 15,
-      "index": 10656
+      "index": 10287
     },
     "end": {
-      "line": 389,
+      "line": 378,
       "column": 3,
-      "index": 10733
+      "index": 10364
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Policy id",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 390,
+      "line": 379,
       "column": 12,
-      "index": 10747
+      "index": 10378
     },
     "end": {
-      "line": 393,
+      "line": 382,
       "column": 3,
-      "index": 10819
+      "index": 10450
     }
   },
   {
@@ -139,14 +139,14 @@
     "defaultMessage": "!!!Details on",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 394,
+      "line": 383,
       "column": 16,
-      "index": 10837
+      "index": 10468
     },
     "end": {
-      "line": 397,
+      "line": 386,
       "column": 3,
-      "index": 10914
+      "index": 10545
     }
   },
   {
@@ -154,14 +154,14 @@
     "defaultMessage": "!!!Copy metadata",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 398,
+      "line": 387,
       "column": 16,
-      "index": 10932
+      "index": 10563
     },
     "end": {
-      "line": 401,
+      "line": 390,
       "column": 3,
-      "index": 11012
+      "index": 10643
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
index f275f60b6c..75157f2b1f 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Your Summary",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 180,
+      "line": 165,
       "column": 9,
-      "index": 5288
+      "index": 4928
     },
     "end": {
-      "line": 183,
+      "line": 168,
       "column": 3,
-      "index": 5390
+      "index": 5030
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Total Rewards",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 184,
+      "line": 169,
       "column": 16,
-      "index": 5408
+      "index": 5048
     },
     "end": {
-      "line": 187,
+      "line": 172,
       "column": 3,
-      "index": 5518
+      "index": 5158
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Total Delegated",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 188,
+      "line": 173,
       "column": 18,
-      "index": 5538
+      "index": 5178
     },
     "end": {
-      "line": 191,
+      "line": 176,
       "column": 3,
-      "index": 5652
+      "index": 5292
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Withdraw",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 192,
+      "line": 177,
       "column": 23,
-      "index": 5677
+      "index": 5317
     },
     "end": {
-      "line": 195,
+      "line": 180,
       "column": 3,
-      "index": 5789
+      "index": 5429
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json b/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
index b4a907d7d7..15a640b6eb 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Not enough funds",
     "file": "src/legacy/Staking/FailedTx/FailedTxScreen.tsx",
     "start": {
-      "line": 108,
+      "line": 105,
       "column": 18,
-      "index": 2707
+      "index": 2634
     },
     "end": {
-      "line": 111,
+      "line": 108,
       "column": 3,
-      "index": 2823
+      "index": 2750
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Your transaction cannot be processed due to lack of funds on your wallet balance",
     "file": "src/legacy/Staking/FailedTx/FailedTxScreen.tsx",
     "start": {
-      "line": 112,
+      "line": 109,
       "column": 20,
-      "index": 2845
+      "index": 2772
     },
     "end": {
-      "line": 115,
+      "line": 112,
       "column": 3,
-      "index": 3027
+      "index": 2954
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Buy ada",
     "file": "src/legacy/Staking/FailedTx/FailedTxScreen.tsx",
     "start": {
-      "line": 116,
+      "line": 113,
       "column": 10,
-      "index": 3039
+      "index": 2966
     },
     "end": {
-      "line": 119,
+      "line": 116,
       "column": 3,
-      "index": 3138
+      "index": 3065
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Go to main wallet page",
     "file": "src/legacy/Staking/FailedTx/FailedTxScreen.tsx",
     "start": {
-      "line": 120,
+      "line": 117,
       "column": 12,
-      "index": 3152
+      "index": 3079
     },
     "end": {
-      "line": 123,
+      "line": 120,
       "column": 3,
-      "index": 3268
+      "index": 3195
     }
   }
 ]
\ No newline at end of file

From 159444af058eba0503e64ee54883d3694e7c822c Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 15:10:24 +0200
Subject: [PATCH 02/16] button refactor part 2

---
 .../src/components/Analytics/Analytics.tsx    |  17 +-
 .../src/components/Button/Button.tsx          |  68 +----
 .../src/components/Button/NewButton.tsx       |   2 +-
 .../src/components/ModalError/ModalError.tsx  |   6 +-
 .../TwoActionView/TwoActionView.tsx           |  10 +-
 .../common/ShowBuyBanner/BuyBannerBig.tsx     |   7 +-
 .../common/ShowBuyBanner/BuyBannerSmall.tsx   |  67 +++--
 .../ShowBuyBanner/PreprodFaucetBanner.tsx     |  53 ++--
 .../ShowBuyBanner/SanchonetFaucetBanner.tsx   |  53 ++--
 .../common/ShowBuyBanner/ShowBuyBanner.tsx    |  22 +-
 .../AskToOpenAWalletScreen.tsx                |   6 +-
 .../AskToRedirect/AskToRedirectScreen.tsx     |   6 +-
 .../RequestedAdaPaymentWithLinkScreen.tsx     |   6 +-
 .../RequestedBrowserLaunchDappUrlScreen.tsx   |   6 +-
 .../BuyADABanner/BuyADABanner.tsx             |   2 +-
 .../Portfolio/useCases/PortfolioScreen.tsx    |   6 +-
 .../ShowCameraPermissionDeniedScreen.tsx      |  10 +-
 .../Settings/ChangeNetwork/NetworkTag.tsx     |   6 +-
 .../EnableLoginWithOsScreen.tsx               |  20 +-
 .../ConfirmTxScreen/LedgerTransportSwitch.tsx |   8 +-
 .../ShowSubmittedTxScreen.tsx                 |  22 +-
 .../WarnLimitPrice/WarnLimitPrice.tsx         |  17 +-
 .../WarnPriceImpact/WarnPriceImpact.tsx       |  14 +-
 .../CreateOrder/WarnSlippage/WarnSlippage.tsx |  17 +-
 .../useCases/TxHistory/ActionsBanner.tsx      | 153 +++++-------
 .../src/kernel/i18n/global-messages.ts        |   2 +-
 .../src/kernel/i18n/locales/en-US.json        |   2 +-
 .../src/legacy/Dashboard/Dashboard.tsx        |   4 +-
 .../src/legacy/Dashboard/StakePoolInfo.tsx    |  54 ++--
 .../src/legacy/Dashboard/UserSummary.tsx      |  24 +-
 .../ConfirmTx/ConfirmTxWithPassword.tsx       |  12 +-
 .../src/components/Analytics/Analytics.json   |  88 +++----
 .../EnableLoginWithOsScreen.json              |  40 +--
 .../src/kernel/i18n/global-messages.json      | 232 +++++++++---------
 .../src/legacy/Dashboard/Dashboard.json       |   8 +-
 .../src/legacy/Dashboard/StakePoolInfo.json   |  40 +--
 .../src/legacy/Dashboard/UserSummary.json     |  32 +--
 37 files changed, 462 insertions(+), 680 deletions(-)

diff --git a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
index 1f580b428f..91e7bad1ac 100644
--- a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
+++ b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, TextStyle, TouchableOpacity, useWindowDimensions, View} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button} from '../../components/Button/Button'
+import {Button, ButtonType} from '../../components/Button/NewButton'
 import {Spacer} from '../../components/Spacer/Spacer'
 import {Text} from '../../components/Text'
 import {YoroiLogo} from '../../components/YoroiLogo/YoroiLogo'
@@ -64,15 +64,13 @@ const Notice = ({onClose, onReadMore}: {onClose?: () => void; onReadMore?: () =>
           <CommonContent onReadMore={onReadMore} showLogo />
 
           <Button // skip button
-            block
-            outlineShelley
+            size="S"
+            type={ButtonType.Text}
             onPress={() => {
               metrics.disable()
               onClose?.()
             }}
             title={strings.skip}
-            style={styles.skip}
-            textStyles={styles.skipText}
           />
         </View>
       </ScrollView>
@@ -90,8 +88,7 @@ const Notice = ({onClose, onReadMore}: {onClose?: () => void; onReadMore?: () =>
         ]}
       >
         <Button // accept button
-          block
-          shelleyTheme
+          size="S"
           onPress={() => {
             metrics.enable()
             onClose?.()
@@ -219,12 +216,6 @@ const useStyles = () => {
       ...atoms.heading_3_medium,
       textAlign: 'center',
     },
-    skip: {
-      borderWidth: 0,
-    },
-    skipText: {
-      color: color.primary_900,
-    },
     tick: {
       color: color.primary_700,
       paddingRight: 8,
diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
index 36f6534abc..2eca9e9f2a 100644
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.tsx
@@ -6,56 +6,23 @@ import {Text} from '../Text'
 
 export type ButtonProps = {
   title: string
-  outlineOnLight?: boolean
   containerStyle?: ViewStyle
   block?: boolean
   shelleyTheme?: boolean
-  warningTheme?: boolean
-  outlineShelley?: boolean
   textStyles?: TextStyle
 } & TouchableOpacityProps
 
 export const Button = (props: ButtonProps) => {
-  const {
-    onPress,
-    title,
-    block,
-    style,
-    containerStyle,
-    outlineOnLight,
-    shelleyTheme,
-    outlineShelley,
-    textStyles,
-    ...rest
-  } = props
+  const {onPress, title, block, style, containerStyle, shelleyTheme, textStyles, ...rest} = props
 
   const {styles} = useStyles()
 
   return (
     <TouchableOpacity onPress={onPress} style={[block && styles.block, containerStyle]} activeOpacity={0.5} {...rest}>
       <View
-        style={[
-          styles.button,
-          outlineOnLight && styles.buttonOutlineOnLight,
-          props.disabled && styles.buttonDisabled,
-          outlineShelley && styles.buttonOutlineShelley,
-          shelleyTheme && styles.shelleyTheme,
-          outlineOnLight && shelleyTheme && styles.shelleyOutlineOnLight,
-          style,
-        ]}
+        style={[styles.button, props.disabled && styles.buttonDisabled, shelleyTheme && styles.shelleyTheme, style]}
       >
-        <Text
-          style={[
-            styles.text,
-            outlineOnLight && styles.textOutlineOnLight,
-            outlineOnLight && shelleyTheme && styles.textShelleyOutlineOnLight,
-            outlineShelley && styles.textOutlineShelley,
-            props.disabled && !outlineOnLight && styles.buttonDisabledText,
-            textStyles,
-          ]}
-        >
-          {title}
-        </Text>
+        <Text style={[styles.text, props.disabled && styles.buttonDisabledText, textStyles]}>{title}</Text>
       </View>
     </TouchableOpacity>
   )
@@ -64,11 +31,6 @@ export const Button = (props: ButtonProps) => {
 const useStyles = () => {
   const {color, atoms} = useTheme()
 
-  const buttonOutline = {
-    borderWidth: 2,
-    borderColor: color.gray_min,
-    backgroundColor: 'transparent',
-  }
   const styles = StyleSheet.create({
     block: {
       flex: 1,
@@ -82,14 +44,6 @@ const useStyles = () => {
       alignItems: 'center',
       justifyContent: 'center',
     },
-    buttonOutlineOnLight: {
-      ...buttonOutline,
-      borderColor: color.secondary_500,
-    },
-    buttonOutlineShelley: {
-      ...buttonOutline,
-      borderColor: color.el_primary_medium,
-    },
     text: {
       color: color.white_static,
       ...atoms.body_2_md_medium,
@@ -97,12 +51,7 @@ const useStyles = () => {
       textAlign: 'center',
       textTransform: 'uppercase',
     },
-    textOutlineOnLight: {
-      color: color.secondary_500,
-    },
-    textOutlineShelley: {
-      color: color.text_primary_medium,
-    },
+
     buttonDisabled: {
       opacity: 0.5,
     },
@@ -112,15 +61,6 @@ const useStyles = () => {
     shelleyTheme: {
       backgroundColor: color.primary_500,
     },
-    shelleyOutlineOnLight: {
-      backgroundColor: 'transparent',
-      borderColor: color.primary_600,
-      borderWidth: 2,
-    },
-    textShelleyOutlineOnLight: {
-      color: color.primary_600,
-      fontWeight: '600',
-    },
   })
 
   return {styles} as const
diff --git a/apps/wallet-mobile/src/components/Button/NewButton.tsx b/apps/wallet-mobile/src/components/Button/NewButton.tsx
index 45d35291ea..18437ab5a6 100644
--- a/apps/wallet-mobile/src/components/Button/NewButton.tsx
+++ b/apps/wallet-mobile/src/components/Button/NewButton.tsx
@@ -137,7 +137,7 @@ const useStyles = ({
           : {...atoms.p_sm, ...atoms.gap_2xs, ...atoms.rounded_sm}
       break
     case ButtonType.Circle:
-      shape = {width: 48, height: 48, ...atoms.rounded_full}
+      shape = {width: 56, height: 56, ...atoms.align_center, ...atoms.rounded_full}
       break
   }
   const font =
diff --git a/apps/wallet-mobile/src/components/ModalError/ModalError.tsx b/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
index e3b0766583..4c1e4dc106 100644
--- a/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
+++ b/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
@@ -9,7 +9,7 @@ import {
   LedgerUserError,
   RejectedByUserError,
 } from '../../yoroi-wallets/hw/hw'
-import {Button} from '../Button/Button'
+import {Button, ButtonType} from '../Button/NewButton'
 import {Icon} from '../Icon'
 import {Space} from '../Space/Space'
 import {Text} from '../Text'
@@ -37,11 +37,11 @@ export const ModalError = ({error, resetErrorBoundary, onCancel}: Props) => {
       </View>
 
       <View style={styles.buttons}>
-        <Button shelleyTheme outlineOnLight block onPress={onCancel} title={strings.cancel} />
+        <Button size="S" type={ButtonType.Secondary} onPress={onCancel} title={strings.cancel} />
 
         <Space width="lg" />
 
-        <Button shelleyTheme block onPress={resetErrorBoundary} title={strings.tryAgain} />
+        <Button size="S" onPress={resetErrorBoundary} title={strings.tryAgain} />
       </View>
     </>
   )
diff --git a/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx b/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
index b8ae6b5a52..bc3c75a17f 100644
--- a/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
+++ b/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
@@ -4,7 +4,7 @@ import {useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View} from 'react-native'
 
 import {confirmationMessages} from '../../kernel/i18n/global-messages'
-import {Button} from '../Button/Button'
+import {Button, ButtonType} from '../Button/NewButton'
 import {Space} from '../Space/Space'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
@@ -52,9 +52,8 @@ export const TwoActionView = ({title, children, primaryButton, secondaryButton}:
       <View style={styles.buttons}>
         {secondaryButton != null && (
           <Button
-            block
-            shelleyTheme
-            outlineOnLight
+            size="S"
+            type={ButtonType.Secondary}
             onPress={secondaryButton.onPress}
             title={secondaryButton.label ?? intl.formatMessage(confirmationMessages.commonButtons.cancelButton)}
             disabled={secondaryButton.disabled}
@@ -65,8 +64,7 @@ export const TwoActionView = ({title, children, primaryButton, secondaryButton}:
         <Space width="md" />
 
         <Button
-          block
-          shelleyTheme
+          size="S"
           onPress={primaryButton.onPress}
           title={primaryButton.label}
           disabled={primaryButton.disabled}
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
index 3e14330692..331103b685 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
@@ -42,12 +42,7 @@ export const BuyBannerBig = () => {
 
         <Space />
 
-        <Button
-          testID="rampOnOffButton"
-          size="S"
-          title={strings.buyCrypto.toLocaleUpperCase()}
-          onPress={handleExchange}
-        />
+        <Button testID="rampOnOffButton" size="S" title={strings.buyCrypto} onPress={handleExchange} />
       </LinearGradient>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
index a59c0d8f64..c904e24b01 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
@@ -1,12 +1,11 @@
 import {useNavigation} from '@react-navigation/native'
 import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
-import {StyleSheet, Text, TouchableOpacity, View} from 'react-native'
+import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
-import {Spacer} from '../../../../components/Spacer/Spacer'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
 import {useStrings} from '../useStrings'
 
@@ -23,52 +22,48 @@ export const BuyBannerSmall = ({onClose}: SmallBannerProps) => {
     navigation.navigate('exchange-create-order')
   }
   return (
-    <>
-      <View style={styles.root}>
-        <LinearGradient style={styles.gradient} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
-          <View style={styles.viewTitle}>
-            <Text style={styles.title}>{strings.needMoreCrypto}</Text>
+    <LinearGradient style={styles.container} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
+      <View style={styles.viewTitle}>
+        <Text style={styles.title}>{strings.needMoreCrypto}</Text>
 
-            <Spacer width={5} />
-
-            <TouchableOpacity onPress={onClose}>
-              <Icon.Close size={24} color={colors.gray} />
-            </TouchableOpacity>
-          </View>
-
-          <Spacer height={8} />
-
-          <Text style={styles.text}>{strings.ourTrustedPartners}</Text>
-
-          <Spacer height={8} />
-
-          <Button testID="rampOnOffButton" title={strings.buyCrypto.toLocaleUpperCase()} onPress={handleExchange} />
-        </LinearGradient>
+        <Button type={ButtonType.SecondaryText} icon={Icon.Close} onPress={onClose} style={styles.closeButton} />
       </View>
 
-      <Spacer height={18} />
-    </>
+      <Text style={styles.text}>{strings.ourTrustedPartners}</Text>
+
+      <Button
+        testID="rampOnOffButton"
+        style={styles.button}
+        title={strings.buyCrypto}
+        size="S"
+        onPress={handleExchange}
+      />
+    </LinearGradient>
   )
 }
 
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
-    root: {
-      backgroundColor: color.bg_color_max,
-    },
-    gradient: {
-      flex: 1,
-      opacity: 1,
-      borderRadius: 8,
-      flexDirection: 'column',
+    container: {
+      ...atoms.flex,
+      ...atoms.rounded_sm,
+      ...atoms.flex_col,
       ...atoms.px_lg,
       ...atoms.py_md,
+      ...atoms.gap_sm,
     },
     viewTitle: {
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      flex: 1,
+      ...atoms.flex_row,
+      ...atoms.justify_between,
+      ...atoms.gap_lg,
+    },
+    closeButton: {
+      ...atoms.p_0,
+      flexGrow: 0,
+    },
+    button: {
+      ...atoms.self_center,
     },
     title: {
       ...atoms.body_1_lg_medium,
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
index 7cdcbe872b..5e3ada6f86 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
@@ -18,50 +18,41 @@ export const PreprodFaucetBanner = () => {
   }
 
   return (
-    <>
-      <View style={styles.root}>
-        <LinearGradient style={styles.gradient} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
-          <View style={styles.viewTitle}>
-            <Text style={styles.title}>{strings.preprodFaucetBannerTitle}</Text>
+    <LinearGradient style={styles.gradient} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
+      <View style={styles.viewTitle}>
+        <Text style={styles.title}>{strings.preprodFaucetBannerTitle}</Text>
 
-            <Space height="xs" />
-          </View>
+        <Space height="xs" />
+      </View>
 
-          <View style={styles.content}>
-            <View style={styles.contentInner}>
-              <Spacer height={8} />
+      <View style={styles.content}>
+        <View style={styles.contentInner}>
+          <Spacer height={8} />
 
-              <Text style={styles.text}>{strings.preprodFaucetBannerText}</Text>
+          <Text style={styles.text}>{strings.preprodFaucetBannerText}</Text>
 
-              <Space height="lg" />
+          <Space height="lg" />
 
-              <Button
-                testID="rampOnOffButton"
-                shelleyTheme
-                title={strings.preprodFaucetBannerButtonText}
-                onPress={handleOnPress}
-                style={styles.spaceButton}
-              />
-            </View>
+          <Button
+            testID="rampOnOffButton"
+            shelleyTheme
+            title={strings.preprodFaucetBannerButtonText}
+            onPress={handleOnPress}
+            style={styles.spaceButton}
+          />
+        </View>
 
-            <View style={styles.logo}>
-              <PreprodFaucetBannerLogo />
-            </View>
-          </View>
-        </LinearGradient>
+        <View style={styles.logo}>
+          <PreprodFaucetBannerLogo />
+        </View>
       </View>
-
-      <Spacer height={18} />
-    </>
+    </LinearGradient>
   )
 }
 
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
-    root: {
-      backgroundColor: color.bg_color_max,
-    },
     gradient: {
       ...atoms.flex_1,
       opacity: 1,
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
index f1a15965c0..1031ec28db 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
@@ -18,50 +18,41 @@ export const SanchonetFaucetBanner = () => {
   }
 
   return (
-    <>
-      <View style={styles.root}>
-        <LinearGradient style={styles.gradient} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
-          <View style={styles.viewTitle}>
-            <Text style={styles.title}>{strings.sanchoFaucetBannerTitle}</Text>
+    <LinearGradient style={styles.gradient} start={{x: 1, y: 1}} end={{x: 0, y: 0}} colors={colors.gradientColor}>
+      <View style={styles.viewTitle}>
+        <Text style={styles.title}>{strings.sanchoFaucetBannerTitle}</Text>
 
-            <Space height="xs" />
-          </View>
+        <Space height="xs" />
+      </View>
 
-          <View style={styles.content}>
-            <View style={styles.contentInner}>
-              <Spacer height={8} />
+      <View style={styles.content}>
+        <View style={styles.contentInner}>
+          <Spacer height={8} />
 
-              <Text style={styles.text}>{strings.sanchoFaucetBannerText}</Text>
+          <Text style={styles.text}>{strings.sanchoFaucetBannerText}</Text>
 
-              <Space height="lg" />
+          <Space height="lg" />
 
-              <Button
-                testID="rampOnOffButton"
-                shelleyTheme
-                title={strings.sanchoFaucetBannerButtonText}
-                onPress={handleOnPress}
-                style={styles.spaceButton}
-              />
-            </View>
+          <Button
+            testID="rampOnOffButton"
+            shelleyTheme
+            title={strings.sanchoFaucetBannerButtonText}
+            onPress={handleOnPress}
+            style={styles.spaceButton}
+          />
+        </View>
 
-            <View style={styles.logo}>
-              <PreprodFaucetBannerLogo />
-            </View>
-          </View>
-        </LinearGradient>
+        <View style={styles.logo}>
+          <PreprodFaucetBannerLogo />
+        </View>
       </View>
-
-      <Spacer height={18} />
-    </>
+    </LinearGradient>
   )
 }
 
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
-    root: {
-      backgroundColor: color.bg_color_max,
-    },
     gradient: {
       ...atoms.flex_1,
       opacity: 1,
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.tsx
index 69e03bbcc8..8df63e337a 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/ShowBuyBanner.tsx
@@ -1,6 +1,7 @@
 import {Chain} from '@yoroi/types'
 import _ from 'lodash'
 import * as React from 'react'
+import {View} from 'react-native'
 
 import {useBalances, useTransactionInfos} from '../../../../yoroi-wallets/hooks'
 import {Amounts, Quantities} from '../../../../yoroi-wallets/utils/utils'
@@ -27,10 +28,21 @@ export const ShowBuyBanner = () => {
   const showSmallBanner = useShowBuyBannerSmall()
   const {resetShowBuyBannerSmall} = useResetShowBuyBannerSmall()
 
-  if (hasZeroPt && hasZeroTx && network === Chain.Network.Preprod) return <PreprodFaucetBanner />
-  if (hasZeroPt && hasZeroTx && network === Chain.Network.Sancho) return <SanchonetFaucetBanner />
-  if (hasZeroPt && hasZeroTx) return <BuyBannerBig />
-  if (showSmallBanner) return <BuyBannerSmall onClose={resetShowBuyBannerSmall} />
+  let banner = null
+  switch (true) {
+    case hasZeroPt && hasZeroTx && network === Chain.Network.Preprod:
+      banner = <PreprodFaucetBanner />
+      break
+    case hasZeroPt && hasZeroTx && network === Chain.Network.Sancho:
+      banner = <SanchonetFaucetBanner />
+      break
+    case hasZeroPt && hasZeroTx:
+      banner = <BuyBannerBig />
+      break
+    case showSmallBanner:
+      banner = <BuyBannerSmall onClose={resetShowBuyBannerSmall} />
+      break
+  }
 
-  return null
+  return banner ? <View style={{paddingBottom: 18}}>{banner}</View> : null
 }
diff --git a/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
index e505b756e1..0206f1e396 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../../common/useStrings'
@@ -30,11 +30,11 @@ export const AskToOpenWalletScreen = () => {
       </ScrollView>
 
       <Actions style={styles.actions}>
-        <Button block outlineShelley onPress={handleOnCancel} title={strings.cancel} />
+        <Button size="S" type={ButtonType.Secondary} onPress={handleOnCancel} title={strings.cancel} />
 
         <Spacer width={16} />
 
-        <Button block shelleyTheme onPress={closeModal} title={strings.ok} />
+        <Button size="S" onPress={closeModal} title={strings.ok} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
index 60d57b886c..7132e622f5 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../../common/useStrings'
@@ -28,11 +28,11 @@ export const AskToRedirectScreen = ({link}: {link: string}) => {
       </ScrollView>
 
       <Actions style={styles.actions}>
-        <Button block outlineShelley onPress={closeModal} title={strings.cancel} />
+        <Button size="S" type={ButtonType.Secondary} onPress={closeModal} title={strings.cancel} />
 
         <Spacer width={16} />
 
-        <Button block shelleyTheme onPress={handleOnConfirm} title={strings.ok} />
+        <Button size="S" onPress={handleOnConfirm} title={strings.ok} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
index 5fb36c33aa..18ad4bd139 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -58,11 +58,11 @@ export const RequestedAdaPaymentWithLinkScreen = ({
       </ScrollView>
 
       <Actions style={styles.actions}>
-        <Button block outlineShelley onPress={handleOnCancel} title={strings.cancel} />
+        <Button size="S" type={ButtonType.Secondary} onPress={handleOnCancel} title={strings.cancel} />
 
         <Spacer width={16} />
 
-        <Button block shelleyTheme onPress={onContinue} title={strings.continue} />
+        <Button size="S" onPress={onContinue} title={strings.continue} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
index 30ccc680ed..ef792439a0 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
@@ -4,7 +4,7 @@ import {Links} from '@yoroi/types'
 import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -58,9 +58,9 @@ export const RequestedBrowserLaunchDappUrlScreen = ({
       </ScrollView>
 
       <Actions style={styles.actions}>
-        <Button block outlineShelley onPress={handleOnCancel} title={strings.cancel} />
+        <Button size="S" type={ButtonType.Secondary} onPress={handleOnCancel} title={strings.cancel} />
 
-        <Button block shelleyTheme onPress={onContinue} title={strings.continue} />
+        <Button size="S" onPress={onContinue} title={strings.continue} />
       </Actions>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
index 2585bfb593..9d34e874da 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
@@ -29,7 +29,7 @@ export const BuyADABanner = () => {
 
         <Spacer height={16} />
 
-        <Button title={strings.buyCrypto.toLocaleUpperCase()} onPress={handleExchange} />
+        <Button title={strings.buyCrypto} onPress={handleExchange} />
 
         <View style={styles.assetImageBox}>
           <AssetImage />
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
index 6a6ebd63b4..6967981fb9 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {FlatList, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiWallet} from '../../../yoroi-wallets/cardano/types'
 import {useWalletManager} from '../../WalletManager/context/WalletManagerProvider'
@@ -60,11 +60,11 @@ export const PortfolioScreen = () => {
 
         <Spacer height={16} />
 
-        <Button title={!isActive ? 'start sync' : 'stop sync'} onPress={handleOnSync} shelleyTheme />
+        <Button title={!isActive ? 'start sync' : 'stop sync'} onPress={handleOnSync} size="S" />
 
         <Spacer height={16} />
 
-        <Button title="reset" onPress={handleOnReset} outlineShelley disabled={!canWipe} />
+        <Button title="reset" onPress={handleOnReset} size="S" type={ButtonType.Secondary} disabled={!canWipe} />
 
         <Spacer height={16} />
 
diff --git a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
index d7f9d544e2..b5a8567463 100644
--- a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
+++ b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
@@ -1,15 +1,15 @@
 import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
+import {openSettings} from 'react-native-permissions'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {useBlockGoBack, useWalletNavigation} from '../../../../kernel/navigation'
 import {useStrings} from '../../common/useStrings'
 import {CameraPermissionDeniedIllustration} from '../../illustrations/CameraPermissionDeniedIlustration'
-import {OpenDeviceAppSettingsButton} from './OpenDeviceAppSettingsButton'
 
 export const ShowCameraPermissionDeniedScreen = () => {
   const styles = useStyles()
@@ -29,11 +29,11 @@ export const ShowCameraPermissionDeniedScreen = () => {
       </ScrollView>
 
       <Actions>
-        <ContinueButton onPress={resetToTxHistory} title={strings.continue} outlineShelley />
+        <Button onPress={resetToTxHistory} title={strings.continue} size="S" type={ButtonType.Secondary} />
 
         <Spacer height={16} />
 
-        <OpenDeviceAppSettingsButton />
+        <Button onPress={openSettings} title={strings.openAppSettings} size="S" />
       </Actions>
     </SafeAreaView>
   )
@@ -75,5 +75,3 @@ const useStyles = () => {
   })
   return styles
 }
-
-const ContinueButton = Button
diff --git a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
index 2cd5fca0f9..7c89c4bfe3 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
@@ -3,7 +3,7 @@ import {Chain} from '@yoroi/types'
 import * as React from 'react'
 import {StyleSheet, Text, TextStyle, TouchableOpacity, useWindowDimensions, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
@@ -126,11 +126,11 @@ const MainnetWarningDialog = ({onCancel, onOk}: {onCancel: () => void; onOk: ()
       <Spacer fill />
 
       <View style={styles.warningModalActions}>
-        <Button shelleyTheme outlineOnLight title="Cancel" block onPress={onCancel} />
+        <Button size="S" type={ButtonType.Secondary} title="Cancel" onPress={onCancel} />
 
         <Space width="lg" />
 
-        <Button shelleyTheme title="Switch" block onPress={onOk} />
+        <Button size="S" title="Switch" onPress={onOk} />
       </View>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx b/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
index ac1436a7a7..1c05f78660 100644
--- a/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
@@ -1,9 +1,8 @@
 import {useNavigation} from '@react-navigation/native'
 import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
-import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button, ButtonType} from '../../../components/Button/NewButton'
 import globalMessages from '../../../kernel/i18n/global-messages'
 import {useEnableAuthWithOs} from '../../Auth/common/hooks'
 import {OsAuthScreen} from '../../Auth/OsAuthScreen/OsAuthScreen'
@@ -22,18 +21,17 @@ export const EnableLoginWithOsScreen = () => {
         <Button
           key="cancel"
           disabled={isLoading}
-          outlineShelley
+          size="S"
+          type={ButtonType.Secondary}
           title={strings.notNowButton}
           onPress={() => navigation.goBack()}
-          containerStyle={styles.cancel}
         />,
         <Button
-          shelleyTheme
+          size="S"
           disabled={isLoading}
           key="link"
           title={strings.linkButton}
           onPress={() => enableAuthWithOs()}
-          containerStyle={styles.link}
         />,
       ]}
     />
@@ -75,13 +73,3 @@ const messages = defineMessages({
     defaultMessage: '!!!to your Yoroi wallet',
   },
 })
-
-const styles = StyleSheet.create({
-  cancel: {
-    flex: 1,
-    marginRight: 15,
-  },
-  link: {
-    flex: 1,
-  },
-})
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
index cffd5ea6ae..78d83de93e 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Alert, ScrollView, StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {useIsUsbSupported} from '../../../../legacy/HW'
@@ -30,8 +30,7 @@ const LedgerTransportSwitchView = ({onSelectUSB, onSelectBLE}: Props) => {
         <Text style={styles.paragraph}>{strings.bluetoothExplanation}</Text>
 
         <Button
-          outlineOnLight
-          shelleyTheme
+          type={ButtonType.Secondary}
           onPress={() => request()}
           title={strings.bluetoothButton}
           testID="connectWithBLEButton"
@@ -42,8 +41,7 @@ const LedgerTransportSwitchView = ({onSelectUSB, onSelectBLE}: Props) => {
         <Text style={styles.paragraph}>{strings.usbExplanation}</Text>
 
         <Button
-          outlineOnLight
-          shelleyTheme
+          type={ButtonType.Secondary}
           onPress={onSelectUSB}
           title={strings.usbButton}
           disabled={!isUSBSupported || !HARDWARE_WALLETS.LEDGER_NANO.ENABLE_USB_TRANSPORT}
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
index a2b1504b3b..e57fa04e49 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
@@ -5,7 +5,7 @@ import {Linking, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {z} from 'zod'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useBlockGoBack, useUnsafeParams, useWalletNavigation} from '../../../../../kernel/navigation'
@@ -46,21 +46,11 @@ export const ShowSubmittedTxScreen = () => {
         <Spacer height={20} />
 
         {isString(params?.txId) && (
-          <Button
-            onPress={navigateToExplorer}
-            title={strings.seeOnExplorer}
-            style={styles.explorerButton}
-            outlineShelley
-          />
+          <Button type={ButtonType.Text} size="S" onPress={navigateToExplorer} title={strings.seeOnExplorer} />
         )}
 
         <View style={styles.bottomFixed}>
-          <Button
-            onPress={() => walletNavigate.navigateToTxHistory()}
-            title={strings.goToTransactions}
-            style={styles.button}
-            shelleyTheme
-          />
+          <Button onPress={() => walletNavigate.navigateToTxHistory()} title={strings.goToTransactions} />
         </View>
       </View>
     </SafeAreaView>
@@ -100,12 +90,6 @@ const useStyles = () => {
       textAlign: 'center',
       maxWidth: 300,
     },
-    button: {
-      paddingHorizontal: 20,
-    },
-    explorerButton: {
-      borderColor: 'transparent',
-    },
   })
 
   return styles
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
index 2fd35c9a7f..6e218f4ba8 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
@@ -4,7 +4,7 @@ import {BigNumber} from 'bignumber.js'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useLanguage} from '../../../../../../kernel/i18n'
@@ -68,19 +68,13 @@ export const WarnLimitPrice = ({onConfirm, orderData}: LimitPriceWarningProps) =
       <View style={styles.buttonsWrapper}>
         <Button
           testID="swapCancelButton"
-          outlineShelley
+          size="S"
+          type={ButtonType.Secondary}
           title={strings.limitPriceWarningBack}
           onPress={closeModal}
-          containerStyle={styles.buttonContainer}
         />
 
-        <Button
-          testID="swapConfirmButton"
-          shelleyTheme
-          title={strings.limitPriceWarningConfirm}
-          onPress={onConfirm}
-          containerStyle={styles.buttonContainer}
-        />
+        <Button size="S" testID="swapConfirmButton" title={strings.limitPriceWarningConfirm} onPress={onConfirm} />
       </View>
     </View>
   )
@@ -89,9 +83,6 @@ export const WarnLimitPrice = ({onConfirm, orderData}: LimitPriceWarningProps) =
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
-    buttonContainer: {
-      ...atoms.flex_1,
-    },
     buttonsWrapper: {
       ...atoms.align_center,
       ...atoms.justify_between,
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
index d59012ead0..4fe3d5fa46 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {PRICE_IMPACT_HIGH_RISK, PRICE_IMPACT_MODERATE_RISK} from '../../../../common/constants'
@@ -36,14 +36,9 @@ export const WarnPriceImpact = ({onContinue, priceImpactRisk}: Props) => {
       <Spacer fill />
 
       <View style={styles.buttonsWrapper}>
-        <Button outlineShelley title={strings.cancel} onPress={closeModal} containerStyle={styles.buttonContainer} />
+        <Button size="S" type={ButtonType.Secondary} title={strings.cancel} onPress={closeModal} />
 
-        <Button
-          title={strings.continue}
-          onPress={onContinue}
-          style={styles.buttonContinue}
-          containerStyle={styles.buttonContainer}
-        />
+        <Button size="S" title={strings.continue} onPress={onContinue} style={styles.buttonContinue} />
       </View>
     </View>
   )
@@ -52,9 +47,6 @@ export const WarnPriceImpact = ({onContinue, priceImpactRisk}: Props) => {
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
-    buttonContainer: {
-      ...atoms.flex_1,
-    },
     buttonContinue: {
       backgroundColor: color.sys_magenta_500,
       ...atoms.flex_1,
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
index 3953df601e..d65d0d87f5 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../../../components/Button/Button'
+import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useStrings} from '../../../../common/strings'
@@ -50,19 +50,13 @@ export const WarnSlippage = ({onConfirm, slippage, ticker}: Props) => {
       <View style={styles.actions}>
         <Button
           testID="swapCancelButton"
-          outlineShelley
+          size="S"
+          type={ButtonType.Secondary}
           title={strings.limitPriceWarningBack}
           onPress={closeModal}
-          containerStyle={styles.buttonContainer}
         />
 
-        <Button
-          testID="swapConfirmButton"
-          shelleyTheme
-          title={strings.limitPriceWarningConfirm}
-          onPress={onConfirm}
-          containerStyle={styles.buttonContainer}
-        />
+        <Button testID="swapConfirmButton" size="S" title={strings.limitPriceWarningConfirm} onPress={onConfirm} />
       </View>
     </View>
   )
@@ -71,9 +65,6 @@ export const WarnSlippage = ({onConfirm, slippage, ticker}: Props) => {
 const useStyles = () => {
   const {atoms, color} = useTheme()
   const styles = StyleSheet.create({
-    buttonContainer: {
-      ...atoms.flex_1,
-    },
     actions: {
       ...atoms.align_center,
       ...atoms.justify_between,
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
index bd25653fa3..b78b9a434e 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
@@ -4,11 +4,11 @@ import {useTheme} from '@yoroi/theme'
 import {useTransfer} from '@yoroi/transfer'
 import {Chain} from '@yoroi/types'
 import React from 'react'
-import {GestureResponderEvent, StyleSheet, TouchableOpacity, View} from 'react-native'
+import {GestureResponderEvent, StyleSheet, View} from 'react-native'
 
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../../components/Icon'
-import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
@@ -22,7 +22,7 @@ import {useWalletManager} from '../../../WalletManager/context/WalletManagerProv
 import {useStrings} from '../../common/strings'
 
 export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
-  const {styles, colors} = useStyles()
+  const {styles} = useStyles()
   const strings = useStrings()
   const navigateTo = useNavigateTo()
 
@@ -106,85 +106,60 @@ export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
     copy({text: nextReceiveAddress, event})
   }
 
-  const iconProps = {
-    size: 24,
-    color: colors.actionColor,
-  }
-
   return (
-    <View>
-      <Spacer height={16} />
-
+    <View style={styles.container}>
       <View style={styles.centralized}>
-        <View style={[styles.row, disabled && styles.disabled]}>
+        <Button
+          type={ButtonType.Circle}
+          icon={Icon.Received}
+          onPress={handleOnPressReceive}
+          testID="receiveButton"
+          disabled={disabled}
+          onLongPress={handleOnLongPressReceive}
+        />
+
+        <Text style={styles.actionLabel}>{strings.receiveLabel}</Text>
+      </View>
+
+      {!meta.isReadOnly && (
+        <>
           <View style={styles.centralized}>
-            <TouchableOpacity
-              style={styles.actionIcon}
-              onPress={handleOnPressReceive}
-              testID="receiveButton"
+            <Button
+              type={ButtonType.Circle}
+              icon={Icon.Send}
+              onPress={handleOnSend}
+              testID="sendButton"
               disabled={disabled}
-              onLongPress={handleOnLongPressReceive}
-            >
-              <Icon.Received {...iconProps} />
-            </TouchableOpacity>
+            />
 
-            <Text style={styles.actionLabel}>{strings.receiveLabel}</Text>
+            <Text style={styles.actionLabel}>{strings.sendLabel}</Text>
           </View>
 
-          {!meta.isReadOnly && <Spacer width={18} />}
-
-          {!meta.isReadOnly && (
-            <View style={styles.centralized}>
-              <TouchableOpacity
-                style={styles.actionIcon}
-                onPress={handleOnSend}
-                testID="sendButton"
-                disabled={disabled}
-              >
-                <Icon.Send {...iconProps} />
-              </TouchableOpacity>
-
-              <Text style={styles.actionLabel}>{strings.sendLabel}</Text>
-            </View>
-          )}
-
-          {!meta.isReadOnly && (
-            <>
-              <Spacer width={18} />
-
-              <View style={styles.centralized}>
-                <TouchableOpacity
-                  style={styles.actionIcon}
-                  onPress={handleOnSwap}
-                  testID="swapButton"
-                  disabled={disabled}
-                >
-                  <Icon.Swap {...iconProps} />
-                </TouchableOpacity>
-
-                <Text style={styles.actionLabel}>{strings.swapLabel}</Text>
-              </View>
-
-              <Spacer width={18} />
-
-              <View style={styles.centralized}>
-                <TouchableOpacity
-                  style={styles.actionIcon}
-                  onPress={handleOnExchange}
-                  testID="buyButton"
-                  disabled={disabled}
-                >
-                  <Icon.Exchange {...iconProps} />
-                </TouchableOpacity>
-
-                <Text style={styles.actionLabel}>{strings.exchange}</Text>
-              </View>
-            </>
-          )}
-        </View>
-      </View>
+          <View style={styles.centralized}>
+            <Button
+              type={ButtonType.Circle}
+              icon={Icon.Swap}
+              onPress={handleOnSwap}
+              testID="swapButton"
+              disabled={disabled}
+            />
+
+            <Text style={styles.actionLabel}>{strings.swapLabel}</Text>
+          </View>
 
-      <Spacer height={21} />
+          <View style={styles.centralized}>
+            <Button
+              type={ButtonType.Circle}
+              icon={Icon.Exchange}
+              onPress={handleOnExchange}
+              testID="buyButton"
+              disabled={disabled}
+            />
+
+            <Text style={styles.actionLabel}>{strings.exchange}</Text>
+          </View>
+        </>
+      )}
     </View>
   )
 }
@@ -192,36 +167,24 @@ export const ActionsBanner = ({disabled = false}: {disabled: boolean}) => {
 const useStyles = () => {
   const {atoms, color} = useTheme()
   const styles = StyleSheet.create({
-    centralized: {
-      alignItems: 'center',
-      justifyContent: 'center',
+    container: {
+      ...atoms.py_xl,
+      ...atoms.flex_row,
+      ...atoms.justify_center,
+      ...atoms.gap_lg,
     },
-    row: {
-      flexDirection: 'row',
-      justifyContent: 'center',
-    },
-    actionIcon: {
-      justifyContent: 'center',
-      alignItems: 'center',
-      height: 56,
-      width: 56,
-      borderRadius: 28,
-      backgroundColor: color.primary_500,
+    centralized: {
+      ...atoms.align_center,
+      ...atoms.justify_center,
     },
     actionLabel: {
       ...atoms.pt_sm,
       ...atoms.body_3_sm_medium,
       color: color.gray_max,
     },
-    disabled: {
-      opacity: 0.5,
-    },
   })
 
-  const colors = {
-    actionColor: color.white_static,
-  }
-  return {styles, colors}
+  return {styles}
 }
 
 const useNavigateTo = () => {
diff --git a/apps/wallet-mobile/src/kernel/i18n/global-messages.ts b/apps/wallet-mobile/src/kernel/i18n/global-messages.ts
index 82bb70760d..2669e868d2 100644
--- a/apps/wallet-mobile/src/kernel/i18n/global-messages.ts
+++ b/apps/wallet-mobile/src/kernel/i18n/global-messages.ts
@@ -588,7 +588,7 @@ export const actionMessages = defineMessages({
   },
   exchange: {
     id: 'global.exchange',
-    defaultMessage: '!!!Buy/Sell ADA',
+    defaultMessage: '!!!Buy/Sell',
   },
 })
 
diff --git a/apps/wallet-mobile/src/kernel/i18n/locales/en-US.json b/apps/wallet-mobile/src/kernel/i18n/locales/en-US.json
index 4a6c87feaf..19ddf2771f 100644
--- a/apps/wallet-mobile/src/kernel/i18n/locales/en-US.json
+++ b/apps/wallet-mobile/src/kernel/i18n/locales/en-US.json
@@ -848,7 +848,7 @@
   "global.sign": "sign",
   "global.signTransaction": "Sign transaction",
   "global.spendingPassword": "Spending Password",
-  "global.exchange": "Buy/Sell ADA",
+  "global.exchange": "Buy/Sell",
   "global.staking.epochLabel": "Epoch",
   "global.staking.stakePoolHash": "Stake pool hash",
   "global.staking.stakePoolName": "Stake pool name",
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx b/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
index cb129e703d..4dc35344fd 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
@@ -17,7 +17,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Banner} from '../../components/Banner/Banner'
-import {Button} from '../../components/Button/Button'
+import {Button} from '../../components/Button/NewButton'
 import {useModal} from '../../components/Modal/ModalContext'
 import {Space} from '../../components/Space/Space'
 import {
@@ -156,8 +156,6 @@ export const Dashboard = () => {
             onPress={navigateTo.stakingCenter}
             title={intl.formatMessage(messages.stakingCenterButton)}
             disabled={meta.isReadOnly}
-            shelleyTheme
-            block
             testID="stakingCenterButton"
           />
         </Actions>
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx b/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
index c2010862e6..ff2604a2f5 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
@@ -4,9 +4,8 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ActivityIndicator, Linking, StyleSheet, View} from 'react-native'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button} from '../../components/Button/Button'
+import {Button, ButtonType} from '../../components/Button/NewButton'
 import {CopyButton} from '../../components/CopyButton'
-import {Space} from '../../components/Space/Space'
 import {Text} from '../../components/Text'
 import {TitledCard} from '../../components/TitledCard'
 import {useSelectedWallet} from '../../features/WalletManager/common/hooks/useSelectedWallet'
@@ -27,43 +26,23 @@ export const StakePoolInfo = ({stakePoolId}: {stakePoolId: string}) => {
   return (
     <View>
       <TitledCard title={strings.title} variant="poolInfo" testID="stakePoolInfoTitleCard">
-        <View>
+        <View style={styles.container}>
           <Text bold style={styles.poolName}>
             {formatStakepoolNameWithTicker(stakePoolInfoAndHistory.info.ticker, stakePoolInfoAndHistory.info.name) ??
               strings.unknownPool}
           </Text>
 
-          <Space height="xs" />
+          <CopyButton title={stakePoolId} value={stakePoolId} message={strings.copied} />
 
-          <View style={styles.poolIdBlock}>
-            <Text
-              numberOfLines={1}
-              ellipsizeMode="middle"
-              monospace
-              style={styles.poolId}
-              testID="stakePoolInfoPoolIdText"
-            >
-              {stakePoolId}
-            </Text>
-
-            <CopyButton value={stakePoolId} message={strings.copied} />
-          </View>
+          {!isEmptyString(homepage) && (
+            <Button
+              type={ButtonType.Secondary}
+              size="S"
+              onPress={() => Linking.openURL(homepage)}
+              title={strings.goToWebsiteButtonLabel}
+            />
+          )}
         </View>
-
-        {!isEmptyString(homepage) && (
-          <>
-            <Space height="lg" />
-
-            <View>
-              <Button
-                outlineOnLight
-                shelleyTheme
-                onPress={() => Linking.openURL(homepage)}
-                title={strings.goToWebsiteButtonLabel}
-              />
-            </View>
-          </>
-        )}
       </TitledCard>
 
       <View style={styles.warning}>
@@ -103,18 +82,13 @@ export const useStakePoolInfoAndHistory = (
 const useStyles = () => {
   const {color, atoms} = useTheme()
   const styles = StyleSheet.create({
+    container: {
+      ...atoms.gap_md,
+    },
     poolName: {
       ...atoms.body_1_lg_medium,
       color: color.text_gray_medium,
     },
-    poolIdBlock: {
-      ...atoms.flex_row,
-    },
-    poolId: {
-      color: color.text_gray_medium,
-      ...atoms.body_2_md_regular,
-      ...atoms.flex_1,
-    },
     warning: {
       ...atoms.p_sm,
     },
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
index 85bb51d5eb..7abf4f4687 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../components/Button/Button'
+import {Button, ButtonType} from '../../components/Button/NewButton'
 import {Icon} from '../../components/Icon'
 import {Space} from '../../components/Space/Space'
 import {Text} from '../../components/Text'
@@ -101,17 +101,15 @@ export const UserSummary = ({totalAdaSum, totalRewards, totalDelegated, onWithdr
 
         <Space height="lg" />
 
-        <View style={styles.row}>
-          <Button
-            disabled={disableWithdraw}
-            outlineOnLight
-            shelleyTheme
-            onPress={onWithdraw}
-            title={strings.withdrawButtonTitle}
-            style={styles.withdrawButton}
-            testID="userSummaryWithdrawButton"
-          />
-        </View>
+        <Button
+          type={ButtonType.Secondary}
+          disabled={disableWithdraw}
+          size="S"
+          style={styles.withdrawButton}
+          onPress={onWithdraw}
+          title={strings.withdrawButtonTitle}
+          testID="userSummaryWithdrawButton"
+        />
       </View>
     </TitledCard>
   )
@@ -142,7 +140,7 @@ const useStyles = () => {
       ...atoms.body_1_lg_medium,
     },
     withdrawButton: {
-      ...atoms.px_lg,
+      ...atoms.self_start,
     },
   })
 
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
index 7215493098..e9db7f3d49 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
@@ -4,8 +4,7 @@ import {useIntl} from 'react-intl'
 import {ActivityIndicator, StyleSheet, View} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button} from '../../../../components/Button/Button'
-import {Space} from '../../../../components/Space/Space'
+import {Button, ButtonType} from '../../../../components/Button/NewButton'
 import {TextInput} from '../../../../components/TextInput/TextInput'
 import {debugWalletInfo, features} from '../../../../kernel/features'
 import {confirmationMessages, txLabels} from '../../../../kernel/i18n/global-messages'
@@ -52,20 +51,14 @@ export const ConfirmTxWithPassword = ({wallet, onSuccess, onCancel, unsignedTx}:
 
       <View style={styles.buttons}>
         <Button
-          block
-          shelleyTheme
-          outlineOnLight
+          type={ButtonType.Secondary}
           onPress={() => onCancel()}
           title={intl.formatMessage(confirmationMessages.commonButtons.cancelButton)}
           disabled={isLoading}
           testID="cancelTxButton"
         />
 
-        <Space width="md" />
-
         <Button
-          block
-          shelleyTheme
           onPress={() => signAndSubmitTx({unsignedTx, password})}
           title={strings.confirmButton}
           disabled={isLoading}
@@ -113,6 +106,7 @@ const useStyles = () => {
       backgroundColor: color.bg_color_max,
       ...atoms.p_lg,
       ...atoms.flex_row,
+      ...atoms.gap_md,
     },
     scroll: {
       ...atoms.flex_1,
diff --git a/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json b/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
index 8cc265b059..f31e19998d 100644
--- a/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
+++ b/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Join the journey to improve Yoroi",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 299,
+      "line": 290,
       "column": 10,
-      "index": 7605
+      "index": 7442
     },
     "end": {
-      "line": 302,
+      "line": 293,
       "column": 3,
-      "index": 7698
+      "index": 7535
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Share user insights to help us fine tune Yoroi to better serve your needs.",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 303,
+      "line": 294,
       "column": 15,
-      "index": 7715
+      "index": 7552
     },
     "end": {
-      "line": 306,
+      "line": 297,
       "column": 3,
-      "index": 7854
+      "index": 7691
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Anonymous analytics data",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 307,
+      "line": 298,
       "column": 13,
-      "index": 7869
+      "index": 7706
     },
     "end": {
-      "line": 310,
+      "line": 301,
       "column": 3,
-      "index": 7956
+      "index": 7793
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!You can always opt-out via Settings",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 311,
+      "line": 302,
       "column": 10,
-      "index": 7968
+      "index": 7805
     },
     "end": {
-      "line": 314,
+      "line": 305,
       "column": 3,
-      "index": 8063
+      "index": 7900
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!We <b>cannot</b> access private keys",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 315,
+      "line": 306,
       "column": 11,
-      "index": 8076
+      "index": 7913
     },
     "end": {
-      "line": 318,
+      "line": 309,
       "column": 3,
-      "index": 8173
+      "index": 8010
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!We <b>are not</b> recording IP addresses",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 319,
+      "line": 310,
       "column": 8,
-      "index": 8183
+      "index": 8020
     },
     "end": {
-      "line": 322,
+      "line": 313,
       "column": 3,
-      "index": 8281
+      "index": 8118
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!We <b>do not</b> sell data",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 323,
+      "line": 314,
       "column": 10,
-      "index": 8293
+      "index": 8130
     },
     "end": {
-      "line": 326,
+      "line": 317,
       "column": 3,
-      "index": 8379
+      "index": 8216
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Learn more about user insights",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 327,
+      "line": 318,
       "column": 8,
-      "index": 8389
+      "index": 8226
     },
     "end": {
-      "line": 330,
+      "line": 321,
       "column": 3,
-      "index": 8477
+      "index": 8314
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Skip",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 331,
+      "line": 322,
       "column": 8,
-      "index": 8487
+      "index": 8324
     },
     "end": {
-      "line": 334,
+      "line": 325,
       "column": 3,
-      "index": 8549
+      "index": 8386
     }
   },
   {
@@ -139,14 +139,14 @@
     "defaultMessage": "!!!Accept",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 335,
+      "line": 326,
       "column": 10,
-      "index": 8561
+      "index": 8398
     },
     "end": {
-      "line": 338,
+      "line": 329,
       "column": 3,
-      "index": 8627
+      "index": 8464
     }
   },
   {
@@ -154,14 +154,14 @@
     "defaultMessage": "!!!Allow Yoroi analytics",
     "file": "src/components/Analytics/Analytics.tsx",
     "start": {
-      "line": 339,
+      "line": 330,
       "column": 10,
-      "index": 8639
+      "index": 8476
     },
     "end": {
-      "line": 342,
+      "line": 333,
       "column": 3,
-      "index": 8720
+      "index": 8557
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
index 9434513269..377715f37e 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Not now",
     "file": "src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx",
     "start": {
-      "line": 57,
+      "line": 55,
       "column": 16,
-      "index": 1725
+      "index": 1648
     },
     "end": {
-      "line": 60,
+      "line": 58,
       "column": 3,
-      "index": 1829
+      "index": 1752
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Link",
     "file": "src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx",
     "start": {
-      "line": 61,
+      "line": 59,
       "column": 14,
-      "index": 1845
+      "index": 1768
     },
     "end": {
-      "line": 64,
+      "line": 62,
       "column": 3,
-      "index": 1944
+      "index": 1867
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Use your fingerprint",
     "file": "src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx",
     "start": {
-      "line": 65,
+      "line": 63,
       "column": 11,
-      "index": 1957
+      "index": 1880
     },
     "end": {
-      "line": 68,
+      "line": 66,
       "column": 3,
-      "index": 2069
+      "index": 1992
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!for faster, easier access",
     "file": "src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx",
     "start": {
-      "line": 69,
+      "line": 67,
       "column": 15,
-      "index": 2086
+      "index": 2009
     },
     "end": {
-      "line": 72,
+      "line": 70,
       "column": 3,
-      "index": 2207
+      "index": 2130
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!to your Yoroi wallet",
     "file": "src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx",
     "start": {
-      "line": 73,
+      "line": 71,
       "column": 15,
-      "index": 2224
+      "index": 2147
     },
     "end": {
-      "line": 76,
+      "line": 74,
       "column": 3,
-      "index": 2340
+      "index": 2263
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/kernel/i18n/global-messages.json b/apps/wallet-mobile/translations/messages/src/kernel/i18n/global-messages.json
index 22478a0474..bce771c934 100644
--- a/apps/wallet-mobile/translations/messages/src/kernel/i18n/global-messages.json
+++ b/apps/wallet-mobile/translations/messages/src/kernel/i18n/global-messages.json
@@ -51,12 +51,12 @@
     "start": {
       "line": 831,
       "column": 10,
-      "index": 24297
+      "index": 24293
     },
     "end": {
       "line": 834,
       "column": 3,
-      "index": 24360
+      "index": 24356
     }
   },
   {
@@ -1221,12 +1221,12 @@
     "start": {
       "line": 740,
       "column": 16,
-      "index": 22065
+      "index": 22061
     },
     "end": {
       "line": 743,
       "column": 3,
-      "index": 22149
+      "index": 22145
     }
   },
   {
@@ -1716,17 +1716,17 @@
     "start": {
       "line": 724,
       "column": 14,
-      "index": 21713
+      "index": 21709
     },
     "end": {
       "line": 727,
       "column": 3,
-      "index": 21785
+      "index": 21781
     }
   },
   {
     "id": "global.exchange",
-    "defaultMessage": "!!!Buy/Sell ADA",
+    "defaultMessage": "!!!Buy/Sell",
     "file": "src/kernel/i18n/global-messages.ts",
     "start": {
       "line": 589,
@@ -1736,7 +1736,7 @@
     "end": {
       "line": 592,
       "column": 3,
-      "index": 18549
+      "index": 18545
     }
   },
   {
@@ -1746,12 +1746,12 @@
     "start": {
       "line": 596,
       "column": 29,
-      "index": 18630
+      "index": 18626
     },
     "end": {
       "line": 599,
       "column": 3,
-      "index": 18696
+      "index": 18692
     }
   },
   {
@@ -1761,12 +1761,12 @@
     "start": {
       "line": 600,
       "column": 29,
-      "index": 18727
+      "index": 18723
     },
     "end": {
       "line": 603,
       "column": 3,
-      "index": 18793
+      "index": 18789
     }
   },
   {
@@ -1776,12 +1776,12 @@
     "start": {
       "line": 604,
       "column": 29,
-      "index": 18824
+      "index": 18820
     },
     "end": {
       "line": 607,
       "column": 3,
-      "index": 18890
+      "index": 18886
     }
   },
   {
@@ -1791,12 +1791,12 @@
     "start": {
       "line": 608,
       "column": 29,
-      "index": 18921
+      "index": 18917
     },
     "end": {
       "line": 611,
       "column": 3,
-      "index": 18987
+      "index": 18983
     }
   },
   {
@@ -1806,12 +1806,12 @@
     "start": {
       "line": 612,
       "column": 29,
-      "index": 19018
+      "index": 19014
     },
     "end": {
       "line": 615,
       "column": 3,
-      "index": 19084
+      "index": 19080
     }
   },
   {
@@ -1821,12 +1821,12 @@
     "start": {
       "line": 616,
       "column": 29,
-      "index": 19115
+      "index": 19111
     },
     "end": {
       "line": 619,
       "column": 3,
-      "index": 19181
+      "index": 19177
     }
   },
   {
@@ -1836,12 +1836,12 @@
     "start": {
       "line": 620,
       "column": 29,
-      "index": 19212
+      "index": 19208
     },
     "end": {
       "line": 623,
       "column": 3,
-      "index": 19278
+      "index": 19274
     }
   },
   {
@@ -1851,12 +1851,12 @@
     "start": {
       "line": 624,
       "column": 29,
-      "index": 19309
+      "index": 19305
     },
     "end": {
       "line": 627,
       "column": 3,
-      "index": 19375
+      "index": 19371
     }
   },
   {
@@ -1866,12 +1866,12 @@
     "start": {
       "line": 628,
       "column": 29,
-      "index": 19406
+      "index": 19402
     },
     "end": {
       "line": 631,
       "column": 3,
-      "index": 19472
+      "index": 19468
     }
   },
   {
@@ -1881,12 +1881,12 @@
     "start": {
       "line": 636,
       "column": 28,
-      "index": 19617
+      "index": 19613
     },
     "end": {
       "line": 639,
       "column": 3,
-      "index": 19679
+      "index": 19675
     }
   },
   {
@@ -1896,12 +1896,12 @@
     "start": {
       "line": 640,
       "column": 37,
-      "index": 19718
+      "index": 19714
     },
     "end": {
       "line": 643,
       "column": 3,
-      "index": 19778
+      "index": 19774
     }
   },
   {
@@ -1911,12 +1911,12 @@
     "start": {
       "line": 644,
       "column": 38,
-      "index": 19818
+      "index": 19814
     },
     "end": {
       "line": 647,
       "column": 3,
-      "index": 19880
+      "index": 19876
     }
   },
   {
@@ -1926,12 +1926,12 @@
     "start": {
       "line": 651,
       "column": 12,
-      "index": 19930
+      "index": 19926
     },
     "end": {
       "line": 654,
       "column": 3,
-      "index": 19997
+      "index": 19993
     }
   },
   {
@@ -1941,12 +1941,12 @@
     "start": {
       "line": 655,
       "column": 10,
-      "index": 20009
+      "index": 20005
     },
     "end": {
       "line": 658,
       "column": 3,
-      "index": 20072
+      "index": 20068
     }
   },
   {
@@ -1956,12 +1956,12 @@
     "start": {
       "line": 659,
       "column": 14,
-      "index": 20088
+      "index": 20084
     },
     "end": {
       "line": 662,
       "column": 3,
-      "index": 20159
+      "index": 20155
     }
   },
   {
@@ -1971,12 +1971,12 @@
     "start": {
       "line": 663,
       "column": 11,
-      "index": 20172
+      "index": 20168
     },
     "end": {
       "line": 666,
       "column": 3,
-      "index": 20237
+      "index": 20233
     }
   },
   {
@@ -1986,12 +1986,12 @@
     "start": {
       "line": 667,
       "column": 9,
-      "index": 20248
+      "index": 20244
     },
     "end": {
       "line": 670,
       "column": 3,
-      "index": 20309
+      "index": 20305
     }
   },
   {
@@ -2001,12 +2001,12 @@
     "start": {
       "line": 671,
       "column": 7,
-      "index": 20318
+      "index": 20314
     },
     "end": {
       "line": 674,
       "column": 3,
-      "index": 20375
+      "index": 20371
     }
   },
   {
@@ -2016,12 +2016,12 @@
     "start": {
       "line": 675,
       "column": 11,
-      "index": 20388
+      "index": 20384
     },
     "end": {
       "line": 678,
       "column": 3,
-      "index": 20511
+      "index": 20507
     }
   },
   {
@@ -2031,12 +2031,12 @@
     "start": {
       "line": 679,
       "column": 13,
-      "index": 20526
+      "index": 20522
     },
     "end": {
       "line": 682,
       "column": 3,
-      "index": 20626
+      "index": 20622
     }
   },
   {
@@ -2046,12 +2046,12 @@
     "start": {
       "line": 683,
       "column": 12,
-      "index": 20640
+      "index": 20636
     },
     "end": {
       "line": 686,
       "column": 3,
-      "index": 20708
+      "index": 20704
     }
   },
   {
@@ -2061,12 +2061,12 @@
     "start": {
       "line": 687,
       "column": 26,
-      "index": 20736
+      "index": 20732
     },
     "end": {
       "line": 690,
       "column": 3,
-      "index": 20846
+      "index": 20842
     }
   },
   {
@@ -2076,12 +2076,12 @@
     "start": {
       "line": 691,
       "column": 35,
-      "index": 20883
+      "index": 20879
     },
     "end": {
       "line": 694,
       "column": 3,
-      "index": 21002
+      "index": 20998
     }
   },
   {
@@ -2091,12 +2091,12 @@
     "start": {
       "line": 695,
       "column": 31,
-      "index": 21035
+      "index": 21031
     },
     "end": {
       "line": 698,
       "column": 3,
-      "index": 21128
+      "index": 21124
     }
   },
   {
@@ -2107,12 +2107,12 @@
     "start": {
       "line": 699,
       "column": 14,
-      "index": 21144
+      "index": 21140
     },
     "end": {
       "line": 703,
       "column": 3,
-      "index": 21283
+      "index": 21279
     }
   },
   {
@@ -2122,12 +2122,12 @@
     "start": {
       "line": 704,
       "column": 17,
-      "index": 21302
+      "index": 21298
     },
     "end": {
       "line": 707,
       "column": 3,
-      "index": 21380
+      "index": 21376
     }
   },
   {
@@ -2137,12 +2137,12 @@
     "start": {
       "line": 708,
       "column": 7,
-      "index": 21389
+      "index": 21385
     },
     "end": {
       "line": 711,
       "column": 3,
-      "index": 21462
+      "index": 21458
     }
   },
   {
@@ -2152,12 +2152,12 @@
     "start": {
       "line": 712,
       "column": 6,
-      "index": 21470
+      "index": 21466
     },
     "end": {
       "line": 715,
       "column": 3,
-      "index": 21525
+      "index": 21521
     }
   },
   {
@@ -2167,12 +2167,12 @@
     "start": {
       "line": 716,
       "column": 9,
-      "index": 21536
+      "index": 21532
     },
     "end": {
       "line": 719,
       "column": 3,
-      "index": 21597
+      "index": 21593
     }
   },
   {
@@ -2182,12 +2182,12 @@
     "start": {
       "line": 720,
       "column": 18,
-      "index": 21617
+      "index": 21613
     },
     "end": {
       "line": 723,
       "column": 3,
-      "index": 21697
+      "index": 21693
     }
   },
   {
@@ -2197,12 +2197,12 @@
     "start": {
       "line": 728,
       "column": 14,
-      "index": 21801
+      "index": 21797
     },
     "end": {
       "line": 731,
       "column": 3,
-      "index": 21872
+      "index": 21868
     }
   },
   {
@@ -2212,12 +2212,12 @@
     "start": {
       "line": 732,
       "column": 14,
-      "index": 21888
+      "index": 21884
     },
     "end": {
       "line": 735,
       "column": 3,
-      "index": 21962
+      "index": 21958
     }
   },
   {
@@ -2227,12 +2227,12 @@
     "start": {
       "line": 736,
       "column": 13,
-      "index": 21977
+      "index": 21973
     },
     "end": {
       "line": 739,
       "column": 3,
-      "index": 22047
+      "index": 22043
     }
   },
   {
@@ -2242,12 +2242,12 @@
     "start": {
       "line": 744,
       "column": 9,
-      "index": 22160
+      "index": 22156
     },
     "end": {
       "line": 747,
       "column": 3,
-      "index": 22221
+      "index": 22217
     }
   },
   {
@@ -2257,12 +2257,12 @@
     "start": {
       "line": 748,
       "column": 12,
-      "index": 22235
+      "index": 22231
     },
     "end": {
       "line": 751,
       "column": 3,
-      "index": 22303
+      "index": 22299
     }
   },
   {
@@ -2272,12 +2272,12 @@
     "start": {
       "line": 752,
       "column": 17,
-      "index": 22322
+      "index": 22318
     },
     "end": {
       "line": 755,
       "column": 3,
-      "index": 22409
+      "index": 22405
     }
   },
   {
@@ -2287,12 +2287,12 @@
     "start": {
       "line": 756,
       "column": 17,
-      "index": 22428
+      "index": 22424
     },
     "end": {
       "line": 759,
       "column": 3,
-      "index": 22515
+      "index": 22511
     }
   },
   {
@@ -2302,12 +2302,12 @@
     "start": {
       "line": 760,
       "column": 37,
-      "index": 22554
+      "index": 22550
     },
     "end": {
       "line": 763,
       "column": 3,
-      "index": 22689
+      "index": 22685
     }
   },
   {
@@ -2317,12 +2317,12 @@
     "start": {
       "line": 764,
       "column": 34,
-      "index": 22725
+      "index": 22721
     },
     "end": {
       "line": 767,
       "column": 3,
-      "index": 22873
+      "index": 22869
     }
   },
   {
@@ -2332,12 +2332,12 @@
     "start": {
       "line": 768,
       "column": 15,
-      "index": 22890
+      "index": 22886
     },
     "end": {
       "line": 771,
       "column": 3,
-      "index": 22965
+      "index": 22961
     }
   },
   {
@@ -2347,12 +2347,12 @@
     "start": {
       "line": 772,
       "column": 15,
-      "index": 22982
+      "index": 22978
     },
     "end": {
       "line": 775,
       "column": 3,
-      "index": 23066
+      "index": 23062
     }
   },
   {
@@ -2362,12 +2362,12 @@
     "start": {
       "line": 776,
       "column": 23,
-      "index": 23091
+      "index": 23087
     },
     "end": {
       "line": 782,
       "column": 3,
-      "index": 23339
+      "index": 23335
     }
   },
   {
@@ -2377,12 +2377,12 @@
     "start": {
       "line": 783,
       "column": 8,
-      "index": 23349
+      "index": 23345
     },
     "end": {
       "line": 786,
       "column": 3,
-      "index": 23409
+      "index": 23405
     }
   },
   {
@@ -2392,12 +2392,12 @@
     "start": {
       "line": 787,
       "column": 10,
-      "index": 23421
+      "index": 23417
     },
     "end": {
       "line": 790,
       "column": 3,
-      "index": 23485
+      "index": 23481
     }
   },
   {
@@ -2407,12 +2407,12 @@
     "start": {
       "line": 791,
       "column": 10,
-      "index": 23497
+      "index": 23493
     },
     "end": {
       "line": 794,
       "column": 3,
-      "index": 23561
+      "index": 23557
     }
   },
   {
@@ -2422,12 +2422,12 @@
     "start": {
       "line": 795,
       "column": 13,
-      "index": 23576
+      "index": 23572
     },
     "end": {
       "line": 798,
       "column": 3,
-      "index": 23646
+      "index": 23642
     }
   },
   {
@@ -2437,12 +2437,12 @@
     "start": {
       "line": 799,
       "column": 9,
-      "index": 23657
+      "index": 23653
     },
     "end": {
       "line": 802,
       "column": 3,
-      "index": 23717
+      "index": 23713
     }
   },
   {
@@ -2452,12 +2452,12 @@
     "start": {
       "line": 803,
       "column": 9,
-      "index": 23728
+      "index": 23724
     },
     "end": {
       "line": 806,
       "column": 3,
-      "index": 23790
+      "index": 23786
     }
   },
   {
@@ -2467,12 +2467,12 @@
     "start": {
       "line": 807,
       "column": 7,
-      "index": 23799
+      "index": 23795
     },
     "end": {
       "line": 810,
       "column": 3,
-      "index": 23856
+      "index": 23852
     }
   },
   {
@@ -2482,12 +2482,12 @@
     "start": {
       "line": 811,
       "column": 17,
-      "index": 23875
+      "index": 23871
     },
     "end": {
       "line": 814,
       "column": 3,
-      "index": 23953
+      "index": 23949
     }
   },
   {
@@ -2497,12 +2497,12 @@
     "start": {
       "line": 815,
       "column": 21,
-      "index": 23976
+      "index": 23972
     },
     "end": {
       "line": 818,
       "column": 3,
-      "index": 24063
+      "index": 24059
     }
   },
   {
@@ -2512,12 +2512,12 @@
     "start": {
       "line": 819,
       "column": 12,
-      "index": 24077
+      "index": 24073
     },
     "end": {
       "line": 822,
       "column": 3,
-      "index": 24144
+      "index": 24140
     }
   },
   {
@@ -2527,12 +2527,12 @@
     "start": {
       "line": 823,
       "column": 8,
-      "index": 24154
+      "index": 24150
     },
     "end": {
       "line": 826,
       "column": 3,
-      "index": 24213
+      "index": 24209
     }
   },
   {
@@ -2542,12 +2542,12 @@
     "start": {
       "line": 827,
       "column": 9,
-      "index": 24224
+      "index": 24220
     },
     "end": {
       "line": 830,
       "column": 3,
-      "index": 24285
+      "index": 24281
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
index 9323db804c..e05e5a95d2 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Go to Staking Center",
     "file": "src/legacy/Dashboard/Dashboard.tsx",
     "start": {
-      "line": 232,
+      "line": 230,
       "column": 23,
-      "index": 7453
+      "index": 7413
     },
     "end": {
-      "line": 235,
+      "line": 233,
       "column": 3,
-      "index": 7586
+      "index": 7546
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
index bb34e439ce..54f0b45bb6 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Stake pool delegated",
     "file": "src/legacy/Dashboard/StakePoolInfo.tsx",
     "start": {
-      "line": 131,
+      "line": 105,
       "column": 9,
-      "index": 3779
+      "index": 3215
     },
     "end": {
-      "line": 134,
+      "line": 108,
       "column": 3,
-      "index": 3900
+      "index": 3336
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!If you just delegated to a new stake pool it may  take a couple of minutes for the network to process your request.",
     "file": "src/legacy/Dashboard/StakePoolInfo.tsx",
     "start": {
-      "line": 135,
+      "line": 109,
       "column": 11,
-      "index": 3913
+      "index": 3349
     },
     "end": {
-      "line": 140,
+      "line": 114,
       "column": 3,
-      "index": 4148
+      "index": 3584
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Go to website",
     "file": "src/legacy/Dashboard/StakePoolInfo.tsx",
     "start": {
-      "line": 141,
+      "line": 115,
       "column": 26,
-      "index": 4176
+      "index": 3612
     },
     "end": {
-      "line": 144,
+      "line": 118,
       "column": 3,
-      "index": 4311
+      "index": 3747
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Copied!",
     "file": "src/legacy/Dashboard/StakePoolInfo.tsx",
     "start": {
-      "line": 145,
+      "line": 119,
       "column": 10,
-      "index": 4323
+      "index": 3759
     },
     "end": {
-      "line": 148,
+      "line": 122,
       "column": 3,
-      "index": 4432
+      "index": 3868
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Unknown pool",
     "file": "src/legacy/Dashboard/StakePoolInfo.tsx",
     "start": {
-      "line": 149,
+      "line": 123,
       "column": 15,
-      "index": 4449
+      "index": 3885
     },
     "end": {
-      "line": 152,
+      "line": 126,
       "column": 3,
-      "index": 4568
+      "index": 4004
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
index 75157f2b1f..1bdc0ad25c 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Your Summary",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 165,
+      "line": 162,
       "column": 9,
-      "index": 4928
+      "index": 4849
     },
     "end": {
-      "line": 168,
+      "line": 165,
       "column": 3,
-      "index": 5030
+      "index": 4951
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Total Rewards",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 169,
+      "line": 166,
       "column": 16,
-      "index": 5048
+      "index": 4969
     },
     "end": {
-      "line": 172,
+      "line": 169,
       "column": 3,
-      "index": 5158
+      "index": 5079
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Total Delegated",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 173,
+      "line": 170,
       "column": 18,
-      "index": 5178
+      "index": 5099
     },
     "end": {
-      "line": 176,
+      "line": 173,
       "column": 3,
-      "index": 5292
+      "index": 5213
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Withdraw",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 177,
+      "line": 174,
       "column": 23,
-      "index": 5317
+      "index": 5238
     },
     "end": {
-      "line": 180,
+      "line": 177,
       "column": 3,
-      "index": 5429
+      "index": 5350
     }
   }
 ]
\ No newline at end of file

From b4a777a300e893361b51d6d8d43f9f55b37da3e2 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 15:30:20 +0200
Subject: [PATCH 03/16] button refactor part 3

---
 .../src/components/Boundary/Boundary.tsx      |  5 +-
 .../src/components/Button/Button.tsx          | 67 -----------------
 .../CameraCodeScanner.stories.tsx             |  2 +-
 .../ConfirmTx/ConfirmTx.stories.tsx           |  1 -
 .../src/components/ConfirmTx/ConfirmTx.tsx    |  3 +-
 .../ConfirmTxWithSpendingPasswordModal.tsx    |  3 +-
 .../ErrorBoundary/ErrorBoundary.tsx           |  4 +-
 .../src/components/ErrorModal/ErrorModal.tsx  | 10 +--
 .../HideableText/HideableText.stories.tsx     |  2 +-
 .../OsAuthScreen/OsAuthScreen.stories.tsx     |  2 +-
 .../Auth/OsLoginScreen/OsLoginScreen.tsx      |  4 +-
 .../Auth/PinInput/PinInput.stories.tsx        |  2 +-
 .../Claim/useCases/ShowSuccessScreen.tsx      |  4 +-
 .../src/features/Dev/DeveloperScreen.tsx      |  3 +-
 .../common/ConfirmConnectionModal.stories.tsx |  6 +-
 .../common/ConfirmConnectionModal.tsx         |  4 +-
 .../Discover/common/HWNotSupportedModal.tsx   |  4 +-
 .../common/UnverifiedDappModal.stories.tsx    |  4 +-
 .../Discover/common/UnverifiedDappModal.tsx   |  4 +-
 .../ReviewTransaction/ReviewTransaction.tsx   |  4 +-
 .../SelectDappFromList/WelcomeDAppModal.tsx   |  4 +-
 .../ShowBuyBanner/PreprodFaucetBanner.tsx     |  3 +-
 .../ShowBuyBanner/SanchonetFaucetBanner.tsx   |  3 +-
 .../CreateExchangeButton.tsx                  |  4 +-
 .../LoadingLink/ErrorScreen.tsx               | 10 +--
 .../ShowExchangeResultOrderScreen.tsx         |  4 +-
 .../DarkThemeAnnouncement.tsx                 |  4 +-
 .../InitialScreen/InitialScreen.tsx           | 10 +--
 .../TermsOfServiceChangedScreen.tsx           |  4 +-
 .../useCases/ListMultipleAddressesScreen.tsx  |  3 +-
 .../common/InsufficientFundsModal.tsx         |  7 +-
 .../useCases/ConfirmPin/ConfirmPin.tsx        |  4 +-
 .../ConfirmVotingTx/ConfirmVotingTx.tsx       |  4 +-
 .../useCases/DisplayPin/DisplayPin.tsx        |  4 +-
 .../DownloadCatalystAppScreen.tsx             |  9 +--
 .../useCases/ShowQrCode/ShowQrCode.tsx        |  4 +-
 .../OpenDeviceAppSettingsButton.tsx           |  6 +-
 .../ConfirmTx/FailedTx/FailedTxScreen.tsx     |  9 +--
 .../SubmittedTx/SubmittedTxScreen.tsx         |  4 +-
 .../EditAmount/EditAmountScreen.tsx           |  3 +-
 .../ListAmountsToSendScreen.tsx               |  9 +--
 .../StartMultiTokenTxScreen.tsx               | 10 +--
 .../ChangeNetwork/ChangeNetworkScreen.tsx     |  3 +-
 .../ChangePassword/ChangePasswordScreen.tsx   |  3 +-
 .../DisableEasyConfirmationScreen.tsx         |  4 +-
 .../EnableEasyConfirmationScreen.tsx          |  3 +-
 .../ConfirmTx/FailedTx/FailedTxScreen.tsx     |  4 +-
 .../SubmittedTx/SubmittedTxScreen.tsx         |  4 +-
 .../ManageCollateralScreen.tsx                | 11 +--
 .../RemoveWallet/RemoveWalletScreen.tsx       |  2 +-
 .../RenameWalletScreen/RenameWalletScreen.tsx |  3 +-
 .../WalletDuplicatedModal.tsx                 |  2 +-
 .../SaveReadOnlyWalletScreen.tsx              |  4 --
 .../legacy/WalletNameForm/WalletNameForm.tsx  | 10 +--
 .../AboutRecoveryPhraseScreen.tsx             |  3 +-
 .../CreateWallet/RecoveryPhraseScreen.tsx     |  4 +-
 .../VerifyRecoveryPhraseScreen.tsx            |  3 +-
 .../CreateWallet/WalletDetailsScreen.tsx      |  6 +-
 .../RestoreHwWallet/CheckNanoXScreen.tsx      |  4 +-
 .../RestoreHwWallet/SaveNanoXScreen.tsx       |  7 +-
 .../RestoreWalletDetailsScreen.tsx            |  7 +-
 .../RestoreWallet/RestoreWalletScreen.tsx     |  9 +--
 .../useCases/ConfirmTx/ConfirmTxScreen.tsx    |  4 +-
 .../EnterDrepIdModal/EnterDrepIdModal.tsx     |  3 +-
 .../useCases/FailedTx/FailedTxScreen.tsx      |  8 +--
 .../useCases/NoFunds/NoFundsScreen.tsx        |  8 +--
 .../NotSupportedCardanoAppVersion.tsx         |  4 +-
 .../useCases/SuccessTx/SuccessTxScreen.tsx    |  8 +--
 .../WithdrawWarningModal.tsx                  |  4 +-
 .../ConfirmWithSpendingPassword.tsx           |  3 +-
 .../ServiceUnavailable/ServiceUnavailable.tsx |  4 +-
 .../ConfirmTxScreen/ConfirmTxScreen.tsx       |  3 +-
 .../ShowFailedTxScreen/ShowFailedTxScreen.tsx |  4 +-
 .../EditSlippageScreen/EditSlippageScreen.tsx | 10 +--
 .../CreateOrder/StartSwapOrderScreen.tsx      |  4 +-
 .../useCases/TxDetails/TxDetails.tsx          |  3 +-
 .../useCases/TxHistory/WarningBanner.tsx      |  2 +-
 .../SelectWalletFromListScreen.tsx            |  2 +-
 .../WithdrawStakingRewards.tsx                |  3 +-
 .../legacy/HW/LedgerConnect/LedgerConnect.tsx |  3 +-
 .../LedgerTransportSwitchModal.tsx            | 12 +---
 .../DelegationConfirmation.tsx                |  1 -
 .../Staking/PoolDetails/PoolDetailScreen.tsx  |  3 +-
 .../PoolTransition/PoolTransitionNotice.tsx   |  4 +-
 .../src/components/ErrorModal/ErrorModal.json | 16 ++---
 .../Auth/OsLoginScreen/OsLoginScreen.json     |  4 +-
 .../Auth/PinInput/PinInput.stories.json       |  4 +-
 .../DarkThemeAnnouncement.json                | 16 ++---
 .../ListAmountsToSendScreen.json              |  8 +--
 .../ChangePassword/ChangePasswordScreen.json  | 48 ++++++-------
 .../DisableEasyConfirmationScreen.json        |  8 +--
 .../EnableEasyConfirmationScreen.json         | 32 ++++-----
 .../RemoveWallet/RemoveWalletScreen.json      | 28 ++++----
 .../RenameWalletScreen.json                   | 16 ++---
 .../SaveReadOnlyWalletScreen.json             | 40 +++++------
 .../legacy/WalletNameForm/WalletNameForm.json | 16 ++---
 .../src/legacy/Dashboard/UserSummary.json     | 32 ++++-----
 .../WithdrawStakingRewards.json               | 72 +++++++++----------
 .../HW/LedgerConnect/LedgerConnect.json       | 32 ++++-----
 .../LedgerTransportSwitchModal.json           | 64 ++++++++---------
 .../DelegationConfirmation.json               | 32 ++++-----
 .../Staking/PoolDetails/PoolDetailScreen.json | 56 +++++++--------
 102 files changed, 397 insertions(+), 583 deletions(-)
 delete mode 100644 apps/wallet-mobile/src/components/Button/Button.tsx

diff --git a/apps/wallet-mobile/src/components/Boundary/Boundary.tsx b/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
index b7add7b217..233a4ce926 100644
--- a/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
+++ b/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
@@ -11,7 +11,7 @@ import {useQueryErrorResetBoundary} from 'react-query'
 
 import image from '../../assets/img/error.png'
 import {LocalizableError} from '../../kernel/i18n/LocalizableError'
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {Space} from '../Space/Space'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
@@ -133,7 +133,6 @@ const FullErrorFallback = ({error, resetErrorBoundary, reset = true, debug}: Err
       {reset && (
         <Button
           title="Try again"
-          shelleyTheme
           onPress={() => {
             LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
             resetErrorBoundary()
@@ -163,7 +162,6 @@ const LargeErrorFallback = ({error, resetErrorBoundary, reset = true, debug}: Er
       {reset && (
         <Button
           title="Try again"
-          shelleyTheme
           onPress={() => {
             LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
             resetErrorBoundary()
@@ -190,7 +188,6 @@ const SmallErrorFallback = ({error, resetErrorBoundary, reset = true, debug}: Er
 
       {reset && (
         <Button
-          shelleyTheme
           title="Try again"
           onPress={() => {
             LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut)
diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
deleted file mode 100644
index 2eca9e9f2a..0000000000
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import {useTheme} from '@yoroi/theme'
-import React from 'react'
-import {StyleSheet, TextStyle, TouchableOpacity, TouchableOpacityProps, View, ViewStyle} from 'react-native'
-
-import {Text} from '../Text'
-
-export type ButtonProps = {
-  title: string
-  containerStyle?: ViewStyle
-  block?: boolean
-  shelleyTheme?: boolean
-  textStyles?: TextStyle
-} & TouchableOpacityProps
-
-export const Button = (props: ButtonProps) => {
-  const {onPress, title, block, style, containerStyle, shelleyTheme, textStyles, ...rest} = props
-
-  const {styles} = useStyles()
-
-  return (
-    <TouchableOpacity onPress={onPress} style={[block && styles.block, containerStyle]} activeOpacity={0.5} {...rest}>
-      <View
-        style={[styles.button, props.disabled && styles.buttonDisabled, shelleyTheme && styles.shelleyTheme, style]}
-      >
-        <Text style={[styles.text, props.disabled && styles.buttonDisabledText, textStyles]}>{title}</Text>
-      </View>
-    </TouchableOpacity>
-  )
-}
-
-const useStyles = () => {
-  const {color, atoms} = useTheme()
-
-  const styles = StyleSheet.create({
-    block: {
-      flex: 1,
-    },
-    button: {
-      backgroundColor: color.secondary_500,
-      minHeight: 48,
-      maxHeight: 54,
-      borderRadius: 8,
-      flexDirection: 'row',
-      alignItems: 'center',
-      justifyContent: 'center',
-    },
-    text: {
-      color: color.white_static,
-      ...atoms.body_2_md_medium,
-      ...atoms.p_sm,
-      textAlign: 'center',
-      textTransform: 'uppercase',
-    },
-
-    buttonDisabled: {
-      opacity: 0.5,
-    },
-    buttonDisabledText: {
-      color: color.gray_min,
-    },
-    shelleyTheme: {
-      backgroundColor: color.primary_500,
-    },
-  })
-
-  return {styles} as const
-}
diff --git a/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx b/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
index 12c5f69a2e..91158b38a5 100644
--- a/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
+++ b/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
@@ -5,7 +5,7 @@ import {Camera} from 'expo-camera'
 import React from 'react'
 import {Text, View} from 'react-native'
 
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {Spacer} from '../Spacer/Spacer'
 import {CameraCodeScanner} from './CameraCodeScanner'
 
diff --git a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.stories.tsx b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.stories.tsx
index 5a846330d3..7feb653892 100644
--- a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.stories.tsx
+++ b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.stories.tsx
@@ -47,7 +47,6 @@ storiesOf('ConfirmTx', module)
           useUSB={false}
           buttonProps={{
             title: 'DELEGATE',
-            shelleyTheme: true,
           }}
         />
       </WalletManagerProviderMock>
diff --git a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
index df591661cb..01540ed500 100644
--- a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
+++ b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
@@ -17,7 +17,7 @@ import {useSubmitTx} from '../../yoroi-wallets/hooks'
 import {withBLE, withUSB} from '../../yoroi-wallets/hw/hwWallet'
 import {YoroiSignedTx, YoroiUnsignedTx} from '../../yoroi-wallets/types/yoroi'
 import {delay} from '../../yoroi-wallets/utils/timeUtils'
-import {Button, ButtonProps} from '../Button/Button'
+import {Button, ButtonProps} from '../Button/NewButton'
 import {ValidatedTextInput} from '../ValidatedTextInput'
 import {Dialog, Step as DialogStep} from './Dialog'
 
@@ -290,7 +290,6 @@ export const ConfirmTx = ({
           {...buttonProps}
           disabled={isConfirmationDisabled || isProcessing || disabled}
           testID="confirmTxButton"
-          shelleyTheme
         />
       </View>
 
diff --git a/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx b/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
index 7114b3880a..a1dbb64938 100644
--- a/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
+++ b/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
@@ -7,7 +7,7 @@ import {useSelectedWallet} from '../../features/WalletManager/common/hooks/useSe
 import {debugWalletInfo, features} from '../../kernel/features'
 import {useSignTxWithPassword, useSubmitTx} from '../../yoroi-wallets/hooks'
 import {YoroiSignedTx, YoroiUnsignedTx} from '../../yoroi-wallets/types/yoroi'
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
 import {Checkmark, TextInput} from '../TextInput/TextInput'
@@ -73,7 +73,6 @@ export const ConfirmTxWithSpendingPasswordModal = ({onSuccess, unsignedTx, onErr
       <View style={styles.actions}>
         <Button
           testID="confirmButton"
-          shelleyTheme
           title={strings.sign}
           onPress={() => onSubmit?.(spendingPassword)}
           disabled={spendingPassword.length === 0}
diff --git a/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx b/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
index e33dfb5582..d733482e2c 100644
--- a/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
+++ b/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
@@ -4,7 +4,7 @@ import {BackHandler, Image, Platform, ScrollView, StyleSheet, Text, View} from '
 
 import errorImage from '../../assets/img/error.png'
 import {logger} from '../../kernel/logger/logger'
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {CopyButton} from '../CopyButton'
 import {Spacer} from '../Spacer/Spacer'
 import {ExpandableItem} from './ExpandableItem'
@@ -84,7 +84,7 @@ const ErrorView = ({state}: {state: State}) => {
 
       {Platform.OS === 'android' && (
         <View style={{padding: 16}}>
-          <Button shelleyTheme onPress={() => BackHandler.exitApp()} title="OK" style={{width: '100%'}} />
+          <Button onPress={() => BackHandler.exitApp()} title="OK" style={{width: '100%'}} />
         </View>
       )}
     </View>
diff --git a/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx b/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
index 172b54691c..309ccbd2a1 100644
--- a/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
+++ b/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
@@ -6,7 +6,7 @@ import {Image, LayoutAnimation, ScrollView, StyleSheet, Text, TouchableOpacity,
 import image from '../../assets/img/error.png'
 import globalMessages, {errorMessages} from '../../kernel/i18n/global-messages'
 import {isEmptyString} from '../../kernel/utils'
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {Icon} from '../Icon'
 import {Modal} from '../legacy/Modal/Modal'
 
@@ -63,13 +63,7 @@ export const ErrorView = ({title, errorMessage, errorLogs, onDismiss}: ErrorView
         </View>
       )}
 
-      <Button
-        block
-        shelleyTheme
-        onPress={onDismiss}
-        title={intl.formatMessage(globalMessages.close)}
-        testID="closeErrorModalButton"
-      />
+      <Button onPress={onDismiss} title={intl.formatMessage(globalMessages.close)} testID="closeErrorModalButton" />
     </ScrollView>
   )
 }
diff --git a/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx b/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
index 1146d2ac55..7490866166 100644
--- a/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
+++ b/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
@@ -4,7 +4,7 @@ import {StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {usePrivacyMode} from '../../features/Settings/PrivacyMode/PrivacyMode'
-import {Button} from '../Button/Button'
+import {Button} from '../Button/NewButton'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
 import {HideableText} from './HideableText'
diff --git a/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx b/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
index c2b03ebe39..e2a0f0d785 100644
--- a/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
+++ b/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
@@ -2,7 +2,7 @@ import {action} from '@storybook/addon-actions'
 import {storiesOf} from '@storybook/react-native'
 import React from 'react'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {OsAuthScreen} from './OsAuthScreen'
 
 storiesOf('OsAuthScreen', module)
diff --git a/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx b/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
index c2a517765a..426455e000 100644
--- a/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
+++ b/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {logger} from '../../../kernel/logger/logger'
 import {useAuth} from '../AuthProvider'
 import {useAuthWithOs} from '../common/hooks'
@@ -31,7 +31,7 @@ export const OsLoginScreen = () => {
       </MiddleSection>
 
       <BottomSection>
-        <Button title={strings.title} disabled={isLoading} shelleyTheme onPress={() => authWithOs()} />
+        <Button title={strings.title} disabled={isLoading} onPress={() => authWithOs()} />
       </BottomSection>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx b/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
index 79d11cf444..d8f8569ec1 100644
--- a/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
+++ b/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {PIN_LENGTH} from '../common/constants'
 import {PinInput, PinInputRef} from './PinInput'
 
diff --git a/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx b/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
index 42def7224c..b6b45b1e2f 100644
--- a/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
+++ b/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
@@ -6,7 +6,7 @@ import React from 'react'
 import {FlatList, Linking, Platform, StyleSheet, Text, TextProps, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {CopyButton} from '../../../components/CopyButton'
 import {Icon} from '../../../components/Icon'
 import {PressableIcon} from '../../../components/PressableIcon/PressableIcon'
@@ -55,7 +55,7 @@ export const ShowSuccessScreen = () => {
           </>
         )}
 
-        <Button onPress={navigateTo.back} title={strings.ok} shelleyTheme />
+        <Button onPress={navigateTo.back} title={strings.ok} />
 
         <Spacer height={16} />
       </Actions>
diff --git a/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx b/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
index 8dc4b7f7df..e234e1ec2b 100644
--- a/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
+++ b/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
@@ -10,7 +10,7 @@ import {useIntl} from 'react-intl'
 import {Alert, InteractionManager, SafeAreaView, ScrollView, StyleSheet, TouchableOpacity} from 'react-native'
 import config from 'react-native-config'
 
-import {Button} from '../../components/Button/Button'
+import {Button} from '../../components/Button/NewButton'
 import {Text} from '../../components/Text'
 import {TextInput} from '../../components/TextInput/TextInput'
 import {agreementDate} from '../../kernel/config'
@@ -193,7 +193,6 @@ export const DeveloperScreen = () => {
             <Button
               disabled={isLoading || addresses.split(',').length > 50 || addresses.length === 0}
               style={styles.button}
-              shelleyTheme
               onPress={() => {
                 storage
                   .keys('/wallet/', false)
diff --git a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
index 939811fad4..cd6c28130d 100644
--- a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
@@ -3,7 +3,7 @@ import {storiesOf} from '@storybook/react-native'
 import * as React from 'react'
 import {View} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {ConfirmConnectionModal, useOpenConfirmConnectionModal} from './ConfirmConnectionModal'
 
 storiesOf('Discover ConfirmConnectionModal', module)
@@ -50,9 +50,9 @@ const WithButton = () => {
 
   return (
     <View>
-      <Button title="Open modal without warning" shelleyTheme onPress={handleOnPressNoWarning} />
+      <Button title="Open modal without warning" onPress={handleOnPressNoWarning} />
 
-      <Button title="Open modal with warning" shelleyTheme onPress={handleOnPressWarning} />
+      <Button title="Open modal with warning" onPress={handleOnPressWarning} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
index d444741c8f..251670791e 100644
--- a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
@@ -3,7 +3,7 @@ import {Image} from 'expo-image'
 import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
@@ -110,7 +110,7 @@ export const ConfirmConnectionModal = ({name, website, onConfirm, logo, showSing
 
       <Spacer height={46} />
 
-      <Button title={strings.confirmConnectionModalConnect} shelleyTheme onPress={onConfirm} />
+      <Button title={strings.confirmConnectionModalConnect} onPress={onConfirm} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx b/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
index 06f7973195..fe7c5f04ea 100644
--- a/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {Text} from '../../../components/Text'
@@ -32,7 +32,7 @@ const HWNotSupportedModal = ({onConfirm}: Props) => {
 
       <Spacer fill />
 
-      <Button title={strings.cancel} shelleyTheme onPress={onConfirm} />
+      <Button title={strings.cancel} onPress={onConfirm} />
     </>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
index e16ac69616..fd6f8a6da2 100644
--- a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
@@ -3,7 +3,7 @@ import {storiesOf} from '@storybook/react-native'
 import * as React from 'react'
 import {View} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {UnverifiedDappModal, useOpenUnverifiedDappModal} from './UnverifiedDappModal'
 
 storiesOf('Discover UnverifiedDappModal', module)
@@ -25,5 +25,5 @@ const WithButton = () => {
     })
   }
 
-  return <Button title="Open Modal" shelleyTheme onPress={handleOnPress} />
+  return <Button title="Open Modal" onPress={handleOnPress} />
 }
diff --git a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
index 0a6c09f3dd..e0398dbdbf 100644
--- a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {useStrings} from './useStrings'
@@ -46,7 +46,7 @@ export const UnverifiedDappModal = ({onConfirm}: Props) => {
       <Spacer fill />
 
       <View style={styles.actions}>
-        <Button title={strings.understand} shelleyTheme onPress={onConfirm} />
+        <Button title={strings.understand} onPress={onConfirm} />
       </View>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
index bfbf280cd5..8084c59c85 100644
--- a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
+++ b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
@@ -11,7 +11,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery} from 'react-query'
 import {z} from 'zod'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {CopyButton} from '../../../../components/CopyButton'
 import {Icon} from '../../../../components/Icon'
 import {ScrollView} from '../../../../components/ScrollView/ScrollView'
@@ -131,7 +131,7 @@ export const ReviewTransaction = () => {
       </ScrollView>
 
       <View style={[styles.buttonArea, {borderTopWidth: scrollbarShown ? 1 : 0}]}>
-        <Button title={strings.confirm} shelleyTheme onPress={handleOnConfirm} />
+        <Button title={strings.confirm} onPress={handleOnConfirm} />
       </View>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx b/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
index d9fcb5bf60..db7cb0a834 100644
--- a/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
@@ -4,7 +4,7 @@ import {Image, StyleSheet, Text, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
 import IllustrationDAppImage from '../../../../assets/img/illustration-dapp.png'
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {useShowWelcomeDApp} from '../../common/useShowWelcomeDApp'
 import {useStrings} from '../../common/useStrings'
@@ -73,7 +73,7 @@ const Modal = () => {
       <Text style={styles.welcomeText}>{strings.welcomeToYoroiDAppExplorerDescription}</Text>
 
       <View style={styles.actions}>
-        <Button shelleyTheme onPress={closeModal} title={strings.next} />
+        <Button onPress={closeModal} title={strings.next} />
       </View>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
index 5e3ada6f86..603fbbf91a 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../useStrings'
@@ -35,7 +35,6 @@ export const PreprodFaucetBanner = () => {
 
           <Button
             testID="rampOnOffButton"
-            shelleyTheme
             title={strings.preprodFaucetBannerButtonText}
             onPress={handleOnPress}
             style={styles.spaceButton}
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
index 1031ec28db..e7eb72c278 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../useStrings'
@@ -35,7 +35,6 @@ export const SanchonetFaucetBanner = () => {
 
           <Button
             testID="rampOnOffButton"
-            shelleyTheme
             title={strings.sanchoFaucetBannerButtonText}
             onPress={handleOnPress}
             style={styles.spaceButton}
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
index 070984c331..e7a30cb137 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
@@ -4,7 +4,7 @@ import {Chain} from '@yoroi/types'
 import * as React from 'react'
 import {Linking, StyleSheet, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {useWalletManager} from '../../../../WalletManager/context/WalletManagerProvider'
 import {useStrings} from '../../../common/useStrings'
 
@@ -52,7 +52,7 @@ export const CreateExchangeButton = ({
 
   return (
     <View style={[styles.actions, style]}>
-      <Button testID="rampOnOffButton" shelleyTheme title={title} onPress={handleOnPress} disabled={disabled} />
+      <Button testID="rampOnOffButton" title={title} onPress={handleOnPress} disabled={disabled} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
index cc0fd2f14b..afde2c8167 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {useModal} from '../../../../../components/Modal/ModalContext'
 import {Space} from '../../../../../components/Space/Space'
 import {useStrings} from '../../../common/useStrings'
@@ -23,13 +23,7 @@ export const ErrorScreen = () => {
 
       <Space height="lg" />
 
-      <Button
-        testID="rampOnOffErrorCloseButton"
-        shelleyTheme
-        title={strings.close}
-        style={styles.button}
-        onPress={closeModal}
-      />
+      <Button testID="rampOnOffErrorCloseButton" title={strings.close} style={styles.button} onPress={closeModal} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
index 09cecc90cc..88fb169625 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -108,7 +108,7 @@ export const ShowExchangeResultOrderScreen = () => {
         </View>
 
         <View style={styles.actions}>
-          <Button shelleyTheme onPress={handleOnClose} title={strings.close} />
+          <Button onPress={handleOnClose} title={strings.close} />
         </View>
       </SafeAreaView>
     </ExchangeProvider>
diff --git a/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx b/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
index 0ca4646f44..21dd383f3a 100644
--- a/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Space} from '../../../components/Space/Space'
 import {Text} from '../../../components/Text'
 import {useWalletNavigation} from '../../../kernel/navigation'
@@ -57,7 +57,7 @@ export const DarkThemeAnnouncement = () => {
         </View>
       </ScrollView>
 
-      <Button title={strings.continue} disabled={isSetScreenShownLoading} onPress={navigate} shelleyTheme />
+      <Button title={strings.continue} disabled={isSetScreenShownLoading} onPress={navigate} />
 
       {Platform.OS === 'android' && <Space height="lg" />}
     </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx b/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
index 69a3ab30b0..2a69539174 100644
--- a/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
@@ -4,7 +4,7 @@ import {ScrollView, StyleSheet, Text, TextInput, TouchableOpacity, View} from 'r
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BlueCheckbox} from '../../../components/BlueCheckbox/BlueCheckbox'
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Icon} from '../../../components/Icon'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiLogo} from '../../../components/YoroiLogo/YoroiLogo'
@@ -81,13 +81,7 @@ export const InitialScreen = () => {
 
         <Spacer fill />
 
-        <Button
-          title={strings.continue}
-          shelleyTheme
-          disabled={!tosAccepted}
-          onPress={onPressContinue}
-          testID="buttonContinue"
-        />
+        <Button title={strings.continue} disabled={!tosAccepted} onPress={onPressContinue} testID="buttonContinue" />
       </ScrollView>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx b/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
index 38cfe02b85..858b69ad40 100644
--- a/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
@@ -4,7 +4,7 @@ import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BlueCheckbox} from '../../../components/BlueCheckbox/BlueCheckbox'
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiLogo} from '../../../components/YoroiLogo/YoroiLogo'
 import {useNavigateTo, useStrings} from '../common'
@@ -68,7 +68,7 @@ export const TermsOfServiceChangedScreen = () => {
 
         <Spacer fill />
 
-        <Button title={strings.continue} shelleyTheme disabled={!accepted} onPress={onPressContinue} />
+        <Button title={strings.continue} disabled={!accepted} onPress={onPressContinue} />
       </ScrollView>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
index 6c57f40d3d..99bfcc12ce 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
@@ -13,7 +13,7 @@ import {
 import Animated, {Layout} from 'react-native-reanimated'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Space} from '../../../components/Space/Space'
 import {useMetrics} from '../../../kernel/metrics/metricsManager'
 import {useAddressMode} from '../../WalletManager/common/hooks/useAddressMode'
@@ -127,7 +127,6 @@ export const ListMultipleAddressesScreen = () => {
         layout={Layout}
       >
         <Button
-          shelleyTheme
           title={strings.generateButton}
           disabled={hasReachedGapLimit}
           onPress={handleOnGenerateNewReceiveAddress}
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
index 7ee8ff18ac..f8005f76f4 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {useIntl} from 'react-intl'
 import {Platform, StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import globalMessages, {confirmationMessages} from '../../../kernel/i18n/global-messages'
@@ -36,7 +36,7 @@ export const InsufficientFundsModal = () => {
         })}
       </Text>
 
-      <Button shelleyTheme title={strings.back} onPress={closeModal} textStyles={styles.button} />
+      <Button title={strings.back} onPress={closeModal} />
 
       {Platform.OS === 'android' && <Space height="lg" />}
     </View>
@@ -69,9 +69,6 @@ const useStyles = () => {
       color: color.gray_max,
       ...atoms.body_1_lg_regular,
     },
-    button: {
-      ...atoms.button_1_lg,
-    },
   })
 
   return styles
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
index f7cec3c29f..a49176e744 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
@@ -5,7 +5,7 @@ import {ActivityIndicator, ScrollView, StyleSheet, View, ViewProps} from 'react-
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation, UseMutationOptions} from 'react-query'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {BACKSPACE, NumericKeyboard} from '../../../../components/NumericKeyboard'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -222,7 +222,7 @@ export const ConfirmPin = () => {
 
       <Padding>
         <Actions>
-          <Button shelleyTheme onPress={() => onNext()} title={strings.continueButton} disabled={!done || isLoading} />
+          <Button onPress={() => onNext()} title={strings.continueButton} disabled={!done || isLoading} />
         </Actions>
       </Padding>
 
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
index cd4731de73..b8664538b3 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
@@ -4,7 +4,7 @@ import React, {useState} from 'react'
 import {ScrollView, StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {ConfirmTxWithHwModal} from '../../../../components/ConfirmTxWithHwModal/ConfirmTxWithHwModal'
 import {ConfirmTxWithOsModal} from '../../../../components/ConfirmTxWithOsModal/ConfirmTxWithOsModal'
 import {ConfirmTxWithSpendingPasswordModal} from '../../../../components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal'
@@ -118,7 +118,7 @@ export const ConfirmVotingTx = () => {
         <Spacer fill />
 
         <Actions>
-          <Button title={strings.confirm} shelleyTheme onPress={onSubmit} />
+          <Button title={strings.confirm} onPress={onSubmit} />
         </Actions>
       </SafeAreaView>
     </KeyboardAvoidingView>
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
index ff16e6d147..f07e7aad3a 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {ScrollView, StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Checkbox} from '../../../../components/Checkbox/Checkbox'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -60,7 +60,7 @@ export const DisplayPin = () => {
       <Spacer fill />
 
       <Actions>
-        <Button shelleyTheme onPress={() => onNext()} title={strings.continueButton} disabled={!checked} />
+        <Button onPress={() => onNext()} title={strings.continueButton} disabled={!checked} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
index 4bd9abf2f9..848dee138d 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
@@ -8,7 +8,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import appstoreBadge from '../../../../assets/img/app-store-badge.png'
 import playstoreBadge from '../../../../assets/img/google-play-badge.png'
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {useStakingInfo} from '../../../../legacy/Dashboard/StakePoolInfos'
@@ -98,7 +98,7 @@ export const DownloadCatalystAppScreen = () => {
       </ScrollView>
 
       <Actions>
-        <Button shelleyTheme onPress={onNext} title={strings.continueButton} disabled={disabled} />
+        <Button onPress={onNext} title={strings.continueButton} disabled={disabled} />
       </Actions>
     </SafeAreaView>
   )
@@ -130,7 +130,7 @@ const WarningModal = () => {
 
       <Space fill />
 
-      <Button shelleyTheme title={strings.iUnderstandButton} onPress={closeModal} textStyles={styles.button} />
+      <Button title={strings.iUnderstandButton} onPress={closeModal} />
 
       {Platform.OS === 'android' && <Space height="lg" />}
     </View>
@@ -201,9 +201,6 @@ const useStyles = () => {
       color: color.text_gray_medium,
       ...atoms.body_1_lg_regular,
     },
-    button: {
-      ...atoms.button_1_lg,
-    },
     subTitle: {
       ...atoms.heading_3_medium,
       ...atoms.text_center,
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
index 0f0b7529f2..39c50d2ea2 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {InteractionManager, ScrollView, StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Checkbox} from '../../../../components/Checkbox/Checkbox'
 import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {ShareQRCodeCard} from '../../../../components/ShareQRCodeCard/ShareQRCodeCard'
@@ -57,7 +57,7 @@ export const QrCode = () => {
       </ScrollView>
 
       <Actions style={styles.padding}>
-        <Button shelleyTheme onPress={onNext} title={strings.completeButton} disabled={isCopying || !checked} />
+        <Button onPress={onNext} title={strings.completeButton} disabled={isCopying || !checked} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
index 55faf3176c..f021952862 100644
--- a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
+++ b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
@@ -1,10 +1,10 @@
 import * as React from 'react'
 import {openSettings} from 'react-native-permissions'
 
-import {Button, ButtonProps} from '../../../../components/Button/Button'
+import {Button, ButtonProps} from '../../../../components/Button/NewButton'
 import {useStrings} from '../../common/useStrings'
 
-export const OpenDeviceAppSettingsButton = (props: Omit<ButtonProps, 'title' | 'onPress' | 'shelleyTheme'>) => {
+export const OpenDeviceAppSettingsButton = (props: Omit<ButtonProps, 'title' | 'onPress' | ''>) => {
   const strings = useStrings()
-  return <Button onPress={openSettings} title={strings.openAppSettings} shelleyTheme {...props} />
+  return <Button onPress={openSettings} title={strings.openAppSettings} {...props} />
 }
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
index f5c4c5130c..0e7aec09e9 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Text} from '../../../../../components/Text'
@@ -27,12 +27,7 @@ export const FailedTxScreen = () => {
 
       <Space height="xl" />
 
-      <Button
-        onPress={navigateTo.startTxAfterReset}
-        title={strings.failedTxButton}
-        style={styles.button}
-        shelleyTheme
-      />
+      <Button onPress={navigateTo.startTxAfterReset} title={strings.failedTxButton} style={styles.button} />
     </SafeArea>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
index b7c9793401..b761117f3e 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTransfer} from '@yoroi/transfer'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Text} from '../../../../../components/Text'
@@ -30,7 +30,7 @@ export const SubmittedTxScreen = () => {
 
       <Space height="xl" />
 
-      <Button onPress={resetToTxHistory} title={strings.submittedTxButton} style={styles.button} shelleyTheme />
+      <Button onPress={resetToTxHistory} title={strings.submittedTxButton} style={styles.button} />
     </SafeArea>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
index d9ccd5ae9e..690e217309 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
@@ -7,7 +7,7 @@ import * as React from 'react'
 import {InteractionManager, ScrollView, StyleSheet, Text, TouchableOpacity, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {PairedBalance} from '../../../../../components/PairedBalance/PairedBalance'
 import {Space} from '../../../../../components/Space/Space'
@@ -153,7 +153,6 @@ export const EditAmountScreen = () => {
           <ApplyButton
             onPress={handleOnApply}
             title={strings.apply.toLocaleUpperCase()}
-            shelleyTheme
             disabled={isUnableToSpend || !hasBalance || isZero}
           />
         </Actions>
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
index aebcf4ff06..ecdec21c39 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
@@ -12,7 +12,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation} from 'react-query'
 
 import {Boundary} from '../../../../components/Boundary/Boundary'
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import globalMessages from '../../../../kernel/i18n/global-messages'
@@ -119,12 +119,7 @@ export const ListAmountsToSendScreen = () => {
 
         <Spacer height={33} />
 
-        <NextButton
-          onPress={onNext}
-          title={strings.next}
-          shelleyTheme
-          disabled={selectedTokensCounter === 0 || isLoading}
-        />
+        <NextButton onPress={onNext} title={strings.next} disabled={selectedTokensCounter === 0 || isLoading} />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
index 5b2e08edde..3fee0a854f 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
@@ -6,7 +6,7 @@ import React from 'react'
 import {StyleSheet, TextInput, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {ScrollView, useScrollView} from '../../../../components/ScrollView/ScrollView'
 import {Space} from '../../../../components/Space/Space'
@@ -114,13 +114,7 @@ export const StartMultiTokenTxScreen = () => {
 
         <Actions style={isScrollBarShown && styles.actionsScroll}>
           <Padding>
-            <NextButton
-              onPress={handleOnNext}
-              title={strings.next}
-              disabled={!canGoNext}
-              testID="nextButton"
-              shelleyTheme
-            />
+            <NextButton onPress={handleOnNext} title={strings.next} disabled={!canGoNext} testID="nextButton" />
           </Padding>
         </Actions>
       </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
index 68afc106d7..5927587c19 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
@@ -6,7 +6,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {UseMutationOptions, useQuery, UseQueryOptions} from 'react-query'
 
 import {Boundary} from '../../../components/Boundary/Boundary'
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
@@ -68,7 +68,6 @@ export const useHandleOpenNetworkNoticeModal = () => {
 
         <View style={styles.actions}>
           <Button
-            shelleyTheme
             title={strings.networkNoticeButton}
             onPress={() => {
               closeModal()
diff --git a/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx b/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
index b3e87d7a45..1a52547155 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
@@ -6,7 +6,7 @@ import {ScrollView, StyleSheet, TextInput as RNTextInput, View, ViewProps} from
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {MutationOptions, useMutation} from 'react-query'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Checkmark, TextInput} from '../../../components/TextInput/TextInput'
 import {errorMessages} from '../../../kernel/i18n/global-messages'
@@ -96,7 +96,6 @@ export const ChangePasswordScreen = () => {
             onPress={() => changePassword({currentPassword, newPassword})}
             disabled={hasErrors}
             title={strings.continueButton}
-            shelleyTheme
           />
         </Actions>
       </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
index e9d442cdb6..b515db11d1 100644
--- a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
@@ -5,7 +5,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Text} from '../../../components/Text'
 import {useSelectedWallet} from '../../WalletManager/common/hooks/useSelectedWallet'
 import {useWalletManager} from '../../WalletManager/context/WalletManagerProvider'
@@ -29,7 +29,7 @@ export const DisableEasyConfirmationScreen = () => {
       </View>
 
       <View style={styles.actions}>
-        <Button title={strings.disableButton} onPress={handleOnDisableConfirmation} shelleyTheme />
+        <Button title={strings.disableButton} onPress={handleOnDisableConfirmation} />
       </View>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
index e9bbcead34..d4726b8ac3 100644
--- a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
@@ -6,7 +6,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {LoadingOverlay} from '../../../components/LoadingOverlay/LoadingOverlay'
 import {Text} from '../../../components/Text'
@@ -61,7 +61,6 @@ export const EnableEasyConfirmationScreen = () => {
             title={strings.enableButton}
             onPress={() => enableEasyConfirmation(rootPassword)}
             disabled={isEmptyString(rootPassword) || isLoading}
-            shelleyTheme
           />
         </Actions>
       </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
index 89b7ea3453..a3db32cade 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
@@ -25,7 +25,7 @@ export const FailedTxScreen = () => {
 
       <Spacer height={22} />
 
-      <Button onPress={navigation.goBack} title={strings.failedTxButton} style={styles.button} shelleyTheme />
+      <Button onPress={navigation.goBack} title={strings.failedTxButton} style={styles.button} />
     </SafeArea>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
index d7442d96be..090348c3fa 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
@@ -26,7 +26,7 @@ export const SubmittedTxScreen = () => {
 
       <Spacer height={22} />
 
-      <Button onPress={resetToTxHistory} title={strings.submittedTxButton} style={styles.button} shelleyTheme />
+      <Button onPress={resetToTxHistory} title={strings.submittedTxButton} style={styles.button} />
     </SafeArea>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
index 7f8d2d6c53..a6f7ae3c80 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
@@ -17,7 +17,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation} from 'react-query'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {CopyButton} from '../../../components/CopyButton'
 import {ErrorPanel} from '../../../components/ErrorPanel/ErrorPanel'
 import {Icon} from '../../../components/Icon'
@@ -169,16 +169,11 @@ export const ManageCollateralScreen = () => {
       </ScrollView>
 
       {shouldShowPrimaryButton && (
-        <Button
-          title={strings.generateCollateral}
-          onPress={handleGenerateCollateral}
-          shelleyTheme
-          disabled={isLoading}
-        />
+        <Button title={strings.generateCollateral} onPress={handleGenerateCollateral} disabled={isLoading} />
       )}
 
       {shouldShowBackButton && params?.backButton && (
-        <Button title={params.backButton.content} onPress={params.backButton.onPress} shelleyTheme />
+        <Button title={params.backButton.content} onPress={params.backButton.onPress} />
       )}
 
       <Space height="lg" />
diff --git a/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx b/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
index 3b1ab1eb9e..e470aa2e8c 100644
--- a/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {InteractionManager, ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Checkbox} from '../../../components/Checkbox/Checkbox'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx b/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
index 24fb0921fb..c9f8559306 100644
--- a/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
@@ -5,7 +5,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {TextInput} from '../../../components/TextInput/TextInput'
@@ -66,7 +66,6 @@ export const RenameWalletScreen = () => {
             onPress={handleOnRename}
             title={strings.changeButton}
             disabled={hasErrors || isEmptyString(newWalletName)}
-            shelleyTheme
           />
         </View>
       </SafeAreaView>
diff --git a/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx b/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
index 2da9ed1500..a243493fa4 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {Space} from '../../../../components/Space/Space'
 import {useWalletNavigation} from '../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx
index e6eb1ad670..b8a75da51d 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx
@@ -93,7 +93,6 @@ export const SaveReadOnlyWalletScreen = () => {
             <WalletInfoView normalizedPath={normalizedPath} publicKeyHex={publicKeyHex} />
           </Boundary>
         }
-        buttonStyle={styles.walletFormButtonStyle}
         isWaiting={isLoading}
       />
     </SafeAreaView>
@@ -146,9 +145,6 @@ const styles = StyleSheet.create({
     paddingTop: 0,
     paddingHorizontal: 0,
   },
-  walletFormButtonStyle: {
-    marginHorizontal: 0,
-  },
 })
 
 const messages = defineMessages({
diff --git a/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx b/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
index 8ad5fb1308..21938e8884 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
@@ -5,7 +5,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {ActivityIndicator, Image, ImageSourcePropType, ScrollView, StyleSheet, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {ProgressStep} from '../../../../components/ProgressStep'
 import {TextInput} from '../../../../components/TextInput/TextInput'
@@ -23,7 +23,6 @@ type Props = {
     totalSteps: number
   }
   containerStyle?: ViewStyle
-  buttonStyle?: ViewStyle
   topContent?: React.ReactNode
   bottomContent?: React.ReactNode
   isWaiting?: boolean
@@ -34,7 +33,6 @@ export const WalletNameForm = ({
   image,
   progress,
   containerStyle,
-  buttonStyle,
   topContent,
   bottomContent,
   defaultWalletName,
@@ -92,10 +90,8 @@ export const WalletNameForm = ({
 
         <View style={styles.buttonContainer}>
           <Button
-            block
             onPress={() => onSubmit({name: name.trim()})}
             title={strings.save}
-            style={[styles.button, buttonStyle]}
             disabled={hasErrors || isWaiting}
             testID="saveWalletButton"
           />
@@ -128,10 +124,6 @@ const useStyles = () => {
       flexDirection: 'row',
       marginTop: 12,
     },
-    button: {
-      marginHorizontal: 10,
-      marginVertical: 16,
-    },
   })
 
   return styles
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
index ed9697b0df..3147009753 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
@@ -5,7 +5,7 @@ import {Linking, ScrollView, StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {ViewProps} from 'react-native-svg/lib/typescript/fabric/utils'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
@@ -64,7 +64,6 @@ export const AboutRecoveryPhraseScreen = () => {
         <LearnMoreButton onPress={handleOnLearMoreButtonPress} />
 
         <Button
-          shelleyTheme
           title={strings.next}
           onPress={() => navigation.navigate('setup-wallet-recovery-phrase-mnemonic')}
           testID="setup-step1-next-button"
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
index 925b538c59..42cce0be60 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {Linking, Platform, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
@@ -66,7 +66,6 @@ export const RecoveryPhraseScreen = () => {
         <Space height="xl" />
 
         <Button
-          shelleyTheme
           title={strings.continueButton}
           onPress={() => {
             closeModal()
@@ -147,7 +146,6 @@ export const RecoveryPhraseScreen = () => {
       <Spacer fill />
 
       <Button
-        shelleyTheme
         title={strings.next}
         disabled={isBlur}
         onPress={() => {
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
index 9145c16278..4e884b20ab 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import Animated, {FadeIn, FadeOut, Layout} from 'react-native-reanimated'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
@@ -98,7 +98,6 @@ export const VerifyRecoveryPhraseScreen = () => {
 
       <View style={[styles.actions, styles.padding]}>
         <Button
-          shelleyTheme
           title={strings.next}
           disabled={disabled}
           onPress={async () => {
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
index ace46d79d1..165667ec71 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
@@ -20,7 +20,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {ViewProps} from 'react-native-svg/lib/typescript/fabric/utils'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
@@ -184,7 +184,6 @@ export const WalletDetailsScreen = () => {
           />
 
           <Button
-            shelleyTheme
             title={strings.continueButton}
             onPress={() => {
               closeModal()
@@ -242,7 +241,7 @@ export const WalletDetailsScreen = () => {
             }}
           />
 
-          <Button title={strings.continueButton} shelleyTheme onPress={closeModal} />
+          <Button title={strings.continueButton} onPress={closeModal} />
         </View>
       </View>,
       HEIGHT_MODAL_CHECKSUM,
@@ -328,7 +327,6 @@ export const WalletDetailsScreen = () => {
 
         <Actions>
           <Button
-            shelleyTheme
             title={strings.next}
             onPress={() => handleCreateWallet()}
             disabled={isLoading || Object.keys(passwordErrors).length > 0 || Object.keys(nameErrors).length > 0}
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
index 83d0aaaed9..7510d98212 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BulletPointItem} from '../../../../components/BulletPointItem'
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Space} from '../../../../components/Space/Space'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
 import {Text} from '../../../../components/Text'
@@ -54,7 +54,7 @@ export const CheckNanoXScreen = () => {
       </ScrollView>
 
       <Actions>
-        <Button shelleyTheme onPress={onContinue} title={strings.continueButton} testID="continueButton" />
+        <Button onPress={onContinue} title={strings.continueButton} testID="continueButton" />
       </Actions>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
index f0214c8305..7eabab4834 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
@@ -18,7 +18,7 @@ import {
 } from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
@@ -151,7 +151,7 @@ export const SaveNanoXScreen = () => {
 
         <Space height="sm" />
 
-        <Button title={strings.continueButton} shelleyTheme onPress={closeModal} />
+        <Button title={strings.continueButton} onPress={closeModal} />
       </View>,
       HEIGHT_MODAL_NAME_PASSWORD,
     )
@@ -186,7 +186,7 @@ export const SaveNanoXScreen = () => {
 
         <Space height="sm" />
 
-        <Button title={strings.continueButton} shelleyTheme onPress={closeModal} />
+        <Button title={strings.continueButton} onPress={closeModal} />
       </View>,
       HEIGHT_MODAL_CHECKSUM,
     )
@@ -243,7 +243,6 @@ export const SaveNanoXScreen = () => {
 
         <View>
           <Button
-            shelleyTheme
             title={strings.next}
             onPress={handleOnSubmit}
             testID="setup-restore-step2-next-button"
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
index 7a07887f4c..8da52e9978 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
@@ -20,7 +20,7 @@ import {
 import {TouchableOpacity} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
@@ -168,7 +168,7 @@ export const RestoreWalletDetailsScreen = () => {
 
         <Space height="sm" />
 
-        <Button title={strings.continueButton} shelleyTheme onPress={closeModal} />
+        <Button title={strings.continueButton} onPress={closeModal} />
       </View>,
       HEIGHT_MODAL_NAME_PASSWORD,
     )
@@ -203,7 +203,7 @@ export const RestoreWalletDetailsScreen = () => {
 
         <Space height="sm" />
 
-        <Button title={strings.continueButton} shelleyTheme onPress={closeModal} />
+        <Button title={strings.continueButton} onPress={closeModal} />
       </View>,
       HEIGHT_MODAL_CHECKSUM,
     )
@@ -296,7 +296,6 @@ export const RestoreWalletDetailsScreen = () => {
 
         <View>
           <Button
-            shelleyTheme
             title={strings.next}
             onPress={() =>
               createWallet({
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
index f27582562a..274ae3a094 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
@@ -7,7 +7,7 @@ import {Dimensions, Keyboard, Platform, StyleSheet, Text, View} from 'react-nati
 import {FlatList, ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {useScrollView} from '../../../../components/ScrollView/ScrollView'
@@ -242,7 +242,7 @@ const WordSuggestionList = ({
 
 const WordSuggestionButton = ({title, onPress}: {title: string; onPress: () => void}) => {
   const {styles} = useStyles()
-  return <Button onPress={onPress} style={styles.suggestion} textStyles={styles.suggestionText} title={title} />
+  return <Button onPress={onPress} style={styles.suggestion} title={title} />
 }
 
 const useBold = () => {
@@ -302,11 +302,6 @@ const useStyles = () => {
       borderRadius: 8,
       backgroundColor: 'transparent',
     },
-    suggestionText: {
-      ...atoms.body_1_lg_regular,
-      textTransform: 'none',
-      color: color.text_primary_medium,
-    },
     suggestionArea: {
       backgroundColor: color.bg_color_max,
       borderColor: color.gray_200,
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
index a6b086315b..92dca97875 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
@@ -5,7 +5,7 @@ import React from 'react'
 import {StyleSheet, View} from 'react-native'
 import {TouchableOpacity} from 'react-native-gesture-handler'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {ConfirmTxWithHwModal} from '../../../../../components/ConfirmTxWithHwModal/ConfirmTxWithHwModal'
 import {ConfirmTxWithOsModal} from '../../../../../components/ConfirmTxWithOsModal/ConfirmTxWithOsModal'
 import {ConfirmTxWithSpendingPasswordModal} from '../../../../../components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal'
@@ -205,7 +205,7 @@ export const ConfirmTxScreen = () => {
 
       <Spacer fill />
 
-      <Button title={strings.confirm} shelleyTheme onPress={onSubmit} />
+      <Button title={strings.confirm} onPress={onSubmit} />
 
       <Spacer height={26} />
     </View>
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
index e685663b11..3cab5cbe26 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
@@ -4,7 +4,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Alert, Linking, StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {TextInput} from '../../../../../components/TextInput/TextInput'
@@ -75,7 +75,6 @@ export const EnterDrepIdModal = ({onSubmit}: Props) => {
       <Button
         title={strings.confirm}
         disabled={isNonNullable(error) || drepId.length === 0 || !isFetched || isFetching}
-        shelleyTheme
         onPress={handleOnPress}
       />
 
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
index d835c4f93f..fcebfbc434 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
@@ -34,7 +34,7 @@ export const FailedTxScreen = () => {
 
         <Spacer height={16} />
 
-        <Button title={strings.tryAgain} textStyles={styles.button} shelleyTheme onPress={handleOnTryAgain} />
+        <Button title={strings.tryAgain} onPress={handleOnTryAgain} />
       </View>
     </SafeArea>
   )
@@ -69,10 +69,6 @@ const useStyles = () => {
       color: color.gray_600,
       textAlign: 'center',
     },
-    button: {
-      paddingHorizontal: 24,
-      paddingVertical: 15,
-    },
   })
 
   return styles
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
index 691d747303..2ffebb04c8 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
@@ -4,7 +4,7 @@ import {Chain} from '@yoroi/types'
 import React from 'react'
 import {Linking, StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
@@ -52,7 +52,7 @@ export const NoFundsScreen = () => {
 
         <Space height="lg" />
 
-        <Button title={buttonText} textStyles={styles.button} shelleyTheme onPress={handleOnTryAgain} />
+        <Button title={buttonText} onPress={handleOnTryAgain} />
 
         <Spacer fill />
 
@@ -82,10 +82,6 @@ const useStyles = () => {
       maxWidth: 320,
       color: color.gray_max,
     },
-    button: {
-      ...atoms.px_xl,
-      ...atoms.py_lg,
-    },
   })
 
   return styles
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
index ad53f518b8..3a2e43641a 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
@@ -41,7 +41,7 @@ export const NotSupportedCardanoAppVersion = () => {
       <Spacer fill />
 
       <Actions>
-        <Button block title={strings.notSupportedVersionButton} shelleyTheme onPress={handleOnPress} />
+        <Button title={strings.notSupportedVersionButton} onPress={handleOnPress} />
       </Actions>
     </SafeArea>
   )
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
index 24ac90de05..7c83447d41 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useMetrics} from '../../../../../kernel/metrics/metricsManager'
@@ -66,11 +66,7 @@ export const SuccessTxScreen = () => {
 
       <Spacer fill />
 
-      <Button
-        title={navigateToStaking ? strings.goToStaking : strings.goToGovernance}
-        shelleyTheme
-        onPress={handleOnPress}
-      />
+      <Button title={navigateToStaking ? strings.goToStaking : strings.goToGovernance} onPress={handleOnPress} />
 
       <Spacer height={6} />
     </View>
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
index 8d126a190d..8c08767cc8 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useStrings} from '../../common/strings'
@@ -23,7 +23,7 @@ export const WithdrawWarningModal = ({onParticipatePress}: Props) => {
 
       <Spacer fill />
 
-      <Button title={strings.withdrawWarningButton} shelleyTheme onPress={onParticipatePress} />
+      <Button title={strings.withdrawWarningButton} onPress={onParticipatePress} />
 
       <Spacer height={24} />
     </View>
diff --git a/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx b/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
index 68c676d35c..fadc7c679f 100644
--- a/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
+++ b/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, TextInput as RNTextInput, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {TextInput} from '../../../../components/TextInput/TextInput'
@@ -57,7 +57,6 @@ export const ConfirmWithSpendingPassword = ({onSubmit, isLoading, error, onPassw
 
       <Button
         testID="swapButton"
-        shelleyTheme
         title={strings.sign}
         onPress={() => onSubmit?.(spendingPassword)}
         disabled={spendingPassword.length === 0}
diff --git a/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx b/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
index 7d631337be..97a8048f41 100644
--- a/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
+++ b/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
@@ -3,7 +3,7 @@ import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../strings'
 import {ConectionErrorImage} from './ConectionErrorImage'
@@ -29,7 +29,7 @@ export const ServiceUnavailable = ({resetErrorBoundary}: ServiceUnavailableProps
 
         <Spacer height={20} />
 
-        <Button onPress={resetErrorBoundary} title={strings.tryAgain} style={styles.button} shelleyTheme />
+        <Button onPress={resetErrorBoundary} title={strings.tryAgain} style={styles.button} />
       </View>
     </SafeAreaView>
   )
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
index a5122f6f59..3ac3443187 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
@@ -5,7 +5,7 @@ import {InteractionManager, StyleSheet, useWindowDimensions, View, ViewProps} fr
 import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {LoadingOverlay} from '../../../../components/LoadingOverlay/LoadingOverlay'
 import {useModal} from '../../../../components/Modal/ModalContext'
@@ -132,7 +132,6 @@ export const ConfirmTxScreen = () => {
         <Button
           disabled={isButtonDisabled}
           testID="swapButton"
-          shelleyTheme
           title={strings.confirm}
           onPress={() => {
             if (meta.isEasyConfirmationEnabled) {
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
index f2fa8dee41..e66f7ddb85 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useBlockGoBack} from '../../../../../kernel/navigation'
@@ -26,7 +26,7 @@ export const ShowFailedTxScreen = () => {
 
       <Spacer height={22} />
 
-      <Button onPress={navigateTo.startSwap} title={strings.failedTxButton} style={styles.button} shelleyTheme />
+      <Button onPress={navigateTo.startSwap} title={strings.failedTxButton} style={styles.button} />
     </View>
   )
 }
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
index a5fd0e2951..15e9e4d7d0 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../../../../components/Button/Button'
+import {Button} from '../../../../../../../components/Button/NewButton'
 import {KeyboardAvoidingView} from '../../../../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {TextInput} from '../../../../../../../components/TextInput/TextInput'
 import {useLanguage} from '../../../../../../../kernel/i18n'
@@ -125,13 +125,7 @@ export const EditSlippageScreen = () => {
           </View>
         </ScrollView>
 
-        <Button
-          testID="applyButton"
-          shelleyTheme
-          title={strings.apply}
-          disabled={isButtonDisabled}
-          onPress={onSubmit}
-        />
+        <Button testID="applyButton" title={strings.apply} disabled={isButtonDisabled} onPress={onSubmit} />
       </SafeAreaView>
     </KeyboardAvoidingView>
   )
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
index 4e0e1f2a87..a7757fe61d 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
@@ -8,7 +8,7 @@ import * as React from 'react'
 import {Alert, StyleSheet, useWindowDimensions, View, ViewProps} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button} from '../../../../../components/Button/Button'
+import {Button} from '../../../../../components/Button/NewButton'
 import {useModal} from '../../../../../components/Modal/ModalContext'
 import {Space} from '../../../../../components/Space/Space'
 import {frontendFeeAddressMainnet, frontendFeeAddressPreprod} from '../../../../../kernel/env'
@@ -329,7 +329,7 @@ export const StartSwapOrderScreen = () => {
       </ScrollView>
 
       <Actions style={[(deviceHeight < contentHeight || isKeyboardOpen) && styles.actionBorder]}>
-        <Button testID="swapButton" shelleyTheme title={strings.swapTitle} onPress={handleOnSwap} disabled={disabled} />
+        <Button testID="swapButton" title={strings.swapTitle} onPress={handleOnSwap} disabled={disabled} />
       </Actions>
     </View>
   )
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
index 356d0e837c..8e6ddcd7e7 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
@@ -22,7 +22,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Banner} from '../../../../components/Banner/Banner'
 import {Boundary} from '../../../../components/Boundary/Boundary'
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {CopyButton} from '../../../../components/CopyButton'
 import {FadeIn} from '../../../../components/FadeIn'
 import {Icon} from '../../../../components/Icon'
@@ -187,7 +187,6 @@ export const TxDetails = () => {
             <Button
               onPress={() => Linking.openURL(explorers.cardanoscan.tx(transaction.id))}
               title={strings.openInExplorer}
-              shelleyTheme
             />
           </Actions>
         )}
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
index 682d031963..b3ce98bf28 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Image, ImageSourcePropType, StyleSheet, TouchableOpacity, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {Icon} from '../../../../components/Icon'
 import {Text} from '../../../../components/Text'
 
diff --git a/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx b/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
index 2e2caa7748..88b2c43e98 100644
--- a/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
+++ b/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/Button'
+import {Button} from '../../../../components/Button/NewButton'
 import {ScrollView, useScrollView} from '../../../../components/ScrollView/ScrollView'
 import {Space} from '../../../../components/Space/Space'
 import {isDev} from '../../../../kernel/env'
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
index 4a391c6cfe..e1758d61af 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, Text, View} from 'react-native'
 
 import {Boundary} from '../../../components/Boundary/Boundary'
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Checkbox} from '../../../components/Checkbox/Checkbox'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {PleaseWaitView} from '../../../components/PleaseWaitModal'
@@ -122,7 +122,6 @@ const WithdrawalTxForm = ({wallet, onDone}: {wallet: YoroiWallet; onDone: (withd
 
       <View style={[styles.actions, isScrollBarShown && {borderTopWidth: 1, borderTopColor: colors.lightGray}]}>
         <Button
-          shelleyTheme
           onPress={() => setDeregister(false)}
           title={strings.keepButton}
           disabled={!hasRewards || isLoading}
diff --git a/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx b/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
index 38d488b96c..c6fc87218a 100644
--- a/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
+++ b/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
@@ -14,7 +14,7 @@ import {Observer} from 'rxjs'
 import bleImage from '../../../assets/img/bluetooth.png'
 import usbImage from '../../../assets/img/ledger-nano-usb.png'
 import {BulletPointItem} from '../../../components/BulletPointItem'
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Loading} from '../../../components/Loading/Loading'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
@@ -299,7 +299,6 @@ class LedgerConnectInt extends React.Component<Props, State> {
 
         {useUSB === true && (
           <Button
-            shelleyTheme
             onPress={() => {
               if (refreshing || deviceObj == null || waiting) {
                 return Alert.alert(
diff --git a/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx b/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
index 6f1dcd4ae7..02ac0f633a 100644
--- a/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
+++ b/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {Alert, Platform, ScrollView, StyleSheet} from 'react-native'
 import DeviceInfo from 'react-native-device-info'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Space} from '../../../components/Space/Space'
 import {Text} from '../../../components/Text'
 import globalMessages from '../../../kernel/i18n/global-messages'
@@ -57,8 +57,6 @@ export const LedgerTransportSwitchView = ({onSelectUSB, onSelectBLE}: Props) =>
       <Space height="md" />
 
       <Button
-        block
-        shelleyTheme
         onPress={onSelectUSB}
         title={getUsbButtonTitle()}
         disabled={!isUSBSupported || !HARDWARE_WALLETS.LEDGER_NANO.ENABLE_USB_TRANSPORT}
@@ -71,13 +69,7 @@ export const LedgerTransportSwitchView = ({onSelectUSB, onSelectBLE}: Props) =>
 
       <Space height="md" />
 
-      <Button
-        block
-        shelleyTheme
-        onPress={() => request()}
-        title={strings.bluetoothButton}
-        testID="connectWithBLEButton"
-      />
+      <Button onPress={() => request()} title={strings.bluetoothButton} testID="connectWithBLEButton" />
     </ScrollView>
   )
 }
diff --git a/apps/wallet-mobile/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx b/apps/wallet-mobile/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx
index 5a76f87b02..a55acad821 100644
--- a/apps/wallet-mobile/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx
@@ -110,7 +110,6 @@ export const DelegationConfirmation = () => {
 
       <ConfirmTx
         buttonProps={{
-          shelleyTheme: true,
           title: strings.delegateButtonLabel,
         }}
         isProvidingPassword
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
index 726cf4b940..74b420c750 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet} from 'react-native'
 import {useQuery} from 'react-query'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {GradientWarning} from '../../../components/ChainWarning/GradientWarning'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {TextInput} from '../../../components/TextInput/TextInput'
@@ -48,7 +48,6 @@ export const PoolDetailScreen = ({onPressDelegate, disabled = false}: Props) =>
       <Spacer fill />
 
       <Button
-        shelleyTheme
         onPress={handleOnPress}
         title={strings.next}
         style={styles.button}
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
index 0e3dd7555b..cc708c45e7 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button} from '../../../components/Button/Button'
+import {Button} from '../../../components/Button/NewButton'
 import {Icon} from '../../../components/Icon'
 import {Space} from '../../../components/Space/Space'
 import {formatTimeSpan} from '../../../yoroi-wallets/utils/timeUtils'
@@ -36,7 +36,7 @@ export const PoolTransitionNotice = () => {
       </Text>
 
       <Actions>
-        <Button style={styles.noticeButton} onPress={navigateToUpdate} title={strings.update} block />
+        <Button style={styles.noticeButton} onPress={navigateToUpdate} title={strings.update} />
 
         <Space fill />
       </Actions>
diff --git a/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json b/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
index 532c3fadc1..6c2ac7399f 100644
--- a/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
+++ b/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Show error message",
     "file": "src/components/ErrorModal/ErrorModal.tsx",
     "start": {
-      "line": 152,
+      "line": 146,
       "column": 13,
-      "index": 4225
+      "index": 4163
     },
     "end": {
-      "line": 155,
+      "line": 149,
       "column": 3,
-      "index": 4325
+      "index": 4263
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Hide error message",
     "file": "src/components/ErrorModal/ErrorModal.tsx",
     "start": {
-      "line": 156,
+      "line": 150,
       "column": 13,
-      "index": 4340
+      "index": 4278
     },
     "end": {
-      "line": 159,
+      "line": 153,
       "column": 3,
-      "index": 4440
+      "index": 4378
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json b/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
index bef4514ad1..0ea624a65f 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 64,
       "column": 9,
-      "index": 1678
+      "index": 1668
     },
     "end": {
       "line": 67,
       "column": 3,
-      "index": 1771
+      "index": 1761
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json b/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
index 0a366af910..fb51c03aa8 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 45,
       "column": 9,
-      "index": 1205
+      "index": 1208
     },
     "end": {
       "line": 48,
       "column": 3,
-      "index": 1295
+      "index": 1298
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json b/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
index e5290e3f22..756ad6d3f2 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 182,
       "column": 10,
-      "index": 5253
+      "index": 5243
     },
     "end": {
       "line": 185,
       "column": 3,
-      "index": 5346
+      "index": 5336
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 186,
       "column": 15,
-      "index": 5363
+      "index": 5353
     },
     "end": {
       "line": 190,
       "column": 3,
-      "index": 5551
+      "index": 5541
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 191,
       "column": 15,
-      "index": 5568
+      "index": 5558
     },
     "end": {
       "line": 194,
       "column": 3,
-      "index": 5665
+      "index": 5655
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 195,
       "column": 12,
-      "index": 5679
+      "index": 5669
     },
     "end": {
       "line": 198,
       "column": 3,
-      "index": 5778
+      "index": 5768
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
index 4cfe771548..ef9a7e33f7 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Add token",
     "file": "src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx",
     "start": {
-      "line": 207,
+      "line": 202,
       "column": 12,
-      "index": 6589
+      "index": 6531
     },
     "end": {
-      "line": 210,
+      "line": 205,
       "column": 3,
-      "index": 6666
+      "index": 6608
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
index c3a0851ca0..257ef11f52 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Current password",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 116,
+      "line": 115,
       "column": 25,
-      "index": 4834
+      "index": 4812
     },
     "end": {
-      "line": 119,
+      "line": 118,
       "column": 3,
-      "index": 4956
+      "index": 4934
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!New password",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 120,
+      "line": 119,
       "column": 25,
-      "index": 4983
+      "index": 4961
     },
     "end": {
-      "line": 123,
+      "line": 122,
       "column": 3,
-      "index": 5101
+      "index": 5079
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Minimum {requirePasswordLength} characters",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 124,
+      "line": 123,
       "column": 31,
-      "index": 5134
+      "index": 5112
     },
     "end": {
-      "line": 127,
+      "line": 126,
       "column": 3,
-      "index": 5299
+      "index": 5277
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Repeat new password",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 128,
+      "line": 127,
       "column": 28,
-      "index": 5329
+      "index": 5307
     },
     "end": {
-      "line": 131,
+      "line": 130,
       "column": 3,
-      "index": 5457
+      "index": 5435
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Passwords do not match",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 132,
+      "line": 131,
       "column": 36,
-      "index": 5495
+      "index": 5473
     },
     "end": {
-      "line": 135,
+      "line": 134,
       "column": 3,
-      "index": 5634
+      "index": 5612
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Change password",
     "file": "src/features/Settings/ChangePassword/ChangePasswordScreen.tsx",
     "start": {
-      "line": 136,
+      "line": 135,
       "column": 18,
-      "index": 5654
+      "index": 5632
     },
     "end": {
-      "line": 139,
+      "line": 138,
       "column": 3,
-      "index": 5768
+      "index": 5746
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
index fe64562606..4e48f09071 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 48,
       "column": 18,
-      "index": 1543
+      "index": 1533
     },
     "end": {
       "line": 51,
       "column": 3,
-      "index": 1745
+      "index": 1735
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 52,
       "column": 17,
-      "index": 1764
+      "index": 1754
     },
     "end": {
       "line": 55,
       "column": 3,
-      "index": 1878
+      "index": 1868
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
index f6f20b2b18..5ac6d7f714 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!This option will allow you to send transactions from your wallet just by confirming with fingerprint or face recognition with standard system fallback option. This makes your wallet less secure. This is a compromise between UX and security!",
     "file": "src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx",
     "start": {
-      "line": 93,
+      "line": 92,
       "column": 17,
-      "index": 3252
+      "index": 3230
     },
     "end": {
-      "line": 101,
+      "line": 100,
       "column": 3,
-      "index": 3648
+      "index": 3626
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Please remember your master password, as you may need it in case your biometrics data are removed from the device.",
     "file": "src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx",
     "start": {
-      "line": 102,
+      "line": 101,
       "column": 17,
-      "index": 3667
+      "index": 3645
     },
     "end": {
-      "line": 107,
+      "line": 106,
       "column": 3,
-      "index": 3904
+      "index": 3882
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Master password",
     "file": "src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx",
     "start": {
-      "line": 108,
+      "line": 107,
       "column": 22,
-      "index": 3928
+      "index": 3906
     },
     "end": {
-      "line": 111,
+      "line": 110,
       "column": 3,
-      "index": 4056
+      "index": 4034
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Enable",
     "file": "src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx",
     "start": {
-      "line": 112,
+      "line": 111,
       "column": 16,
-      "index": 4074
+      "index": 4052
     },
     "end": {
-      "line": 115,
+      "line": 114,
       "column": 3,
-      "index": 4185
+      "index": 4163
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
index c26e2b407c..34f5a54bbb 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 109,
       "column": 25,
-      "index": 3918
+      "index": 3921
     },
     "end": {
       "line": 112,
       "column": 3,
-      "index": 4112
+      "index": 4115
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 113,
       "column": 25,
-      "index": 4139
+      "index": 4142
     },
     "end": {
       "line": 116,
       "column": 3,
-      "index": 4296
+      "index": 4299
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 117,
       "column": 14,
-      "index": 4312
+      "index": 4315
     },
     "end": {
       "line": 120,
       "column": 3,
-      "index": 4416
+      "index": 4419
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 121,
       "column": 19,
-      "index": 4437
+      "index": 4440
     },
     "end": {
       "line": 124,
       "column": 3,
-      "index": 4546
+      "index": 4549
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 125,
       "column": 27,
-      "index": 4575
+      "index": 4578
     },
     "end": {
       "line": 128,
       "column": 3,
-      "index": 4707
+      "index": 4710
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 129,
       "column": 10,
-      "index": 4719
+      "index": 4722
     },
     "end": {
       "line": 132,
       "column": 3,
-      "index": 4821
+      "index": 4824
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 133,
       "column": 26,
-      "index": 4849
+      "index": 4852
     },
     "end": {
       "line": 137,
       "column": 3,
-      "index": 5063
+      "index": 5066
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
index 4344b5a794..00d321c66e 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Change name",
     "file": "src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx",
     "start": {
-      "line": 104,
+      "line": 103,
       "column": 16,
-      "index": 3321
+      "index": 3299
     },
     "end": {
-      "line": 107,
+      "line": 106,
       "column": 3,
-      "index": 3425
+      "index": 3403
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Wallet name",
     "file": "src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx",
     "start": {
-      "line": 108,
+      "line": 107,
       "column": 24,
-      "index": 3451
+      "index": 3429
     },
     "end": {
-      "line": 111,
+      "line": 110,
       "column": 3,
-      "index": 3563
+      "index": 3541
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.json b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.json
index 1169fd38eb..1fb9dbdab4 100644
--- a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!My read-only wallet",
     "file": "src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx",
     "start": {
-      "line": 155,
+      "line": 151,
       "column": 21,
-      "index": 4929
+      "index": 4821
     },
     "end": {
-      "line": 158,
+      "line": 154,
       "column": 3,
-      "index": 5056
+      "index": 4948
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Checksum label",
     "file": "src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx",
     "start": {
-      "line": 159,
+      "line": 155,
       "column": 17,
-      "index": 5075
+      "index": 4967
     },
     "end": {
-      "line": 162,
+      "line": 158,
       "column": 3,
-      "index": 5189
+      "index": 5081
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Wallet Address(es):",
     "file": "src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx",
     "start": {
-      "line": 163,
+      "line": 159,
       "column": 22,
-      "index": 5213
+      "index": 5105
     },
     "end": {
-      "line": 166,
+      "line": 162,
       "column": 3,
-      "index": 5337
+      "index": 5229
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Key:",
     "file": "src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx",
     "start": {
-      "line": 167,
+      "line": 163,
       "column": 7,
-      "index": 5346
+      "index": 5238
     },
     "end": {
-      "line": 170,
+      "line": 166,
       "column": 3,
-      "index": 5444
+      "index": 5336
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Derivation path:",
     "file": "src/features/SetupWallet/legacy/SaveReadOnlyWallet/SaveReadOnlyWalletScreen.tsx",
     "start": {
-      "line": 171,
+      "line": 167,
       "column": 18,
-      "index": 5464
+      "index": 5356
     },
     "end": {
-      "line": 174,
+      "line": 170,
       "column": 3,
-      "index": 5585
+      "index": 5477
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
index eb276b1507..25a3a638fd 100644
--- a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
+++ b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Wallet name",
     "file": "src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx",
     "start": {
-      "line": 141,
+      "line": 133,
       "column": 24,
-      "index": 4302
+      "index": 4122
     },
     "end": {
-      "line": 144,
+      "line": 136,
       "column": 3,
-      "index": 4410
+      "index": 4230
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Save",
     "file": "src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx",
     "start": {
-      "line": 145,
+      "line": 137,
       "column": 8,
-      "index": 4420
+      "index": 4240
     },
     "end": {
-      "line": 148,
+      "line": 140,
       "column": 3,
-      "index": 4523
+      "index": 4343
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
index 1bdc0ad25c..744a52f9aa 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Your Summary",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 162,
+      "line": 163,
       "column": 9,
-      "index": 4849
+      "index": 4889
     },
     "end": {
-      "line": 165,
+      "line": 166,
       "column": 3,
-      "index": 4951
+      "index": 4991
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Total Rewards",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 166,
+      "line": 167,
       "column": 16,
-      "index": 4969
+      "index": 5009
     },
     "end": {
-      "line": 169,
+      "line": 170,
       "column": 3,
-      "index": 5079
+      "index": 5119
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Total Delegated",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 170,
+      "line": 171,
       "column": 18,
-      "index": 5099
+      "index": 5139
     },
     "end": {
-      "line": 173,
+      "line": 174,
       "column": 3,
-      "index": 5213
+      "index": 5253
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Withdraw",
     "file": "src/legacy/Dashboard/UserSummary.tsx",
     "start": {
-      "line": 174,
+      "line": 175,
       "column": 23,
-      "index": 5238
+      "index": 5278
     },
     "end": {
-      "line": 177,
+      "line": 178,
       "column": 3,
-      "index": 5350
+      "index": 5390
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
index 9be223b2e9..27310ccb39 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Also deregister staking key?",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 167,
+      "line": 166,
       "column": 21,
-      "index": 6137
+      "index": 6117
     },
     "end": {
-      "line": 170,
+      "line": 169,
       "column": 3,
-      "index": 6265
+      "index": 6245
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!When <b>withdrawing rewards</b>, you also have the option to deregister the staking key.",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 171,
+      "line": 170,
       "column": 16,
-      "index": 6283
+      "index": 6263
     },
     "end": {
-      "line": 174,
+      "line": 173,
       "column": 3,
-      "index": 6466
+      "index": 6446
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!<b>Keeping the staking key</b> will allow you to withdraw the rewards, but continue delegating to the same pool.",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 175,
+      "line": 174,
       "column": 16,
-      "index": 6484
+      "index": 6464
     },
     "end": {
-      "line": 180,
+      "line": 179,
       "column": 3,
-      "index": 6708
+      "index": 6688
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!<b>Deregistering the staking key</b> will give you back your deposit and undelegate the key from any pool.",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 181,
+      "line": 180,
       "column": 16,
-      "index": 6726
+      "index": 6706
     },
     "end": {
-      "line": 185,
+      "line": 184,
       "column": 3,
-      "index": 6933
+      "index": 6913
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!You do NOT need to deregister to delegate to a different stake pool. You can change your delegation preference at any time.",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 186,
+      "line": 185,
       "column": 12,
-      "index": 6947
+      "index": 6927
     },
     "end": {
-      "line": 191,
+      "line": 190,
       "column": 3,
-      "index": 7178
+      "index": 7158
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!You should NOT deregister if this staking key is used as a stake pool's reward account, as this will cause all pool operator rewards to be sent back to the reserve.",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 192,
+      "line": 191,
       "column": 12,
-      "index": 7192
+      "index": 7172
     },
     "end": {
-      "line": 198,
+      "line": 197,
       "column": 3,
-      "index": 7475
+      "index": 7455
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Deregistering means this key will no longer receive rewards until you re-register the staking key (usually by delegating to a pool again)",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 199,
+      "line": 198,
       "column": 12,
-      "index": 7489
+      "index": 7469
     },
     "end": {
-      "line": 204,
+      "line": 203,
       "column": 3,
-      "index": 7734
+      "index": 7714
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Keep registered",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 205,
+      "line": 204,
       "column": 14,
-      "index": 7750
+      "index": 7730
     },
     "end": {
-      "line": 208,
+      "line": 207,
       "column": 3,
-      "index": 7858
+      "index": 7838
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Deregister",
     "file": "src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx",
     "start": {
-      "line": 209,
+      "line": 208,
       "column": 20,
-      "index": 7880
+      "index": 7860
     },
     "end": {
-      "line": 212,
+      "line": 211,
       "column": 3,
-      "index": 7989
+      "index": 7969
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
index 22361fd10d..af053c0bc0 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Scanning bluetooth devices...",
     "file": "src/legacy/HW/LedgerConnect/LedgerConnect.tsx",
     "start": {
-      "line": 329,
+      "line": 328,
       "column": 11,
-      "index": 10151
+      "index": 10129
     },
     "end": {
-      "line": 332,
+      "line": 331,
       "column": 3,
-      "index": 10285
+      "index": 10263
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!You'll need to:",
     "file": "src/legacy/HW/LedgerConnect/LedgerConnect.tsx",
     "start": {
-      "line": 333,
+      "line": 332,
       "column": 13,
-      "index": 10300
+      "index": 10278
     },
     "end": {
-      "line": 336,
+      "line": 335,
       "column": 3,
-      "index": 10422
+      "index": 10400
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!USB device is ready, please tap on Confirm to continue.",
     "file": "src/legacy/HW/LedgerConnect/LedgerConnect.tsx",
     "start": {
-      "line": 337,
+      "line": 336,
       "column": 18,
-      "index": 10442
+      "index": 10420
     },
     "end": {
-      "line": 340,
+      "line": 339,
       "column": 3,
-      "index": 10587
+      "index": 10565
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!An error occurred while trying to connect with your hardware wallet:",
     "file": "src/legacy/HW/LedgerConnect/LedgerConnect.tsx",
     "start": {
-      "line": 341,
+      "line": 340,
       "column": 9,
-      "index": 10598
+      "index": 10576
     },
     "end": {
-      "line": 344,
+      "line": 343,
       "column": 3,
-      "index": 10769
+      "index": 10747
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
index 8e6000cf84..012ef49b3d 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Choose Connection Method",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 88,
+      "line": 80,
       "column": 9,
-      "index": 2501
+      "index": 2404
     },
     "end": {
-      "line": 91,
+      "line": 83,
       "column": 3,
-      "index": 2619
+      "index": 2522
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Choose this option if you want to connect to a Ledger Nano model X or S using an on-the-go USB cable adaptor:",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 92,
+      "line": 84,
       "column": 18,
-      "index": 2639
+      "index": 2542
     },
     "end": {
-      "line": 97,
+      "line": 89,
       "column": 3,
-      "index": 2868
+      "index": 2771
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Connect with USB",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 98,
+      "line": 90,
       "column": 13,
-      "index": 2883
+      "index": 2786
     },
     "end": {
-      "line": 101,
+      "line": 93,
       "column": 3,
-      "index": 2997
+      "index": 2900
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Connect with USB\n(Not supported)",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 102,
+      "line": 94,
       "column": 25,
-      "index": 3024
+      "index": 2927
     },
     "end": {
-      "line": 105,
+      "line": 97,
       "column": 3,
-      "index": 3167
+      "index": 3070
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Connect with USB\n(Blocked by Apple for iOS)",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 106,
+      "line": 98,
       "column": 21,
-      "index": 3190
+      "index": 3093
     },
     "end": {
-      "line": 109,
+      "line": 101,
       "column": 3,
-      "index": 3340
+      "index": 3243
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Choose this option if you want to connect to a Ledger Nano model X through Bluetooth:",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 110,
+      "line": 102,
       "column": 24,
-      "index": 3366
+      "index": 3269
     },
     "end": {
-      "line": 113,
+      "line": 105,
       "column": 3,
-      "index": 3560
+      "index": 3463
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Connect with Bluetooth",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 114,
+      "line": 106,
       "column": 19,
-      "index": 3581
+      "index": 3484
     },
     "end": {
-      "line": 117,
+      "line": 109,
       "column": 3,
-      "index": 3707
+      "index": 3610
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Connect with Bluetooth",
     "file": "src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx",
     "start": {
-      "line": 118,
+      "line": 110,
       "column": 18,
-      "index": 3727
+      "index": 3630
     },
     "end": {
-      "line": 121,
+      "line": 113,
       "column": 3,
-      "index": 3837
+      "index": 3740
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.json b/apps/wallet-mobile/translations/messages/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.json
index 34054662a0..bbcb9ea99a 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Delegate",
     "file": "src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx",
     "start": {
-      "line": 188,
+      "line": 187,
       "column": 23,
-      "index": 6026
+      "index": 5996
     },
     "end": {
-      "line": 191,
+      "line": 190,
       "column": 3,
-      "index": 6140
+      "index": 6110
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!of fees",
     "file": "src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx",
     "start": {
-      "line": 192,
+      "line": 191,
       "column": 10,
-      "index": 6152
+      "index": 6122
     },
     "end": {
-      "line": 195,
+      "line": 194,
       "column": 3,
-      "index": 6252
+      "index": 6222
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Current approximation of rewards that you will receive per epoch:",
     "file": "src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx",
     "start": {
-      "line": 196,
+      "line": 195,
       "column": 22,
-      "index": 6276
+      "index": 6246
     },
     "end": {
-      "line": 199,
+      "line": 198,
       "column": 3,
-      "index": 6446
+      "index": 6416
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Unknown pool",
     "file": "src/legacy/Staking/DelegationConfirmation/DelegationConfirmation.tsx",
     "start": {
-      "line": 200,
+      "line": 199,
       "column": 15,
-      "index": 6463
+      "index": 6433
     },
     "end": {
-      "line": 203,
+      "line": 202,
       "column": 3,
-      "index": 6582
+      "index": 6552
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json b/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
index 67040843a3..f102e64743 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Delegate",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 92,
+      "line": 91,
       "column": 12,
-      "index": 2696
+      "index": 2678
     },
     "end": {
-      "line": 95,
+      "line": 94,
       "column": 3,
-      "index": 2810
+      "index": 2792
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Next",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 96,
+      "line": 95,
       "column": 8,
-      "index": 2820
+      "index": 2802
     },
     "end": {
-      "line": 99,
+      "line": 98,
       "column": 3,
-      "index": 2879
+      "index": 2861
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Stake pool hash",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 100,
+      "line": 99,
       "column": 12,
-      "index": 2893
+      "index": 2875
     },
     "end": {
-      "line": 103,
+      "line": 102,
       "column": 3,
-      "index": 2980
+      "index": 2962
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Enter test stake pool ID",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 104,
+      "line": 103,
       "column": 10,
-      "index": 2992
+      "index": 2974
     },
     "end": {
-      "line": 107,
+      "line": 106,
       "column": 3,
-      "index": 3086
+      "index": 3068
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Invalid pool ID. Please retype.",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 108,
+      "line": 107,
       "column": 17,
-      "index": 3105
+      "index": 3087
     },
     "end": {
-      "line": 111,
+      "line": 110,
       "column": 3,
-      "index": 3208
+      "index": 3190
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Stake test ADA and support Yoroi 💥",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 112,
+      "line": 111,
       "column": 19,
-      "index": 3229
+      "index": 3211
     },
     "end": {
-      "line": 115,
+      "line": 114,
       "column": 3,
-      "index": 3360
+      "index": 3342
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Experience the mechanism of staking firsthand and help us improve Yoroi's functionality and user experience.",
     "file": "src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx",
     "start": {
-      "line": 116,
+      "line": 115,
       "column": 18,
-      "index": 3380
+      "index": 3362
     },
     "end": {
-      "line": 120,
+      "line": 119,
       "column": 3,
-      "index": 3589
+      "index": 3571
     }
   }
 ]
\ No newline at end of file

From 6c23cfcc3990b76161055b4e6c5e16e472342d9d Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 15:33:26 +0200
Subject: [PATCH 04/16] button refactor completed

---
 .../src/components/Analytics/Analytics.tsx    |  2 +-
 .../src/components/Boundary/Boundary.tsx      |  2 +-
 .../src/components/Button/Button.stories.tsx  |  2 +-
 .../Button/{NewButton.tsx => Button.tsx}      |  0
 .../CameraCodeScanner.stories.tsx             |  2 +-
 .../src/components/ConfirmTx/ConfirmTx.tsx    |  2 +-
 .../ConfirmTxWithSpendingPasswordModal.tsx    |  2 +-
 .../src/components/CopyButton.tsx             |  2 +-
 .../ErrorBoundary/ErrorBoundary.tsx           |  2 +-
 .../src/components/ErrorModal/ErrorModal.tsx  |  2 +-
 .../HideableText/HideableText.stories.tsx     |  2 +-
 .../src/components/ModalError/ModalError.tsx  |  2 +-
 .../TwoActionView/TwoActionView.tsx           |  2 +-
 .../OsAuthScreen/OsAuthScreen.stories.tsx     |  2 +-
 .../Auth/OsLoginScreen/OsLoginScreen.tsx      |  2 +-
 .../Auth/PinInput/PinInput.stories.tsx        |  2 +-
 .../Claim/useCases/AskConfirmation.tsx        |  2 +-
 .../Claim/useCases/ShowSuccessScreen.tsx      |  2 +-
 .../src/features/Dev/DeveloperScreen.tsx      |  2 +-
 .../common/ConfirmConnectionModal.stories.tsx |  2 +-
 .../common/ConfirmConnectionModal.tsx         |  2 +-
 .../Discover/common/HWNotSupportedModal.tsx   |  2 +-
 .../common/UnverifiedDappModal.stories.tsx    |  2 +-
 .../Discover/common/UnverifiedDappModal.tsx   |  2 +-
 .../ReviewTransaction/ReviewTransaction.tsx   |  2 +-
 .../SelectDappFromList/WelcomeDAppModal.tsx   |  2 +-
 .../common/ShowBuyBanner/BuyBannerBig.tsx     |  2 +-
 .../common/ShowBuyBanner/BuyBannerSmall.tsx   |  2 +-
 .../ShowBuyBanner/PreprodFaucetBanner.tsx     |  2 +-
 .../ShowBuyBanner/SanchonetFaucetBanner.tsx   |  2 +-
 .../CreateExchangeButton.tsx                  |  2 +-
 .../LoadingLink/ErrorScreen.tsx               |  2 +-
 .../ShowExchangeResultOrderScreen.tsx         |  2 +-
 .../ChooseBiometricLoginScreen.tsx            |  2 +-
 .../DarkThemeAnnouncement.tsx                 |  2 +-
 .../InitialScreen/InitialScreen.tsx           |  2 +-
 .../TermsOfServiceChangedScreen.tsx           |  2 +-
 .../AskToOpenAWalletScreen.tsx                |  2 +-
 .../AskToRedirect/AskToRedirectScreen.tsx     |  2 +-
 .../RequestedAdaPaymentWithLinkScreen.tsx     |  2 +-
 .../RequestedBrowserLaunchDappUrlScreen.tsx   |  2 +-
 .../BuyADABanner/BuyADABanner.tsx             |  2 +-
 .../DashboardTokensList/TradeTokensBanner.tsx |  2 +-
 .../Portfolio/useCases/PortfolioScreen.tsx    |  2 +-
 .../PortfolioTokenDetails/Actions.tsx         |  2 +-
 .../TradeTokensBannerBig.tsx                  |  2 +-
 .../SingleOrMultipleAddressesModal.tsx        |  2 +-
 .../DescribeSelectedAddressScreen.tsx         |  2 +-
 .../useCases/ListMultipleAddressesScreen.tsx  |  2 +-
 .../useCases/RequestSpecificAmountScreen.tsx  |  2 +-
 .../common/InsufficientFundsModal.tsx         |  2 +-
 .../useCases/ConfirmPin/ConfirmPin.tsx        |  2 +-
 .../ConfirmVotingTx/ConfirmVotingTx.tsx       |  2 +-
 .../useCases/DisplayPin/DisplayPin.tsx        |  2 +-
 .../DownloadCatalystAppScreen.tsx             |  2 +-
 .../useCases/ShowQrCode/ShowQrCode.tsx        |  2 +-
 .../OpenDeviceAppSettingsButton.tsx           |  2 +-
 .../ShowCameraPermissionDeniedScreen.tsx      |  2 +-
 .../ConfirmTx/FailedTx/FailedTxScreen.tsx     |  2 +-
 .../SubmittedTx/SubmittedTxScreen.tsx         |  2 +-
 .../EditAmount/EditAmountScreen.tsx           |  2 +-
 .../ListAmountsToSendScreen.tsx               |  2 +-
 .../StartMultiTokenTxScreen.tsx               |  2 +-
 .../ChangeNetwork/ChangeNetworkScreen.tsx     |  2 +-
 .../Settings/ChangeNetwork/NetworkTag.tsx     |  2 +-
 .../ChangePassword/ChangePasswordScreen.tsx   |  2 +-
 .../DisableEasyConfirmationScreen.tsx         |  2 +-
 .../EnableEasyConfirmationScreen.tsx          |  2 +-
 .../EnableLoginWithOsScreen.tsx               |  2 +-
 .../ConfirmTx/FailedTx/FailedTxScreen.tsx     |  2 +-
 .../SubmittedTx/SubmittedTxScreen.tsx         |  2 +-
 .../ManageCollateralScreen.tsx                |  2 +-
 .../RemoveWallet/RemoveWalletScreen.tsx       |  2 +-
 .../RenameWalletScreen/RenameWalletScreen.tsx |  2 +-
 .../WalletDuplicatedModal.tsx                 |  2 +-
 .../legacy/WalletNameForm/WalletNameForm.tsx  |  2 +-
 .../AboutRecoveryPhraseScreen.tsx             |  2 +-
 .../CreateWallet/RecoveryPhraseScreen.tsx     |  2 +-
 .../VerifyRecoveryPhraseScreen.tsx            |  2 +-
 .../CreateWallet/WalletDetailsScreen.tsx      |  2 +-
 .../RestoreHwWallet/CheckNanoXScreen.tsx      |  2 +-
 .../RestoreHwWallet/SaveNanoXScreen.tsx       |  2 +-
 .../SelectHwConnectionModal.tsx               |  2 +-
 .../RestoreWalletDetailsScreen.tsx            |  2 +-
 .../RestoreWallet/RestoreWalletScreen.tsx     |  2 +-
 .../useCases/ConfirmTx/ConfirmTxScreen.tsx    |  2 +-
 .../EnterDrepIdModal/EnterDrepIdModal.tsx     |  2 +-
 .../useCases/FailedTx/FailedTxScreen.tsx      |  2 +-
 .../useCases/NoFunds/NoFundsScreen.tsx        |  2 +-
 .../NotSupportedCardanoAppVersion.tsx         |  2 +-
 .../useCases/SuccessTx/SuccessTxScreen.tsx    |  2 +-
 .../WithdrawWarningModal.tsx                  |  2 +-
 .../ConfirmWithSpendingPassword.tsx           |  2 +-
 .../ServiceUnavailable/ServiceUnavailable.tsx |  2 +-
 .../ConfirmTxScreen/ConfirmTxScreen.tsx       |  2 +-
 .../ConfirmTxScreen/LedgerTransportSwitch.tsx |  2 +-
 .../ShowFailedTxScreen/ShowFailedTxScreen.tsx |  2 +-
 .../ShowSubmittedTxScreen.tsx                 |  2 +-
 .../EditSlippageScreen/EditSlippageScreen.tsx |  2 +-
 .../CreateOrder/StartSwapOrderScreen.tsx      |  2 +-
 .../WarnLimitPrice/WarnLimitPrice.tsx         |  2 +-
 .../WarnPriceImpact/WarnPriceImpact.tsx       |  2 +-
 .../CreateOrder/WarnSlippage/WarnSlippage.tsx |  2 +-
 .../ListOrders/OpenOrders.tsx                 |  2 +-
 .../useCases/TxDetails/TxDetails.tsx          |  2 +-
 .../useCases/TxHistory/ActionsBanner.tsx      |  2 +-
 .../useCases/TxHistory/WarningBanner.tsx      |  2 +-
 .../SelectWalletFromListScreen.tsx            |  2 +-
 .../src/legacy/Dashboard/Dashboard.tsx        |  2 +-
 .../src/legacy/Dashboard/StakePoolInfo.tsx    |  2 +-
 .../src/legacy/Dashboard/UserSummary.tsx      |  2 +-
 .../ConfirmTx/ConfirmTxWithPassword.tsx       |  2 +-
 .../WithdrawStakingRewards.tsx                |  2 +-
 .../legacy/HW/LedgerConnect/LedgerConnect.tsx |  2 +-
 .../LedgerTransportSwitchModal.tsx            |  2 +-
 .../Staking/FailedTx/FailedTxScreen.tsx       |  2 +-
 .../Staking/PoolDetails/PoolDetailScreen.tsx  |  2 +-
 .../PoolTransition/PoolTransitionModal.tsx    |  2 +-
 .../PoolTransition/PoolTransitionNotice.tsx   |  2 +-
 .../src/components/Analytics/Analytics.json   | 44 +++++++++----------
 .../src/components/ErrorModal/ErrorModal.json |  8 ++--
 .../Auth/OsLoginScreen/OsLoginScreen.json     |  4 +-
 .../Auth/PinInput/PinInput.stories.json       |  4 +-
 .../DarkThemeAnnouncement.json                | 16 +++----
 .../ListAmountsToSendScreen.json              |  4 +-
 .../ChangePassword/ChangePasswordScreen.json  | 24 +++++-----
 .../DisableEasyConfirmationScreen.json        |  8 ++--
 .../EnableEasyConfirmationScreen.json         | 16 +++----
 .../RemoveWallet/RemoveWalletScreen.json      | 28 ++++++------
 .../legacy/WalletNameForm/WalletNameForm.json |  8 ++--
 .../src/legacy/Dashboard/Dashboard.json       |  4 +-
 .../src/legacy/Dashboard/StakePoolInfo.json   | 20 ++++-----
 .../HW/LedgerConnect/LedgerConnect.json       | 16 +++----
 .../LedgerTransportSwitchModal.json           | 32 +++++++-------
 .../Staking/FailedTx/FailedTxScreen.json      | 16 +++----
 135 files changed, 244 insertions(+), 244 deletions(-)
 rename apps/wallet-mobile/src/components/Button/{NewButton.tsx => Button.tsx} (100%)

diff --git a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
index 91e7bad1ac..b68a63c057 100644
--- a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
+++ b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, TextStyle, TouchableOpacity, useWindowDimensions, View} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button, ButtonType} from '../../components/Button/NewButton'
+import {Button, ButtonType} from '../Button/Button'
 import {Spacer} from '../../components/Spacer/Spacer'
 import {Text} from '../../components/Text'
 import {YoroiLogo} from '../../components/YoroiLogo/YoroiLogo'
diff --git a/apps/wallet-mobile/src/components/Boundary/Boundary.tsx b/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
index 233a4ce926..c5b7a0dab1 100644
--- a/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
+++ b/apps/wallet-mobile/src/components/Boundary/Boundary.tsx
@@ -11,7 +11,7 @@ import {useQueryErrorResetBoundary} from 'react-query'
 
 import image from '../../assets/img/error.png'
 import {LocalizableError} from '../../kernel/i18n/LocalizableError'
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {Space} from '../Space/Space'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
diff --git a/apps/wallet-mobile/src/components/Button/Button.stories.tsx b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
index 104b316ea1..a4ce4c09f5 100644
--- a/apps/wallet-mobile/src/components/Button/Button.stories.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
@@ -5,7 +5,7 @@ import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 
 import {Accordion} from '../Accordion/Accordion'
 import {Icon} from '../Icon'
-import {Button, ButtonType} from './NewButton'
+import {Button, ButtonType} from './Button'
 
 storiesOf('Button', module).add('default', () => {
   const {color, isDark, selectThemeName} = useTheme()
diff --git a/apps/wallet-mobile/src/components/Button/NewButton.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
similarity index 100%
rename from apps/wallet-mobile/src/components/Button/NewButton.tsx
rename to apps/wallet-mobile/src/components/Button/Button.tsx
diff --git a/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx b/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
index 91158b38a5..12c5f69a2e 100644
--- a/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
+++ b/apps/wallet-mobile/src/components/CameraCodeScanner/CameraCodeScanner.stories.tsx
@@ -5,7 +5,7 @@ import {Camera} from 'expo-camera'
 import React from 'react'
 import {Text, View} from 'react-native'
 
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {Spacer} from '../Spacer/Spacer'
 import {CameraCodeScanner} from './CameraCodeScanner'
 
diff --git a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
index 01540ed500..50a236f92e 100644
--- a/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
+++ b/apps/wallet-mobile/src/components/ConfirmTx/ConfirmTx.tsx
@@ -17,7 +17,7 @@ import {useSubmitTx} from '../../yoroi-wallets/hooks'
 import {withBLE, withUSB} from '../../yoroi-wallets/hw/hwWallet'
 import {YoroiSignedTx, YoroiUnsignedTx} from '../../yoroi-wallets/types/yoroi'
 import {delay} from '../../yoroi-wallets/utils/timeUtils'
-import {Button, ButtonProps} from '../Button/NewButton'
+import {Button, ButtonProps} from '../Button/Button'
 import {ValidatedTextInput} from '../ValidatedTextInput'
 import {Dialog, Step as DialogStep} from './Dialog'
 
diff --git a/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx b/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
index a1dbb64938..4ba1158fc7 100644
--- a/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
+++ b/apps/wallet-mobile/src/components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal.tsx
@@ -7,7 +7,7 @@ import {useSelectedWallet} from '../../features/WalletManager/common/hooks/useSe
 import {debugWalletInfo, features} from '../../kernel/features'
 import {useSignTxWithPassword, useSubmitTx} from '../../yoroi-wallets/hooks'
 import {YoroiSignedTx, YoroiUnsignedTx} from '../../yoroi-wallets/types/yoroi'
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
 import {Checkmark, TextInput} from '../TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/components/CopyButton.tsx b/apps/wallet-mobile/src/components/CopyButton.tsx
index 2beca8c003..3528a50606 100644
--- a/apps/wallet-mobile/src/components/CopyButton.tsx
+++ b/apps/wallet-mobile/src/components/CopyButton.tsx
@@ -3,7 +3,7 @@ import React from 'react'
 import {StyleProp, ViewStyle} from 'react-native'
 
 import {Icon} from '../components/Icon'
-import {Button, ButtonType} from './Button/NewButton'
+import {Button, ButtonType} from './Button/Button'
 import {useCopy} from './Clipboard/ClipboardProvider'
 
 type CopyButtonProps = {
diff --git a/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx b/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
index d733482e2c..3dd1b2104c 100644
--- a/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
+++ b/apps/wallet-mobile/src/components/ErrorBoundary/ErrorBoundary.tsx
@@ -4,7 +4,7 @@ import {BackHandler, Image, Platform, ScrollView, StyleSheet, Text, View} from '
 
 import errorImage from '../../assets/img/error.png'
 import {logger} from '../../kernel/logger/logger'
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {CopyButton} from '../CopyButton'
 import {Spacer} from '../Spacer/Spacer'
 import {ExpandableItem} from './ExpandableItem'
diff --git a/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx b/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
index 309ccbd2a1..c4066210bb 100644
--- a/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
+++ b/apps/wallet-mobile/src/components/ErrorModal/ErrorModal.tsx
@@ -6,7 +6,7 @@ import {Image, LayoutAnimation, ScrollView, StyleSheet, Text, TouchableOpacity,
 import image from '../../assets/img/error.png'
 import globalMessages, {errorMessages} from '../../kernel/i18n/global-messages'
 import {isEmptyString} from '../../kernel/utils'
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {Icon} from '../Icon'
 import {Modal} from '../legacy/Modal/Modal'
 
diff --git a/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx b/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
index 7490866166..1146d2ac55 100644
--- a/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
+++ b/apps/wallet-mobile/src/components/HideableText/HideableText.stories.tsx
@@ -4,7 +4,7 @@ import {StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {usePrivacyMode} from '../../features/Settings/PrivacyMode/PrivacyMode'
-import {Button} from '../Button/NewButton'
+import {Button} from '../Button/Button'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
 import {HideableText} from './HideableText'
diff --git a/apps/wallet-mobile/src/components/ModalError/ModalError.tsx b/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
index 4c1e4dc106..f6577e2803 100644
--- a/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
+++ b/apps/wallet-mobile/src/components/ModalError/ModalError.tsx
@@ -9,7 +9,7 @@ import {
   LedgerUserError,
   RejectedByUserError,
 } from '../../yoroi-wallets/hw/hw'
-import {Button, ButtonType} from '../Button/NewButton'
+import {Button, ButtonType} from '../Button/Button'
 import {Icon} from '../Icon'
 import {Space} from '../Space/Space'
 import {Text} from '../Text'
diff --git a/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx b/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
index bc3c75a17f..7a0cd900be 100644
--- a/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
+++ b/apps/wallet-mobile/src/components/TwoActionView/TwoActionView.tsx
@@ -4,7 +4,7 @@ import {useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View} from 'react-native'
 
 import {confirmationMessages} from '../../kernel/i18n/global-messages'
-import {Button, ButtonType} from '../Button/NewButton'
+import {Button, ButtonType} from '../Button/Button'
 import {Space} from '../Space/Space'
 import {Spacer} from '../Spacer/Spacer'
 import {Text} from '../Text'
diff --git a/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx b/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
index e2a0f0d785..c2b03ebe39 100644
--- a/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
+++ b/apps/wallet-mobile/src/features/Auth/OsAuthScreen/OsAuthScreen.stories.tsx
@@ -2,7 +2,7 @@ import {action} from '@storybook/addon-actions'
 import {storiesOf} from '@storybook/react-native'
 import React from 'react'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {OsAuthScreen} from './OsAuthScreen'
 
 storiesOf('OsAuthScreen', module)
diff --git a/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx b/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
index 426455e000..b2dfa77f0c 100644
--- a/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
+++ b/apps/wallet-mobile/src/features/Auth/OsLoginScreen/OsLoginScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {logger} from '../../../kernel/logger/logger'
 import {useAuth} from '../AuthProvider'
 import {useAuthWithOs} from '../common/hooks'
diff --git a/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx b/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
index d8f8569ec1..79d11cf444 100644
--- a/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
+++ b/apps/wallet-mobile/src/features/Auth/PinInput/PinInput.stories.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {PIN_LENGTH} from '../common/constants'
 import {PinInput, PinInputRef} from './PinInput'
 
diff --git a/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx b/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
index 2e5d8283cc..7290ccadc2 100644
--- a/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
+++ b/apps/wallet-mobile/src/features/Claim/useCases/AskConfirmation.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {Platform, ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {useStrings} from '../common/useStrings'
diff --git a/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx b/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
index b6b45b1e2f..39a66caca0 100644
--- a/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
+++ b/apps/wallet-mobile/src/features/Claim/useCases/ShowSuccessScreen.tsx
@@ -6,7 +6,7 @@ import React from 'react'
 import {FlatList, Linking, Platform, StyleSheet, Text, TextProps, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {CopyButton} from '../../../components/CopyButton'
 import {Icon} from '../../../components/Icon'
 import {PressableIcon} from '../../../components/PressableIcon/PressableIcon'
diff --git a/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx b/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
index e234e1ec2b..6072250537 100644
--- a/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
+++ b/apps/wallet-mobile/src/features/Dev/DeveloperScreen.tsx
@@ -10,7 +10,7 @@ import {useIntl} from 'react-intl'
 import {Alert, InteractionManager, SafeAreaView, ScrollView, StyleSheet, TouchableOpacity} from 'react-native'
 import config from 'react-native-config'
 
-import {Button} from '../../components/Button/NewButton'
+import {Button} from '../../components/Button/Button'
 import {Text} from '../../components/Text'
 import {TextInput} from '../../components/TextInput/TextInput'
 import {agreementDate} from '../../kernel/config'
diff --git a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
index cd6c28130d..e2609c068a 100644
--- a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.stories.tsx
@@ -3,7 +3,7 @@ import {storiesOf} from '@storybook/react-native'
 import * as React from 'react'
 import {View} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {ConfirmConnectionModal, useOpenConfirmConnectionModal} from './ConfirmConnectionModal'
 
 storiesOf('Discover ConfirmConnectionModal', module)
diff --git a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
index 251670791e..ee61db03d3 100644
--- a/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/ConfirmConnectionModal.tsx
@@ -3,7 +3,7 @@ import {Image} from 'expo-image'
 import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
diff --git a/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx b/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
index fe7c5f04ea..09db09daee 100644
--- a/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/HWNotSupportedModal.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {Text} from '../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
index fd6f8a6da2..ce31c553a8 100644
--- a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.stories.tsx
@@ -3,7 +3,7 @@ import {storiesOf} from '@storybook/react-native'
 import * as React from 'react'
 import {View} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {UnverifiedDappModal, useOpenUnverifiedDappModal} from './UnverifiedDappModal'
 
 storiesOf('Discover UnverifiedDappModal', module)
diff --git a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
index e0398dbdbf..1fc3169cfb 100644
--- a/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/common/UnverifiedDappModal.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {useStrings} from './useStrings'
diff --git a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
index 8084c59c85..d6e94c7663 100644
--- a/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
+++ b/apps/wallet-mobile/src/features/Discover/useCases/ReviewTransaction/ReviewTransaction.tsx
@@ -11,7 +11,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery} from 'react-query'
 import {z} from 'zod'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {CopyButton} from '../../../../components/CopyButton'
 import {Icon} from '../../../../components/Icon'
 import {ScrollView} from '../../../../components/ScrollView/ScrollView'
diff --git a/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx b/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
index db7cb0a834..08542b6399 100644
--- a/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
+++ b/apps/wallet-mobile/src/features/Discover/useCases/SelectDappFromList/WelcomeDAppModal.tsx
@@ -4,7 +4,7 @@ import {Image, StyleSheet, Text, View} from 'react-native'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 
 import IllustrationDAppImage from '../../../../assets/img/illustration-dapp.png'
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {useShowWelcomeDApp} from '../../common/useShowWelcomeDApp'
 import {useStrings} from '../../common/useStrings'
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
index 331103b685..57ef24707b 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerBig.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {Dimensions, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
index c904e24b01..87123c7856 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {TxHistoryRouteNavigation} from '../../../../kernel/navigation'
 import {useStrings} from '../useStrings'
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
index 603fbbf91a..1d11a92c7f 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/PreprodFaucetBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../useStrings'
diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
index e7eb72c278..1180aae206 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/SanchonetFaucetBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../useStrings'
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
index e7a30cb137..04a3f36e10 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/CreateExchangeButton/CreateExchangeButton.tsx
@@ -4,7 +4,7 @@ import {Chain} from '@yoroi/types'
 import * as React from 'react'
 import {Linking, StyleSheet, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {useWalletManager} from '../../../../WalletManager/context/WalletManagerProvider'
 import {useStrings} from '../../../common/useStrings'
 
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
index afde2c8167..05de4d472c 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/CreateExchangeOrderScreen/LoadingLink/ErrorScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {useModal} from '../../../../../components/Modal/ModalContext'
 import {Space} from '../../../../../components/Space/Space'
 import {useStrings} from '../../../common/useStrings'
diff --git a/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx b/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
index 88fb169625..a3e48a878a 100644
--- a/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/useCases/ShowExchangeResultOrderScreen/ShowExchangeResultOrderScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx b/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
index 6abf888e44..bd3b45bab9 100644
--- a/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/ChooseBiometricLogin/ChooseBiometricLoginScreen.tsx
@@ -6,7 +6,7 @@ import DeviceInfo from 'react-native-device-info'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {Space} from '../../../components/Space/Space'
 import {useEnableAuthWithOs} from '../../Auth/common/hooks'
 import {useStrings} from '../common'
diff --git a/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx b/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
index 21dd383f3a..c5841ffc61 100644
--- a/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Space} from '../../../components/Space/Space'
 import {Text} from '../../../components/Text'
 import {useWalletNavigation} from '../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx b/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
index 2a69539174..93b11374b7 100644
--- a/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/InitialScreen/InitialScreen.tsx
@@ -4,7 +4,7 @@ import {ScrollView, StyleSheet, Text, TextInput, TouchableOpacity, View} from 'r
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BlueCheckbox} from '../../../components/BlueCheckbox/BlueCheckbox'
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Icon} from '../../../components/Icon'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiLogo} from '../../../components/YoroiLogo/YoroiLogo'
diff --git a/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx b/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
index 858b69ad40..3f751b4a8a 100644
--- a/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
+++ b/apps/wallet-mobile/src/features/Initialization/TermsOfServiceChangedScreen/TermsOfServiceChangedScreen.tsx
@@ -4,7 +4,7 @@ import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BlueCheckbox} from '../../../components/BlueCheckbox/BlueCheckbox'
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiLogo} from '../../../components/YoroiLogo/YoroiLogo'
 import {useNavigateTo, useStrings} from '../common'
diff --git a/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
index 0206f1e396..ccf1580d83 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/AskToOpenAWalletScreen/AskToOpenAWalletScreen.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../../common/useStrings'
diff --git a/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
index 7132e622f5..9ad6b2310e 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/AskToRedirect/AskToRedirectScreen.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {Linking, ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../../common/useStrings'
diff --git a/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
index 18ad4bd139..d8f0199d3d 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/RequestedAdaPaymentWithLinkScreen/RequestedAdaPaymentWithLinkScreen.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx b/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
index ef792439a0..fe81d29915 100644
--- a/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
+++ b/apps/wallet-mobile/src/features/Links/useCases/RequestedBrowserLaunchDappUrlScreen/RequestedBrowserLaunchDappUrlScreen.tsx
@@ -4,7 +4,7 @@ import {Links} from '@yoroi/types'
 import * as React from 'react'
 import {ScrollView, StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
index 9d34e874da..6036cadcbc 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/BuyADABanner/BuyADABanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../../components/Button/NewButton'
+import {Button} from '../../../../../../components/Button/Button'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useNavigateTo} from '../../../../common/hooks/useNavigateTo'
 import {useStrings} from '../../../../common/hooks/useStrings'
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
index c08676a8da..c6a1e70330 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioDashboard/DashboardTokensList/TradeTokensBanner.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {useNavigateTo} from '../../../common/hooks/useNavigateTo'
 import {useStrings} from '../../../common/hooks/useStrings'
 import {TradeTokensAsset} from './TradeTokensAsset'
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
index 6967981fb9..375f5e25af 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioScreen.tsx
@@ -3,7 +3,7 @@ import * as React from 'react'
 import {FlatList, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {YoroiWallet} from '../../../yoroi-wallets/cardano/types'
 import {useWalletManager} from '../../WalletManager/context/WalletManagerProvider'
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
index 31659013af..d10f168f97 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokenDetails/Actions.tsx
@@ -5,7 +5,7 @@ import {Chain, Portfolio} from '@yoroi/types'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
 import {useSwapForm} from '../../../Swap/common/SwapFormProvider'
diff --git a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
index 55180314ed..2d446c98e3 100644
--- a/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
+++ b/apps/wallet-mobile/src/features/Portfolio/useCases/PortfolioTokensList/PortfolioWalletTokenList/TradeTokensBannerBig.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {TxHistoryRouteNavigation} from '../../../../../kernel/navigation'
 import {useStrings} from '../../../common/hooks/useStrings'
diff --git a/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx b/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
index bfe639c373..85796715a3 100644
--- a/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
+++ b/apps/wallet-mobile/src/features/Receive/common/SingleOrMultipleAddressesModal/SingleOrMultipleAddressesModal.tsx
@@ -3,7 +3,7 @@ import {Wallet} from '@yoroi/types'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useAddressMode} from '../../../WalletManager/common/hooks/useAddressMode'
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
index 59c4e37336..87ad6ceb4f 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/DescribeSelectedAddressScreen.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {GestureResponderEvent, ScrollView, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
index 99bfcc12ce..810a542829 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/ListMultipleAddressesScreen.tsx
@@ -13,7 +13,7 @@ import {
 import Animated, {Layout} from 'react-native-reanimated'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Space} from '../../../components/Space/Space'
 import {useMetrics} from '../../../kernel/metrics/metricsManager'
 import {useAddressMode} from '../../WalletManager/common/hooks/useAddressMode'
diff --git a/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx b/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
index a1685b8676..00844d490d 100644
--- a/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
+++ b/apps/wallet-mobile/src/features/Receive/useCases/RequestSpecificAmountScreen.tsx
@@ -12,7 +12,7 @@ import {
 } from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
index f8005f76f4..8672b2c5d2 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {useIntl} from 'react-intl'
 import {Platform, StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import globalMessages, {confirmationMessages} from '../../../kernel/i18n/global-messages'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
index a49176e744..a6a260c154 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmPin/ConfirmPin.tsx
@@ -5,7 +5,7 @@ import {ActivityIndicator, ScrollView, StyleSheet, View, ViewProps} from 'react-
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation, UseMutationOptions} from 'react-query'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {BACKSPACE, NumericKeyboard} from '../../../../components/NumericKeyboard'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
index b8664538b3..2ec8266a04 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ConfirmVotingTx/ConfirmVotingTx.tsx
@@ -4,7 +4,7 @@ import React, {useState} from 'react'
 import {ScrollView, StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {ConfirmTxWithHwModal} from '../../../../components/ConfirmTxWithHwModal/ConfirmTxWithHwModal'
 import {ConfirmTxWithOsModal} from '../../../../components/ConfirmTxWithOsModal/ConfirmTxWithOsModal'
 import {ConfirmTxWithSpendingPasswordModal} from '../../../../components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
index f07e7aad3a..98263da081 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DisplayPin/DisplayPin.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {ScrollView, StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Checkbox} from '../../../../components/Checkbox/Checkbox'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
index 848dee138d..39fca85356 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/DownloadCatalystAppScreen/DownloadCatalystAppScreen.tsx
@@ -8,7 +8,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import appstoreBadge from '../../../../assets/img/app-store-badge.png'
 import playstoreBadge from '../../../../assets/img/google-play-badge.png'
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {useStakingInfo} from '../../../../legacy/Dashboard/StakePoolInfos'
diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
index 39c50d2ea2..8970c54a2e 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/useCases/ShowQrCode/ShowQrCode.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {InteractionManager, ScrollView, StyleSheet} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Checkbox} from '../../../../components/Checkbox/Checkbox'
 import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {ShareQRCodeCard} from '../../../../components/ShareQRCodeCard/ShareQRCodeCard'
diff --git a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
index f021952862..36134afdda 100644
--- a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
+++ b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/OpenDeviceAppSettingsButton.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import {openSettings} from 'react-native-permissions'
 
-import {Button, ButtonProps} from '../../../../components/Button/NewButton'
+import {Button, ButtonProps} from '../../../../components/Button/Button'
 import {useStrings} from '../../common/useStrings'
 
 export const OpenDeviceAppSettingsButton = (props: Omit<ButtonProps, 'title' | 'onPress' | ''>) => {
diff --git a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
index b5a8567463..57e195d9de 100644
--- a/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
+++ b/apps/wallet-mobile/src/features/Scan/useCases/ShowCameraPermissionDeniedScreen/ShowCameraPermissionDeniedScreen.tsx
@@ -4,7 +4,7 @@ import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 import {openSettings} from 'react-native-permissions'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {useBlockGoBack, useWalletNavigation} from '../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
index 0e7aec09e9..16dc5bf69d 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/FailedTx/FailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Text} from '../../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
index b761117f3e..1be4dc7051 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTransfer} from '@yoroi/transfer'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Text} from '../../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
index 690e217309..5181b11643 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/EditAmount/EditAmountScreen.tsx
@@ -7,7 +7,7 @@ import * as React from 'react'
 import {InteractionManager, ScrollView, StyleSheet, Text, TouchableOpacity, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {PairedBalance} from '../../../../../components/PairedBalance/PairedBalance'
 import {Space} from '../../../../../components/Space/Space'
diff --git a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
index ecdec21c39..f501779fb7 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx
@@ -12,7 +12,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation} from 'react-query'
 
 import {Boundary} from '../../../../components/Boundary/Boundary'
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import globalMessages from '../../../../kernel/i18n/global-messages'
diff --git a/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx b/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
index 3fee0a854f..bbef78105f 100644
--- a/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Send/useCases/StartMultiTokenTx/StartMultiTokenTxScreen.tsx
@@ -6,7 +6,7 @@ import React from 'react'
 import {StyleSheet, TextInput, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {ScrollView, useScrollView} from '../../../../components/ScrollView/ScrollView'
 import {Space} from '../../../../components/Space/Space'
diff --git a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
index 5927587c19..b6e455d8f9 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/ChangeNetworkScreen.tsx
@@ -6,7 +6,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 import {UseMutationOptions, useQuery, UseQueryOptions} from 'react-query'
 
 import {Boundary} from '../../../components/Boundary/Boundary'
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
index 7c89c4bfe3..ab25f38163 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangeNetwork/NetworkTag.tsx
@@ -3,7 +3,7 @@ import {Chain} from '@yoroi/types'
 import * as React from 'react'
 import {StyleSheet, Text, TextStyle, TouchableOpacity, useWindowDimensions, View, ViewStyle} from 'react-native'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx b/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
index 1a52547155..003c7dd713 100644
--- a/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ChangePassword/ChangePasswordScreen.tsx
@@ -6,7 +6,7 @@ import {ScrollView, StyleSheet, TextInput as RNTextInput, View, ViewProps} from
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {MutationOptions, useMutation} from 'react-query'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Checkmark, TextInput} from '../../../components/TextInput/TextInput'
 import {errorMessages} from '../../../kernel/i18n/global-messages'
diff --git a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
index b515db11d1..cc9b3c57cf 100644
--- a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.tsx
@@ -5,7 +5,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Text} from '../../../components/Text'
 import {useSelectedWallet} from '../../WalletManager/common/hooks/useSelectedWallet'
 import {useWalletManager} from '../../WalletManager/context/WalletManagerProvider'
diff --git a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
index d4726b8ac3..99740f3ff2 100644
--- a/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.tsx
@@ -6,7 +6,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {LoadingOverlay} from '../../../components/LoadingOverlay/LoadingOverlay'
 import {Text} from '../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx b/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
index 1c05f78660..7030a376ef 100644
--- a/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.tsx
@@ -2,7 +2,7 @@ import {useNavigation} from '@react-navigation/native'
 import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import globalMessages from '../../../kernel/i18n/global-messages'
 import {useEnableAuthWithOs} from '../../Auth/common/hooks'
 import {OsAuthScreen} from '../../Auth/OsAuthScreen/OsAuthScreen'
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
index a3db32cade..669a3d070e 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/FailedTx/FailedTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
index 090348c3fa..49077bb6d7 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ConfirmTx/SubmittedTx/SubmittedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
index a6f7ae3c80..d48efa86bf 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/ManageCollateralScreen.tsx
@@ -17,7 +17,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {useMutation} from 'react-query'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {CopyButton} from '../../../components/CopyButton'
 import {ErrorPanel} from '../../../components/ErrorPanel/ErrorPanel'
 import {Icon} from '../../../components/Icon'
diff --git a/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx b/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
index e470aa2e8c..3b1ab1eb9e 100644
--- a/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/RemoveWallet/RemoveWalletScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {InteractionManager, ScrollView, StyleSheet, View, ViewProps} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Checkbox} from '../../../components/Checkbox/Checkbox'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx b/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
index c9f8559306..a0029b57fe 100644
--- a/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/Settings/RenameWalletScreen/RenameWalletScreen.tsx
@@ -5,7 +5,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ScrollView, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {TextInput} from '../../../components/TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx b/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
index a243493fa4..2da9ed1500 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/common/WalletDuplicatedModal/WalletDuplicatedModal.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {Space} from '../../../../components/Space/Space'
 import {useWalletNavigation} from '../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx b/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
index 21938e8884..b7dff231e8 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.tsx
@@ -5,7 +5,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {ActivityIndicator, Image, ImageSourcePropType, ScrollView, StyleSheet, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {ProgressStep} from '../../../../components/ProgressStep'
 import {TextInput} from '../../../../components/TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
index 3147009753..deb7a5fe22 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/AboutRecoveryPhraseScreen.tsx
@@ -5,7 +5,7 @@ import {Linking, ScrollView, StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {ViewProps} from 'react-native-svg/lib/typescript/fabric/utils'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
index 42cce0be60..4c233e9c40 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/RecoveryPhraseScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {Linking, Platform, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {Space} from '../../../../components/Space/Space'
 import {Spacer} from '../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
index 4e884b20ab..e38abc5ac0 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/VerifyRecoveryPhraseScreen.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import Animated, {FadeIn, FadeOut, Layout} from 'react-native-reanimated'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
 import {useMetrics} from '../../../../kernel/metrics/metricsManager'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
index 165667ec71..b7959041ec 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/CreateWallet/WalletDetailsScreen.tsx
@@ -20,7 +20,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {ViewProps} from 'react-native-svg/lib/typescript/fabric/utils'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
index 7510d98212..ab81cec717 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/CheckNanoXScreen.tsx
@@ -7,7 +7,7 @@ import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {BulletPointItem} from '../../../../components/BulletPointItem'
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Space} from '../../../../components/Space/Space'
 import {StepperProgress} from '../../../../components/StepperProgress/StepperProgress'
 import {Text} from '../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
index 7eabab4834..ba2ec7e320 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SaveNanoXScreen.tsx
@@ -18,7 +18,7 @@ import {
 } from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
index adbe3e057a..214968f277 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreHwWallet/SelectHwConnectionModal.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {Alert, Platform, StyleSheet, Text, View} from 'react-native'
 import DeviceInfo from 'react-native-device-info'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {Space} from '../../../../components/Space/Space'
 import {SetupWalletRouteNavigation} from '../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
index 8da52e9978..627618132c 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletDetailsScreen.tsx
@@ -20,7 +20,7 @@ import {
 import {TouchableOpacity} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
diff --git a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
index 274ae3a094..aafd8057b2 100644
--- a/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
+++ b/apps/wallet-mobile/src/features/SetupWallet/useCases/RestoreWallet/RestoreWalletScreen.tsx
@@ -7,7 +7,7 @@ import {Dimensions, Keyboard, Platform, StyleSheet, Text, View} from 'react-nati
 import {FlatList, ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {useModal} from '../../../../components/Modal/ModalContext'
 import {useScrollView} from '../../../../components/ScrollView/ScrollView'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
index 92dca97875..3cc7acdff6 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/ConfirmTx/ConfirmTxScreen.tsx
@@ -5,7 +5,7 @@ import React from 'react'
 import {StyleSheet, View} from 'react-native'
 import {TouchableOpacity} from 'react-native-gesture-handler'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {ConfirmTxWithHwModal} from '../../../../../components/ConfirmTxWithHwModal/ConfirmTxWithHwModal'
 import {ConfirmTxWithOsModal} from '../../../../../components/ConfirmTxWithOsModal/ConfirmTxWithOsModal'
 import {ConfirmTxWithSpendingPasswordModal} from '../../../../../components/ConfirmTxWithSpendingPasswordModal/ConfirmTxWithSpendingPasswordModal'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
index 3cab5cbe26..820a929815 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/EnterDrepIdModal/EnterDrepIdModal.tsx
@@ -4,7 +4,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Alert, Linking, StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {TextInput} from '../../../../../components/TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
index fcebfbc434..59daa327ed 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/FailedTx/FailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
index 2ffebb04c8..58d2f54c9f 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NoFunds/NoFundsScreen.tsx
@@ -4,7 +4,7 @@ import {Chain} from '@yoroi/types'
 import React from 'react'
 import {Linking, StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
index 3a2e43641a..18664b80df 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/NotSupportedCardanoAppVersion/NotSupportedCardanoAppVersion.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {SafeArea} from '../../../../../components/SafeArea'
 import {Space} from '../../../../../components/Space/Space'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
index 7c83447d41..372cc186d1 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/SuccessTx/SuccessTxScreen.tsx
@@ -3,7 +3,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useMetrics} from '../../../../../kernel/metrics/metricsManager'
diff --git a/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx b/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
index 8c08767cc8..dcc723b4f4 100644
--- a/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
+++ b/apps/wallet-mobile/src/features/Staking/Governance/useCases/WithdrawWarningModal/WithdrawWarningModal.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useStrings} from '../../common/strings'
diff --git a/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx b/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
index fadc7c679f..114d756e7a 100644
--- a/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
+++ b/apps/wallet-mobile/src/features/Swap/common/ConfirmWithSpendingPassword/ConfirmWithSpendingPassword.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, TextInput as RNTextInput, View} from 'react-native'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {TextInput} from '../../../../components/TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx b/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
index 97a8048f41..1b248d4aa7 100644
--- a/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
+++ b/apps/wallet-mobile/src/features/Swap/common/ServiceUnavailable/ServiceUnavailable.tsx
@@ -3,7 +3,7 @@ import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {useStrings} from '../strings'
 import {ConectionErrorImage} from './ConectionErrorImage'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
index 3ac3443187..7a6d3281a8 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ConfirmTxScreen.tsx
@@ -5,7 +5,7 @@ import {InteractionManager, StyleSheet, useWindowDimensions, View, ViewProps} fr
 import {ScrollView} from 'react-native-gesture-handler'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {LoadingOverlay} from '../../../../components/LoadingOverlay/LoadingOverlay'
 import {useModal} from '../../../../components/Modal/ModalContext'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
index 78d83de93e..bd06825b7f 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/LedgerTransportSwitch.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Alert, ScrollView, StyleSheet, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {Spacer} from '../../../../components/Spacer/Spacer'
 import {Text} from '../../../../components/Text'
 import {useIsUsbSupported} from '../../../../legacy/HW'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
index e66f7ddb85..c4503a6a43 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowFailedTxScreen/ShowFailedTxScreen.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, View} from 'react-native'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useBlockGoBack} from '../../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
index e57fa04e49..6fb9a94b7b 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/ConfirmTxScreen/ShowSubmittedTxScreen/ShowSubmittedTxScreen.tsx
@@ -5,7 +5,7 @@ import {Linking, StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {z} from 'zod'
 
-import {Button, ButtonType} from '../../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../../components/Button/Button'
 import {Spacer} from '../../../../../components/Spacer/Spacer'
 import {Text} from '../../../../../components/Text'
 import {useBlockGoBack, useUnsafeParams, useWalletNavigation} from '../../../../../kernel/navigation'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
index 15e9e4d7d0..edae486009 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/EditSlippage/EditSlippageScreen/EditSlippageScreen.tsx
@@ -5,7 +5,7 @@ import * as React from 'react'
 import {ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../../../../components/Button/NewButton'
+import {Button} from '../../../../../../../components/Button/Button'
 import {KeyboardAvoidingView} from '../../../../../../../components/KeyboardAvoidingView/KeyboardAvoidingView'
 import {TextInput} from '../../../../../../../components/TextInput/TextInput'
 import {useLanguage} from '../../../../../../../kernel/i18n'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
index a7757fe61d..83748dad30 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/StartSwapOrderScreen.tsx
@@ -8,7 +8,7 @@ import * as React from 'react'
 import {Alert, StyleSheet, useWindowDimensions, View, ViewProps} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button} from '../../../../../components/Button/NewButton'
+import {Button} from '../../../../../components/Button/Button'
 import {useModal} from '../../../../../components/Modal/ModalContext'
 import {Space} from '../../../../../components/Space/Space'
 import {frontendFeeAddressMainnet, frontendFeeAddressPreprod} from '../../../../../kernel/env'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
index 6e218f4ba8..1fb6b1a47c 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnLimitPrice/WarnLimitPrice.tsx
@@ -4,7 +4,7 @@ import {BigNumber} from 'bignumber.js'
 import * as React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../../../components/Button/Button'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useLanguage} from '../../../../../../kernel/i18n'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
index 4fe3d5fa46..91625b45fe 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnPriceImpact/WarnPriceImpact.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../../../components/Button/Button'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {PRICE_IMPACT_HIGH_RISK, PRICE_IMPACT_MODERATE_RISK} from '../../../../common/constants'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
index d65d0d87f5..e144f0c3ef 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/CreateOrder/WarnSlippage/WarnSlippage.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {StyleSheet, Text, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../../../components/Button/Button'
 import {useModal} from '../../../../../../components/Modal/ModalContext'
 import {Spacer} from '../../../../../../components/Spacer/Spacer'
 import {useStrings} from '../../../../common/strings'
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
index efd89f267c..ead8c75e44 100644
--- a/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
+++ b/apps/wallet-mobile/src/features/Swap/useCases/StartOrderSwapScreen/ListOrders/OpenOrders.tsx
@@ -10,7 +10,7 @@ import React, {useRef} from 'react'
 import {useIntl} from 'react-intl'
 import {ActivityIndicator, Alert, Linking, StyleSheet, TouchableOpacity, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../../components/Button/Button'
 import {
   ExpandableInfoCard,
   ExpandableInfoCardSkeleton,
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
index 8e6ddcd7e7..b0f9dcc120 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxDetails/TxDetails.tsx
@@ -22,7 +22,7 @@ import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Banner} from '../../../../components/Banner/Banner'
 import {Boundary} from '../../../../components/Boundary/Boundary'
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {CopyButton} from '../../../../components/CopyButton'
 import {FadeIn} from '../../../../components/FadeIn'
 import {Icon} from '../../../../components/Icon'
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
index b78b9a434e..b4cbd5ea08 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/ActionsBanner.tsx
@@ -6,7 +6,7 @@ import {Chain} from '@yoroi/types'
 import React from 'react'
 import {GestureResponderEvent, StyleSheet, View} from 'react-native'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {useCopy} from '../../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../../components/Icon'
 import {Text} from '../../../../components/Text'
diff --git a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
index b3ce98bf28..682d031963 100644
--- a/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
+++ b/apps/wallet-mobile/src/features/Transactions/useCases/TxHistory/WarningBanner.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {Image, ImageSourcePropType, StyleSheet, TouchableOpacity, View, ViewStyle} from 'react-native'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {Icon} from '../../../../components/Icon'
 import {Text} from '../../../../components/Text'
 
diff --git a/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx b/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
index 88b2c43e98..2e2caa7748 100644
--- a/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
+++ b/apps/wallet-mobile/src/features/WalletManager/useCases/SelectWalletFromListScreen/SelectWalletFromListScreen.tsx
@@ -6,7 +6,7 @@ import * as React from 'react'
 import {Linking, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 
-import {Button} from '../../../../components/Button/NewButton'
+import {Button} from '../../../../components/Button/Button'
 import {ScrollView, useScrollView} from '../../../../components/ScrollView/ScrollView'
 import {Space} from '../../../../components/Space/Space'
 import {isDev} from '../../../../kernel/env'
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx b/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
index 4dc35344fd..00875483f8 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/Dashboard.tsx
@@ -17,7 +17,7 @@ import {
 import {SafeAreaView} from 'react-native-safe-area-context'
 
 import {Banner} from '../../components/Banner/Banner'
-import {Button} from '../../components/Button/NewButton'
+import {Button} from '../../components/Button/Button'
 import {useModal} from '../../components/Modal/ModalContext'
 import {Space} from '../../components/Space/Space'
 import {
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx b/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
index ff2604a2f5..5c7a7424e7 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/StakePoolInfo.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {ActivityIndicator, Linking, StyleSheet, View} from 'react-native'
 import {useQuery, UseQueryOptions} from 'react-query'
 
-import {Button, ButtonType} from '../../components/Button/NewButton'
+import {Button, ButtonType} from '../../components/Button/Button'
 import {CopyButton} from '../../components/CopyButton'
 import {Text} from '../../components/Text'
 import {TitledCard} from '../../components/TitledCard'
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
index 7abf4f4687..ae70f82734 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/UserSummary.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 
-import {Button, ButtonType} from '../../components/Button/NewButton'
+import {Button, ButtonType} from '../../components/Button/Button'
 import {Icon} from '../../components/Icon'
 import {Space} from '../../components/Space/Space'
 import {Text} from '../../components/Text'
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
index e9db7f3d49..df67ab0bc0 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/ConfirmTx/ConfirmTxWithPassword.tsx
@@ -4,7 +4,7 @@ import {useIntl} from 'react-intl'
 import {ActivityIndicator, StyleSheet, View} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button, ButtonType} from '../../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../../components/Button/Button'
 import {TextInput} from '../../../../components/TextInput/TextInput'
 import {debugWalletInfo, features} from '../../../../kernel/features'
 import {confirmationMessages, txLabels} from '../../../../kernel/i18n/global-messages'
diff --git a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
index e1758d61af..c85860ddd7 100644
--- a/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
+++ b/apps/wallet-mobile/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, Text, View} from 'react-native'
 
 import {Boundary} from '../../../components/Boundary/Boundary'
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Checkbox} from '../../../components/Checkbox/Checkbox'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {PleaseWaitView} from '../../../components/PleaseWaitModal'
diff --git a/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx b/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
index c6fc87218a..b33fb40ecb 100644
--- a/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
+++ b/apps/wallet-mobile/src/legacy/HW/LedgerConnect/LedgerConnect.tsx
@@ -14,7 +14,7 @@ import {Observer} from 'rxjs'
 import bleImage from '../../../assets/img/bluetooth.png'
 import usbImage from '../../../assets/img/ledger-nano-usb.png'
 import {BulletPointItem} from '../../../components/BulletPointItem'
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Loading} from '../../../components/Loading/Loading'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx b/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
index 02ac0f633a..46f9943d41 100644
--- a/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
+++ b/apps/wallet-mobile/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {Alert, Platform, ScrollView, StyleSheet} from 'react-native'
 import DeviceInfo from 'react-native-device-info'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Space} from '../../../components/Space/Space'
 import {Text} from '../../../components/Text'
 import globalMessages from '../../../kernel/i18n/global-messages'
diff --git a/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx b/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
index a695862341..fdf8dcaa73 100644
--- a/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/FailedTx/FailedTxScreen.tsx
@@ -4,7 +4,7 @@ import React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet} from 'react-native'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {SafeArea} from '../../../components/SafeArea'
 import {Space} from '../../../components/Space/Space'
 import {Spacer} from '../../../components/Spacer/Spacer'
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
index 74b420c750..c00fed1f1a 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolDetails/PoolDetailScreen.tsx
@@ -4,7 +4,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet} from 'react-native'
 import {useQuery} from 'react-query'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {GradientWarning} from '../../../components/ChainWarning/GradientWarning'
 import {Spacer} from '../../../components/Spacer/Spacer'
 import {TextInput} from '../../../components/TextInput/TextInput'
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
index a3acf6e589..0fe14733aa 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionModal.tsx
@@ -4,7 +4,7 @@ import * as React from 'react'
 import {Image, StyleSheet, Text, View, ViewProps} from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 
-import {Button, ButtonType} from '../../../components/Button/NewButton'
+import {Button, ButtonType} from '../../../components/Button/Button'
 import {Icon} from '../../../components/Icon'
 import {useModal} from '../../../components/Modal/ModalContext'
 import {ScrollView, useScrollView} from '../../../components/ScrollView/ScrollView'
diff --git a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
index cc708c45e7..fde7c4b413 100644
--- a/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
+++ b/apps/wallet-mobile/src/legacy/Staking/PoolTransition/PoolTransitionNotice.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, Text, View, ViewProps} from 'react-native'
 
-import {Button} from '../../../components/Button/NewButton'
+import {Button} from '../../../components/Button/Button'
 import {Icon} from '../../../components/Icon'
 import {Space} from '../../../components/Space/Space'
 import {formatTimeSpan} from '../../../yoroi-wallets/utils/timeUtils'
diff --git a/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json b/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
index f31e19998d..97f217db65 100644
--- a/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
+++ b/apps/wallet-mobile/translations/messages/src/components/Analytics/Analytics.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 290,
       "column": 10,
-      "index": 7442
+      "index": 7425
     },
     "end": {
       "line": 293,
       "column": 3,
-      "index": 7535
+      "index": 7518
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 294,
       "column": 15,
-      "index": 7552
+      "index": 7535
     },
     "end": {
       "line": 297,
       "column": 3,
-      "index": 7691
+      "index": 7674
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 298,
       "column": 13,
-      "index": 7706
+      "index": 7689
     },
     "end": {
       "line": 301,
       "column": 3,
-      "index": 7793
+      "index": 7776
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 302,
       "column": 10,
-      "index": 7805
+      "index": 7788
     },
     "end": {
       "line": 305,
       "column": 3,
-      "index": 7900
+      "index": 7883
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 306,
       "column": 11,
-      "index": 7913
+      "index": 7896
     },
     "end": {
       "line": 309,
       "column": 3,
-      "index": 8010
+      "index": 7993
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 310,
       "column": 8,
-      "index": 8020
+      "index": 8003
     },
     "end": {
       "line": 313,
       "column": 3,
-      "index": 8118
+      "index": 8101
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 314,
       "column": 10,
-      "index": 8130
+      "index": 8113
     },
     "end": {
       "line": 317,
       "column": 3,
-      "index": 8216
+      "index": 8199
     }
   },
   {
@@ -111,12 +111,12 @@
     "start": {
       "line": 318,
       "column": 8,
-      "index": 8226
+      "index": 8209
     },
     "end": {
       "line": 321,
       "column": 3,
-      "index": 8314
+      "index": 8297
     }
   },
   {
@@ -126,12 +126,12 @@
     "start": {
       "line": 322,
       "column": 8,
-      "index": 8324
+      "index": 8307
     },
     "end": {
       "line": 325,
       "column": 3,
-      "index": 8386
+      "index": 8369
     }
   },
   {
@@ -141,12 +141,12 @@
     "start": {
       "line": 326,
       "column": 10,
-      "index": 8398
+      "index": 8381
     },
     "end": {
       "line": 329,
       "column": 3,
-      "index": 8464
+      "index": 8447
     }
   },
   {
@@ -156,12 +156,12 @@
     "start": {
       "line": 330,
       "column": 10,
-      "index": 8476
+      "index": 8459
     },
     "end": {
       "line": 333,
       "column": 3,
-      "index": 8557
+      "index": 8540
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json b/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
index 6c2ac7399f..5b441cf9b4 100644
--- a/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
+++ b/apps/wallet-mobile/translations/messages/src/components/ErrorModal/ErrorModal.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 146,
       "column": 13,
-      "index": 4163
+      "index": 4160
     },
     "end": {
       "line": 149,
       "column": 3,
-      "index": 4263
+      "index": 4260
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 150,
       "column": 13,
-      "index": 4278
+      "index": 4275
     },
     "end": {
       "line": 153,
       "column": 3,
-      "index": 4378
+      "index": 4375
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json b/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
index 0ea624a65f..2af1bea196 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Auth/OsLoginScreen/OsLoginScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 64,
       "column": 9,
-      "index": 1668
+      "index": 1665
     },
     "end": {
       "line": 67,
       "column": 3,
-      "index": 1761
+      "index": 1758
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json b/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
index fb51c03aa8..0a366af910 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Auth/PinInput/PinInput.stories.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 45,
       "column": 9,
-      "index": 1208
+      "index": 1205
     },
     "end": {
       "line": 48,
       "column": 3,
-      "index": 1298
+      "index": 1295
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json b/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
index 756ad6d3f2..31eede2914 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Initialization/DarkThemeAnnouncement/DarkThemeAnnouncement.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 182,
       "column": 10,
-      "index": 5243
+      "index": 5240
     },
     "end": {
       "line": 185,
       "column": 3,
-      "index": 5336
+      "index": 5333
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 186,
       "column": 15,
-      "index": 5353
+      "index": 5350
     },
     "end": {
       "line": 190,
       "column": 3,
-      "index": 5541
+      "index": 5538
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 191,
       "column": 15,
-      "index": 5558
+      "index": 5555
     },
     "end": {
       "line": 194,
       "column": 3,
-      "index": 5655
+      "index": 5652
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 195,
       "column": 12,
-      "index": 5669
+      "index": 5666
     },
     "end": {
       "line": 198,
       "column": 3,
-      "index": 5768
+      "index": 5765
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
index ef9a7e33f7..3692f0adfd 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 202,
       "column": 12,
-      "index": 6531
+      "index": 6528
     },
     "end": {
       "line": 205,
       "column": 3,
-      "index": 6608
+      "index": 6605
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
index 257ef11f52..4ba099abd1 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/ChangePassword/ChangePasswordScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 115,
       "column": 25,
-      "index": 4812
+      "index": 4809
     },
     "end": {
       "line": 118,
       "column": 3,
-      "index": 4934
+      "index": 4931
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 119,
       "column": 25,
-      "index": 4961
+      "index": 4958
     },
     "end": {
       "line": 122,
       "column": 3,
-      "index": 5079
+      "index": 5076
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 123,
       "column": 31,
-      "index": 5112
+      "index": 5109
     },
     "end": {
       "line": 126,
       "column": 3,
-      "index": 5277
+      "index": 5274
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 127,
       "column": 28,
-      "index": 5307
+      "index": 5304
     },
     "end": {
       "line": 130,
       "column": 3,
-      "index": 5435
+      "index": 5432
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 131,
       "column": 36,
-      "index": 5473
+      "index": 5470
     },
     "end": {
       "line": 134,
       "column": 3,
-      "index": 5612
+      "index": 5609
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 135,
       "column": 18,
-      "index": 5632
+      "index": 5629
     },
     "end": {
       "line": 138,
       "column": 3,
-      "index": 5746
+      "index": 5743
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
index 4e48f09071..0c56181dbe 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/DisableEasyConfirmationScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 48,
       "column": 18,
-      "index": 1533
+      "index": 1530
     },
     "end": {
       "line": 51,
       "column": 3,
-      "index": 1735
+      "index": 1732
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 52,
       "column": 17,
-      "index": 1754
+      "index": 1751
     },
     "end": {
       "line": 55,
       "column": 3,
-      "index": 1868
+      "index": 1865
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
index 5ac6d7f714..3c28242e4d 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EasyConfirmation/EnableEasyConfirmationScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 92,
       "column": 17,
-      "index": 3230
+      "index": 3227
     },
     "end": {
       "line": 100,
       "column": 3,
-      "index": 3626
+      "index": 3623
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 101,
       "column": 17,
-      "index": 3645
+      "index": 3642
     },
     "end": {
       "line": 106,
       "column": 3,
-      "index": 3882
+      "index": 3879
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 107,
       "column": 22,
-      "index": 3906
+      "index": 3903
     },
     "end": {
       "line": 110,
       "column": 3,
-      "index": 4034
+      "index": 4031
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 111,
       "column": 16,
-      "index": 4052
+      "index": 4049
     },
     "end": {
       "line": 114,
       "column": 3,
-      "index": 4163
+      "index": 4160
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
index 34f5a54bbb..c26e2b407c 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/RemoveWallet/RemoveWalletScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 109,
       "column": 25,
-      "index": 3921
+      "index": 3918
     },
     "end": {
       "line": 112,
       "column": 3,
-      "index": 4115
+      "index": 4112
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 113,
       "column": 25,
-      "index": 4142
+      "index": 4139
     },
     "end": {
       "line": 116,
       "column": 3,
-      "index": 4299
+      "index": 4296
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 117,
       "column": 14,
-      "index": 4315
+      "index": 4312
     },
     "end": {
       "line": 120,
       "column": 3,
-      "index": 4419
+      "index": 4416
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 121,
       "column": 19,
-      "index": 4440
+      "index": 4437
     },
     "end": {
       "line": 124,
       "column": 3,
-      "index": 4549
+      "index": 4546
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 125,
       "column": 27,
-      "index": 4578
+      "index": 4575
     },
     "end": {
       "line": 128,
       "column": 3,
-      "index": 4710
+      "index": 4707
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 129,
       "column": 10,
-      "index": 4722
+      "index": 4719
     },
     "end": {
       "line": 132,
       "column": 3,
-      "index": 4824
+      "index": 4821
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 133,
       "column": 26,
-      "index": 4852
+      "index": 4849
     },
     "end": {
       "line": 137,
       "column": 3,
-      "index": 5066
+      "index": 5063
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
index 25a3a638fd..e036f8c279 100644
--- a/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
+++ b/apps/wallet-mobile/translations/messages/src/features/SetupWallet/legacy/WalletNameForm/WalletNameForm.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 133,
       "column": 24,
-      "index": 4122
+      "index": 4119
     },
     "end": {
       "line": 136,
       "column": 3,
-      "index": 4230
+      "index": 4227
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 137,
       "column": 8,
-      "index": 4240
+      "index": 4237
     },
     "end": {
       "line": 140,
       "column": 3,
-      "index": 4343
+      "index": 4340
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
index e05e5a95d2..f2d95db721 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/Dashboard.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 230,
       "column": 23,
-      "index": 7413
+      "index": 7410
     },
     "end": {
       "line": 233,
       "column": 3,
-      "index": 7546
+      "index": 7543
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
index 54f0b45bb6..f8e93184c7 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/StakePoolInfo.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 105,
       "column": 9,
-      "index": 3215
+      "index": 3212
     },
     "end": {
       "line": 108,
       "column": 3,
-      "index": 3336
+      "index": 3333
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 109,
       "column": 11,
-      "index": 3349
+      "index": 3346
     },
     "end": {
       "line": 114,
       "column": 3,
-      "index": 3584
+      "index": 3581
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 115,
       "column": 26,
-      "index": 3612
+      "index": 3609
     },
     "end": {
       "line": 118,
       "column": 3,
-      "index": 3747
+      "index": 3744
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 119,
       "column": 10,
-      "index": 3759
+      "index": 3756
     },
     "end": {
       "line": 122,
       "column": 3,
-      "index": 3868
+      "index": 3865
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 123,
       "column": 15,
-      "index": 3885
+      "index": 3882
     },
     "end": {
       "line": 126,
       "column": 3,
-      "index": 4004
+      "index": 4001
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
index af053c0bc0..6b61d4ec76 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerConnect/LedgerConnect.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 328,
       "column": 11,
-      "index": 10129
+      "index": 10126
     },
     "end": {
       "line": 331,
       "column": 3,
-      "index": 10263
+      "index": 10260
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 332,
       "column": 13,
-      "index": 10278
+      "index": 10275
     },
     "end": {
       "line": 335,
       "column": 3,
-      "index": 10400
+      "index": 10397
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 336,
       "column": 18,
-      "index": 10420
+      "index": 10417
     },
     "end": {
       "line": 339,
       "column": 3,
-      "index": 10565
+      "index": 10562
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 340,
       "column": 9,
-      "index": 10576
+      "index": 10573
     },
     "end": {
       "line": 343,
       "column": 3,
-      "index": 10747
+      "index": 10744
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
index 012ef49b3d..ce1bb3eeff 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/HW/LedgerTransportSwitchModal/LedgerTransportSwitchModal.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 80,
       "column": 9,
-      "index": 2404
+      "index": 2401
     },
     "end": {
       "line": 83,
       "column": 3,
-      "index": 2522
+      "index": 2519
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 84,
       "column": 18,
-      "index": 2542
+      "index": 2539
     },
     "end": {
       "line": 89,
       "column": 3,
-      "index": 2771
+      "index": 2768
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 90,
       "column": 13,
-      "index": 2786
+      "index": 2783
     },
     "end": {
       "line": 93,
       "column": 3,
-      "index": 2900
+      "index": 2897
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 94,
       "column": 25,
-      "index": 2927
+      "index": 2924
     },
     "end": {
       "line": 97,
       "column": 3,
-      "index": 3070
+      "index": 3067
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 98,
       "column": 21,
-      "index": 3093
+      "index": 3090
     },
     "end": {
       "line": 101,
       "column": 3,
-      "index": 3243
+      "index": 3240
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 102,
       "column": 24,
-      "index": 3269
+      "index": 3266
     },
     "end": {
       "line": 105,
       "column": 3,
-      "index": 3463
+      "index": 3460
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 106,
       "column": 19,
-      "index": 3484
+      "index": 3481
     },
     "end": {
       "line": 109,
       "column": 3,
-      "index": 3610
+      "index": 3607
     }
   },
   {
@@ -111,12 +111,12 @@
     "start": {
       "line": 110,
       "column": 18,
-      "index": 3630
+      "index": 3627
     },
     "end": {
       "line": 113,
       "column": 3,
-      "index": 3740
+      "index": 3737
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json b/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
index 15a640b6eb..cfe184a74b 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Staking/FailedTx/FailedTxScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 105,
       "column": 18,
-      "index": 2634
+      "index": 2631
     },
     "end": {
       "line": 108,
       "column": 3,
-      "index": 2750
+      "index": 2747
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 109,
       "column": 20,
-      "index": 2772
+      "index": 2769
     },
     "end": {
       "line": 112,
       "column": 3,
-      "index": 2954
+      "index": 2951
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 113,
       "column": 10,
-      "index": 2966
+      "index": 2963
     },
     "end": {
       "line": 116,
       "column": 3,
-      "index": 3065
+      "index": 3062
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 117,
       "column": 12,
-      "index": 3079
+      "index": 3076
     },
     "end": {
       "line": 120,
       "column": 3,
-      "index": 3195
+      "index": 3192
     }
   }
 ]
\ No newline at end of file

From 52fc79cd6b8a0d7aa484bd161be3c5a7c3701f55 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 15:42:09 +0200
Subject: [PATCH 05/16] sort imports

---
 .../src/components/Analytics/Analytics.tsx    |  2 +-
 .../EnableLoginWithOsScreen.json              | 20 +++++------
 .../RenameWalletScreen.json                   |  8 ++---
 .../src/legacy/Dashboard/UserSummary.json     | 16 ++++-----
 .../WithdrawStakingRewards.json               | 36 +++++++++----------
 .../Staking/PoolDetails/PoolDetailScreen.json | 28 +++++++--------
 6 files changed, 55 insertions(+), 55 deletions(-)

diff --git a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
index b68a63c057..0e433a0a40 100644
--- a/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
+++ b/apps/wallet-mobile/src/components/Analytics/Analytics.tsx
@@ -4,12 +4,12 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, TextStyle, TouchableOpacity, useWindowDimensions, View} from 'react-native'
 import {ScrollView} from 'react-native-gesture-handler'
 
-import {Button, ButtonType} from '../Button/Button'
 import {Spacer} from '../../components/Spacer/Spacer'
 import {Text} from '../../components/Text'
 import {YoroiLogo} from '../../components/YoroiLogo/YoroiLogo'
 import {SettingsSwitch} from '../../features/Settings/common/SettingsSwitch'
 import {useMetrics} from '../../kernel/metrics/metricsManager'
+import {Button, ButtonType} from '../Button/Button'
 import {AnalyticsImage} from './AnalyticsImage'
 
 type Props = {
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
index 377715f37e..0b924e7ad0 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/EnableLoginWithOs/EnableLoginWithOsScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 55,
       "column": 16,
-      "index": 1648
+      "index": 1645
     },
     "end": {
       "line": 58,
       "column": 3,
-      "index": 1752
+      "index": 1749
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 59,
       "column": 14,
-      "index": 1768
+      "index": 1765
     },
     "end": {
       "line": 62,
       "column": 3,
-      "index": 1867
+      "index": 1864
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 63,
       "column": 11,
-      "index": 1880
+      "index": 1877
     },
     "end": {
       "line": 66,
       "column": 3,
-      "index": 1992
+      "index": 1989
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 67,
       "column": 15,
-      "index": 2009
+      "index": 2006
     },
     "end": {
       "line": 70,
       "column": 3,
-      "index": 2130
+      "index": 2127
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 71,
       "column": 15,
-      "index": 2147
+      "index": 2144
     },
     "end": {
       "line": 74,
       "column": 3,
-      "index": 2263
+      "index": 2260
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
index 00d321c66e..fed6a5cc0f 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/RenameWalletScreen/RenameWalletScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 103,
       "column": 16,
-      "index": 3299
+      "index": 3296
     },
     "end": {
       "line": 106,
       "column": 3,
-      "index": 3403
+      "index": 3400
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 107,
       "column": 24,
-      "index": 3429
+      "index": 3426
     },
     "end": {
       "line": 110,
       "column": 3,
-      "index": 3541
+      "index": 3538
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
index 744a52f9aa..a6b44578ee 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 163,
       "column": 9,
-      "index": 4889
+      "index": 4886
     },
     "end": {
       "line": 166,
       "column": 3,
-      "index": 4991
+      "index": 4988
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 167,
       "column": 16,
-      "index": 5009
+      "index": 5006
     },
     "end": {
       "line": 170,
       "column": 3,
-      "index": 5119
+      "index": 5116
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 171,
       "column": 18,
-      "index": 5139
+      "index": 5136
     },
     "end": {
       "line": 174,
       "column": 3,
-      "index": 5253
+      "index": 5250
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 175,
       "column": 23,
-      "index": 5278
+      "index": 5275
     },
     "end": {
       "line": 178,
       "column": 3,
-      "index": 5390
+      "index": 5387
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
index 27310ccb39..d0e1d39363 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/WithdrawStakingRewards/WithdrawStakingRewards.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 166,
       "column": 21,
-      "index": 6117
+      "index": 6114
     },
     "end": {
       "line": 169,
       "column": 3,
-      "index": 6245
+      "index": 6242
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 170,
       "column": 16,
-      "index": 6263
+      "index": 6260
     },
     "end": {
       "line": 173,
       "column": 3,
-      "index": 6446
+      "index": 6443
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 174,
       "column": 16,
-      "index": 6464
+      "index": 6461
     },
     "end": {
       "line": 179,
       "column": 3,
-      "index": 6688
+      "index": 6685
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 180,
       "column": 16,
-      "index": 6706
+      "index": 6703
     },
     "end": {
       "line": 184,
       "column": 3,
-      "index": 6913
+      "index": 6910
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 185,
       "column": 12,
-      "index": 6927
+      "index": 6924
     },
     "end": {
       "line": 190,
       "column": 3,
-      "index": 7158
+      "index": 7155
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 191,
       "column": 12,
-      "index": 7172
+      "index": 7169
     },
     "end": {
       "line": 197,
       "column": 3,
-      "index": 7455
+      "index": 7452
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 198,
       "column": 12,
-      "index": 7469
+      "index": 7466
     },
     "end": {
       "line": 203,
       "column": 3,
-      "index": 7714
+      "index": 7711
     }
   },
   {
@@ -111,12 +111,12 @@
     "start": {
       "line": 204,
       "column": 14,
-      "index": 7730
+      "index": 7727
     },
     "end": {
       "line": 207,
       "column": 3,
-      "index": 7838
+      "index": 7835
     }
   },
   {
@@ -126,12 +126,12 @@
     "start": {
       "line": 208,
       "column": 20,
-      "index": 7860
+      "index": 7857
     },
     "end": {
       "line": 211,
       "column": 3,
-      "index": 7969
+      "index": 7966
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json b/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
index f102e64743..c8afdea6c8 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Staking/PoolDetails/PoolDetailScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 91,
       "column": 12,
-      "index": 2678
+      "index": 2675
     },
     "end": {
       "line": 94,
       "column": 3,
-      "index": 2792
+      "index": 2789
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 95,
       "column": 8,
-      "index": 2802
+      "index": 2799
     },
     "end": {
       "line": 98,
       "column": 3,
-      "index": 2861
+      "index": 2858
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 99,
       "column": 12,
-      "index": 2875
+      "index": 2872
     },
     "end": {
       "line": 102,
       "column": 3,
-      "index": 2962
+      "index": 2959
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 103,
       "column": 10,
-      "index": 2974
+      "index": 2971
     },
     "end": {
       "line": 106,
       "column": 3,
-      "index": 3068
+      "index": 3065
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 107,
       "column": 17,
-      "index": 3087
+      "index": 3084
     },
     "end": {
       "line": 110,
       "column": 3,
-      "index": 3190
+      "index": 3187
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 111,
       "column": 19,
-      "index": 3211
+      "index": 3208
     },
     "end": {
       "line": 114,
       "column": 3,
-      "index": 3342
+      "index": 3339
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 115,
       "column": 18,
-      "index": 3362
+      "index": 3359
     },
     "end": {
       "line": 119,
       "column": 3,
-      "index": 3571
+      "index": 3568
     }
   }
 ]
\ No newline at end of file

From 7d432eb0258e99f0eb68077f434ca9913b66eef7 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 15:55:34 +0200
Subject: [PATCH 06/16] Fix funds modal

---
 .../RegisterCatalyst/common/InsufficientFundsModal.tsx         | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
index 8672b2c5d2..b690b351fa 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
@@ -62,7 +62,8 @@ const useStyles = () => {
   const styles = StyleSheet.create({
     container: {
       ...atoms.px_lg,
-      ...atoms.flex_1,
+      ...atoms.flex,
+      ...atoms.gap_lg,
       ...atoms.justify_between,
     },
     text: {

From 5303c35bd5bcbc6a9143226f7a5bb9fd0e21fc29 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 16:36:49 +0200
Subject: [PATCH 07/16] patch flex col containers stretching button height

---
 apps/wallet-mobile/src/components/Button/Button.stories.tsx | 6 ++++++
 apps/wallet-mobile/src/components/Button/Button.tsx         | 4 ++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/apps/wallet-mobile/src/components/Button/Button.stories.tsx b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
index a4ce4c09f5..e507a01d7f 100644
--- a/apps/wallet-mobile/src/components/Button/Button.stories.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.stories.tsx
@@ -26,6 +26,12 @@ storiesOf('Button', module).add('default', () => {
 
           <Button title="Continue" icon={Icon.Bluetooth} />
         </View>
+
+        <View style={{flexDirection: 'column', gap: 16, paddingVertical: 16}}>
+          <Button type={ButtonType.Secondary} title="Cancel" />
+
+          <Button title="Continue" icon={Icon.Bluetooth} />
+        </View>
       </Grid>
 
       <Accordion
diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
index 18437ab5a6..5c896ff06d 100644
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.tsx
@@ -125,8 +125,8 @@ const useStyles = ({
     case ButtonType.Critical:
       shape =
         size === 'M'
-          ? {...atoms.py_lg, ...atoms.px_xl, ...atoms.gap_sm, ...atoms.rounded_sm}
-          : {...atoms.py_md, ...atoms.px_lg, ...atoms.gap_xs, ...atoms.rounded_sm}
+          ? {maxHeight: 56, ...atoms.py_lg, ...atoms.px_xl, ...atoms.gap_sm, ...atoms.rounded_sm}
+          : {maxHeight: 40, ...atoms.py_md, ...atoms.px_lg, ...atoms.gap_xs, ...atoms.rounded_sm}
       break
     case ButtonType.Text:
     case ButtonType.SecondaryText:

From b3fba0ef71a5f5cf7bc8ed29d201b40eadd34c8a Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 16:42:02 +0200
Subject: [PATCH 08/16] adjust height

---
 apps/wallet-mobile/src/components/Button/Button.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
index 5c896ff06d..25c9bea6d7 100644
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.tsx
@@ -126,7 +126,7 @@ const useStyles = ({
       shape =
         size === 'M'
           ? {maxHeight: 56, ...atoms.py_lg, ...atoms.px_xl, ...atoms.gap_sm, ...atoms.rounded_sm}
-          : {maxHeight: 40, ...atoms.py_md, ...atoms.px_lg, ...atoms.gap_xs, ...atoms.rounded_sm}
+          : {maxHeight: 44, ...atoms.py_md, ...atoms.px_lg, ...atoms.gap_xs, ...atoms.rounded_sm}
       break
     case ButtonType.Text:
     case ButtonType.SecondaryText:

From 6c993da33db769f0448bff37f11262e505f5599e Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 16:59:54 +0200
Subject: [PATCH 09/16] restore

---
 .../features/RegisterCatalyst/common/InsufficientFundsModal.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
index b690b351fa..7f3735607a 100644
--- a/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
+++ b/apps/wallet-mobile/src/features/RegisterCatalyst/common/InsufficientFundsModal.tsx
@@ -62,7 +62,7 @@ const useStyles = () => {
   const styles = StyleSheet.create({
     container: {
       ...atoms.px_lg,
-      ...atoms.flex,
+      ...atoms.flex_1,
       ...atoms.gap_lg,
       ...atoms.justify_between,
     },

From 13a897187d029808d8db308e9caf9e1e9053551a Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 17:04:01 +0200
Subject: [PATCH 10/16] remove circular dependency

---
 apps/wallet-mobile/src/components/Icon/Ada.tsx               | 2 +-
 apps/wallet-mobile/src/components/Icon/Analytics.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/AngleDown.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/AngleUp.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/ArrowDown.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/ArrowRight.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Assets.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Backspace.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Backward.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Bio.tsx               | 2 +-
 apps/wallet-mobile/src/components/Icon/Bluetooth.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Bug.tsx               | 2 +-
 apps/wallet-mobile/src/components/Icon/Burger.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Cardano.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Catalyst.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Categories.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Change.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Check.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/CheckFilled.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx     | 2 +-
 apps/wallet-mobile/src/components/Icon/Checkbox.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Chevron.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Clock.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Close.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Coins.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Coins2.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Collateral.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Connection.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Copy.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/CopySuccess.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/Cross.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/CrossCircle.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/DApp.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Danger.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/DappConnector.tsx     | 2 +-
 apps/wallet-mobile/src/components/Icon/Delete.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Device.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/Direction.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Disconnect.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Document.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Drag.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Edit.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx     | 2 +-
 apps/wallet-mobile/src/components/Icon/Emurgo.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Exchange.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Export.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/ExternalLink.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/EyeOff.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/EyeOn.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Facebook.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Forward.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Gear.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Github.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Globe.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Google.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Governance.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx    | 2 +-
 apps/wallet-mobile/src/components/Icon/Image.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Info.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/InfoCircle.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Language.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Launchpad.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Ledger.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Lightning.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Link.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Lock.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/LockFilled.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Logout.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Magnify.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Megaphone.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Message.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/MinSwap.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/MultiParty.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx   | 2 +-
 apps/wallet-mobile/src/components/Icon/NftAsset.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/NoNfts.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Pin.tsx               | 2 +-
 apps/wallet-mobile/src/components/Icon/Placeholder.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/PlateNumber.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/Plus.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/PlusCircle.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Portfolio.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/Qr.tsx                | 2 +-
 apps/wallet-mobile/src/components/Icon/QuestionMark.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/Received.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Refresh.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Reload.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Resync.tsx            | 2 +-
 .../src/components/Icon/RewardManuallyPayout.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx   | 2 +-
 apps/wallet-mobile/src/components/Icon/Sandbox.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Send.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Settings.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Share.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Share2.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/SliderSettings.tsx    | 2 +-
 apps/wallet-mobile/src/components/Icon/SortTable.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/Square.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/Staking.tsx           | 2 +-
 .../src/components/Icon/StakingKeyDeregistered.tsx           | 2 +-
 .../src/components/Icon/StakingKeyRegistered.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/StarFilled.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/StarOutlined.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Support.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Swap.tsx              | 2 +-
 apps/wallet-mobile/src/components/Icon/Switch.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/TabDiscover.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx | 2 +-
 apps/wallet-mobile/src/components/Icon/TabMenu.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx     | 2 +-
 apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx      | 2 +-
 .../wallet-mobile/src/components/Icon/TabPortfolioActive.tsx | 2 +-
 apps/wallet-mobile/src/components/Icon/TabStaking.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/TabWallet.tsx         | 2 +-
 apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx   | 2 +-
 apps/wallet-mobile/src/components/Icon/Table.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/Telegram.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/Theme.tsx             | 2 +-
 apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Tokens.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/TotalAda.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx    | 2 +-
 apps/wallet-mobile/src/components/Icon/TotalReward.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/Transaction.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/Twitter.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Usb.tsx               | 2 +-
 apps/wallet-mobile/src/components/Icon/Verify.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/Wallet.tsx            | 2 +-
 apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/WalletStack.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/Wallets.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/Warning.tsx           | 2 +-
 apps/wallet-mobile/src/components/Icon/WingRiders.tsx        | 2 +-
 apps/wallet-mobile/src/components/Icon/YoroiApp.tsx          | 2 +-
 apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx      | 2 +-
 apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx       | 2 +-
 apps/wallet-mobile/src/components/Icon/index.ts              | 5 -----
 apps/wallet-mobile/src/components/Icon/type.ts               | 4 ++++
 145 files changed, 147 insertions(+), 148 deletions(-)
 create mode 100644 apps/wallet-mobile/src/components/Icon/type.ts

diff --git a/apps/wallet-mobile/src/components/Icon/Ada.tsx b/apps/wallet-mobile/src/components/Icon/Ada.tsx
index e1ea54cf12..1d6b148e7b 100644
--- a/apps/wallet-mobile/src/components/Icon/Ada.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Ada.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Ada = ({size = 20, color = '#000000'}: IconProps) => (
   <Svg viewBox="0 0 36.993 44" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/Analytics.tsx b/apps/wallet-mobile/src/components/Icon/Analytics.tsx
index f0e36abb90..5e0a8c717a 100644
--- a/apps/wallet-mobile/src/components/Icon/Analytics.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Analytics.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Analytics = ({size = 24, color = '#000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/AngleDown.tsx b/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
index cfc5d7b4fc..03b1821548 100644
--- a/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
+++ b/apps/wallet-mobile/src/components/Icon/AngleDown.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const AngleDown = ({size = 16, color = '#CF053A'}: IconProps) => (
   <Svg viewBox="0 0 16 16" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/AngleUp.tsx b/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
index dd281bd8a7..6bf0b3c4ae 100644
--- a/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/AngleUp.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const AngleUp = ({size = 16, color = '#12705D'}: IconProps) => (
   <Svg viewBox="0 0 16 16" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx b/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
index 3dcefe576c..d582f8c94c 100644
--- a/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ArrowDown.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const ArrowDown = ({size = 17, color = '#000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx b/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
index dd305a717d..080d7b100a 100644
--- a/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ArrowRight.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const ArrowRight = ({size = 24, color = '#000000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Assets.tsx b/apps/wallet-mobile/src/components/Icon/Assets.tsx
index 63cbc9774e..e74a19f43f 100644
--- a/apps/wallet-mobile/src/components/Icon/Assets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Assets.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Assets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Backspace.tsx b/apps/wallet-mobile/src/components/Icon/Backspace.tsx
index b2641ca4df..55aa026327 100644
--- a/apps/wallet-mobile/src/components/Icon/Backspace.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Backspace.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Backspace = ({color = 'black', size = 24}: IconProps) => (
   <Svg width={size ?? 24} height={size ?? 17} viewBox="0 0 24 17" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Backward.tsx b/apps/wallet-mobile/src/components/Icon/Backward.tsx
index f2107cd486..128d84628a 100644
--- a/apps/wallet-mobile/src/components/Icon/Backward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Backward.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Backward = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Bio.tsx b/apps/wallet-mobile/src/components/Icon/Bio.tsx
index 12c0985ce4..0819218b49 100644
--- a/apps/wallet-mobile/src/components/Icon/Bio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bio.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Bio = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx b/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
index e40c4c2584..0f0b1ccbb5 100644
--- a/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bluetooth.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Bluetooth = ({color = '#4B6DDE', size = 25}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Bug.tsx b/apps/wallet-mobile/src/components/Icon/Bug.tsx
index 0ca98be349..6bf5afc156 100644
--- a/apps/wallet-mobile/src/components/Icon/Bug.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Bug.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Bug = ({size = 40, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Burger.tsx b/apps/wallet-mobile/src/components/Icon/Burger.tsx
index 8ede4e753a..bdbe1eace4 100644
--- a/apps/wallet-mobile/src/components/Icon/Burger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Burger.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Burger = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Cardano.tsx b/apps/wallet-mobile/src/components/Icon/Cardano.tsx
index 8d0c54eb92..0d071ad984 100644
--- a/apps/wallet-mobile/src/components/Icon/Cardano.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Cardano.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Cardano = ({size = 20, color = '#000000'}: IconProps) => (
   <Svg viewBox="0 0 2000 1848" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/Catalyst.tsx b/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
index 133b679f8b..b668d1d34f 100644
--- a/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Catalyst.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Catalyst = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-1 -1 27 27">
diff --git a/apps/wallet-mobile/src/components/Icon/Categories.tsx b/apps/wallet-mobile/src/components/Icon/Categories.tsx
index 2f3ebde769..d22744135b 100644
--- a/apps/wallet-mobile/src/components/Icon/Categories.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Categories.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Categories = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Change.tsx b/apps/wallet-mobile/src/components/Icon/Change.tsx
index bad888b5a8..427a3b8c4d 100644
--- a/apps/wallet-mobile/src/components/Icon/Change.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Change.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Change = ({size = 20, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Check.tsx b/apps/wallet-mobile/src/components/Icon/Check.tsx
index 783d42e7e4..6e58e172a9 100644
--- a/apps/wallet-mobile/src/components/Icon/Check.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Check.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Check = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx b/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
index fa39774739..b81cc264c8 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckFilled.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const CheckFilled = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx b/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
index 10fce66849..1fd87f624e 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckFilled2.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const CheckFilled2 = ({size = 20, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20">
diff --git a/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx b/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
index 5e34a2c30f..8aca471572 100644
--- a/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CheckOutlined.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const CheckOutlined = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Checkbox.tsx b/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
index 19d9c1bb2b..ccded103fa 100644
--- a/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Checkbox.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Checkbox = ({size = 16, color = '#4B6DDE'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Chevron.tsx b/apps/wallet-mobile/src/components/Icon/Chevron.tsx
index 2063b38833..ace4baa9c7 100644
--- a/apps/wallet-mobile/src/components/Icon/Chevron.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Chevron.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Chevron = ({
   direction,
diff --git a/apps/wallet-mobile/src/components/Icon/Clock.tsx b/apps/wallet-mobile/src/components/Icon/Clock.tsx
index 4584ef73ab..ad776a72d5 100644
--- a/apps/wallet-mobile/src/components/Icon/Clock.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Clock.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Clock = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Close.tsx b/apps/wallet-mobile/src/components/Icon/Close.tsx
index bbdf3b57d0..a3ec08d4cd 100644
--- a/apps/wallet-mobile/src/components/Icon/Close.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Close.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Close = ({size = 40, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20">
diff --git a/apps/wallet-mobile/src/components/Icon/Coins.tsx b/apps/wallet-mobile/src/components/Icon/Coins.tsx
index 8e58bbc972..7fbfec7894 100644
--- a/apps/wallet-mobile/src/components/Icon/Coins.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Coins.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Coins = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Coins2.tsx b/apps/wallet-mobile/src/components/Icon/Coins2.tsx
index ce46bff19c..6a9a116de4 100644
--- a/apps/wallet-mobile/src/components/Icon/Coins2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Coins2.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Coins2 = ({size = 24, color = '#7C85A3'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Collateral.tsx b/apps/wallet-mobile/src/components/Icon/Collateral.tsx
index 7b3bc9d94d..ea0a866716 100644
--- a/apps/wallet-mobile/src/components/Icon/Collateral.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Collateral.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Collateral = ({size = 36, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Connection.tsx b/apps/wallet-mobile/src/components/Icon/Connection.tsx
index d63c43dd51..0bf970c592 100644
--- a/apps/wallet-mobile/src/components/Icon/Connection.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Connection.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Connection = ({size = 36, color = '#000000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Copy.tsx b/apps/wallet-mobile/src/components/Icon/Copy.tsx
index 849e53200e..c464d38b00 100644
--- a/apps/wallet-mobile/src/components/Icon/Copy.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Copy.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Copy = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx b/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
index 18ed764510..6587c75c25 100644
--- a/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CopySuccess.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const CopySuccess = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Cross.tsx b/apps/wallet-mobile/src/components/Icon/Cross.tsx
index 55aa37f636..246a50fd41 100644
--- a/apps/wallet-mobile/src/components/Icon/Cross.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Cross.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Cross = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx b/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
index 97fd95bbdd..e49dc94ead 100644
--- a/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/CrossCircle.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const CrossCircle = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/DApp.tsx b/apps/wallet-mobile/src/components/Icon/DApp.tsx
index 2ca5c04768..bbcbbbe98e 100644
--- a/apps/wallet-mobile/src/components/Icon/DApp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DApp.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const DApp = ({size = 24, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Danger.tsx b/apps/wallet-mobile/src/components/Icon/Danger.tsx
index d820cfd7bb..16fae50d46 100644
--- a/apps/wallet-mobile/src/components/Icon/Danger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Danger.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Danger = ({size = 36, color = '#000000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/DappConnector.tsx b/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
index d727f856c9..b1d8913abb 100644
--- a/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DappConnector.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const DappConnector = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Delete.tsx b/apps/wallet-mobile/src/components/Icon/Delete.tsx
index c592e012ac..b8047dedfd 100644
--- a/apps/wallet-mobile/src/components/Icon/Delete.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Delete.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Delete = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Device.tsx b/apps/wallet-mobile/src/components/Icon/Device.tsx
index d83c3a85a6..81b1bc26ad 100644
--- a/apps/wallet-mobile/src/components/Icon/Device.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Device.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Device = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx b/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
index 5aa6b51ee0..c89ca9c764 100644
--- a/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
+++ b/apps/wallet-mobile/src/components/Icon/DigitalAsset.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const DigitalAsset = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Direction.tsx b/apps/wallet-mobile/src/components/Icon/Direction.tsx
index ddb10e57a8..cccb61e57e 100644
--- a/apps/wallet-mobile/src/components/Icon/Direction.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Direction.tsx
@@ -6,7 +6,7 @@ import {TransactionDirection, TransactionInfo} from '../../yoroi-wallets/types/o
 import {Received} from '../Icon/Received'
 import {Send} from '../Icon/Send'
 import {Transaction} from '../Icon/Transaction'
-import {IconProps} from '.'
+import {IconProps} from './type'
 import {MultiParty} from './MultiParty'
 
 export const Direction = ({transaction, size = defaultSize}: IconProps & {transaction: TransactionInfo}) => {
diff --git a/apps/wallet-mobile/src/components/Icon/Disconnect.tsx b/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
index 73171bf254..15d43d38e8 100644
--- a/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Disconnect.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Disconnect = ({size = 24, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Document.tsx b/apps/wallet-mobile/src/components/Icon/Document.tsx
index 2693792768..07198d82be 100644
--- a/apps/wallet-mobile/src/components/Icon/Document.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Document.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Line, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Document = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Drag.tsx b/apps/wallet-mobile/src/components/Icon/Drag.tsx
index 4b053fc977..965a128d75 100644
--- a/apps/wallet-mobile/src/components/Icon/Drag.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Drag.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Drag = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Edit.tsx b/apps/wallet-mobile/src/components/Icon/Edit.tsx
index 7d7838b8da..d8b5d9ca08 100644
--- a/apps/wallet-mobile/src/components/Icon/Edit.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Edit.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Edit = ({size = 40, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx b/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
index 50a2c91ff7..6adda3509b 100644
--- a/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EmptyCheckbox.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const EmptyCheckbox = ({size = 16, color: defaultColor}: IconProps) => {
   const {color} = useTheme()
diff --git a/apps/wallet-mobile/src/components/Icon/Emurgo.tsx b/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
index d08b9a7896..1137b8f820 100644
--- a/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Emurgo.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Emurgo = ({size = 36, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Exchange.tsx b/apps/wallet-mobile/src/components/Icon/Exchange.tsx
index 4d4d99c8ac..998db77f17 100644
--- a/apps/wallet-mobile/src/components/Icon/Exchange.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Exchange.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Exchange = ({size = 36, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Export.tsx b/apps/wallet-mobile/src/components/Icon/Export.tsx
index b427c6e0f4..479a26cafe 100644
--- a/apps/wallet-mobile/src/components/Icon/Export.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Export.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Export = ({size = 40, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx b/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
index 2720c4be94..bb0c7f9384 100644
--- a/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ExternalLink.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const ExternalLink = ({size = 36, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/EyeOff.tsx b/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
index 4a14b7b581..b8e6991674 100644
--- a/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EyeOff.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const EyeOff = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/EyeOn.tsx b/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
index 72feb77290..ce1bbb92f5 100644
--- a/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
+++ b/apps/wallet-mobile/src/components/Icon/EyeOn.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const EyeOn = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Facebook.tsx b/apps/wallet-mobile/src/components/Icon/Facebook.tsx
index 3bf7510e98..0d3659a651 100644
--- a/apps/wallet-mobile/src/components/Icon/Facebook.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Facebook.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Facebook = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Forward.tsx b/apps/wallet-mobile/src/components/Icon/Forward.tsx
index ee7e985d94..108a8d6ffa 100644
--- a/apps/wallet-mobile/src/components/Icon/Forward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Forward.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Forward = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Gear.tsx b/apps/wallet-mobile/src/components/Icon/Gear.tsx
index 65f83f3791..fbea2fdeaa 100644
--- a/apps/wallet-mobile/src/components/Icon/Gear.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Gear.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Gear = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-3 -3 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Github.tsx b/apps/wallet-mobile/src/components/Icon/Github.tsx
index bb3ea20dc8..8ee843eba6 100644
--- a/apps/wallet-mobile/src/components/Icon/Github.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Github.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Github = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Globe.tsx b/apps/wallet-mobile/src/components/Icon/Globe.tsx
index de58e3da73..4181392985 100644
--- a/apps/wallet-mobile/src/components/Icon/Globe.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Globe.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Globe = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Google.tsx b/apps/wallet-mobile/src/components/Icon/Google.tsx
index 251e6b3e2b..6389b02b63 100644
--- a/apps/wallet-mobile/src/components/Icon/Google.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Google.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Defs, Image, Pattern, Rect, Use} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Google = ({size = 40}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 40 40" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Governance.tsx b/apps/wallet-mobile/src/components/Icon/Governance.tsx
index 6927c604e9..766a9fdfd1 100644
--- a/apps/wallet-mobile/src/components/Icon/Governance.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Governance.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Governance = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx b/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
index 474f0c2cd8..a7efafe265 100644
--- a/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/HardwareWallet.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const HardwareWallet = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Image.tsx b/apps/wallet-mobile/src/components/Icon/Image.tsx
index 6cc13f1b1b..123229df54 100644
--- a/apps/wallet-mobile/src/components/Icon/Image.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Image.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Image = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Info.tsx b/apps/wallet-mobile/src/components/Icon/Info.tsx
index af68451ea8..fe3b54fb05 100644
--- a/apps/wallet-mobile/src/components/Icon/Info.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Info.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Info = ({size = 40, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx b/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
index 82ca9cb4fd..9250af7b3c 100644
--- a/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/InfoCircle.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const InfoCircle = ({size = 16, color = '#4B6DDE'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 16 16">
diff --git a/apps/wallet-mobile/src/components/Icon/Language.tsx b/apps/wallet-mobile/src/components/Icon/Language.tsx
index 941f141694..a87619f057 100644
--- a/apps/wallet-mobile/src/components/Icon/Language.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Language.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Language = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Launchpad.tsx b/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
index 119014c99f..9b86fb48bf 100644
--- a/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Launchpad.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Launchpad = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Ledger.tsx b/apps/wallet-mobile/src/components/Icon/Ledger.tsx
index 8250a0f4d6..42562a5694 100644
--- a/apps/wallet-mobile/src/components/Icon/Ledger.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Ledger.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Ledger = ({size = 24, color = '#4B6DDE'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Lightning.tsx b/apps/wallet-mobile/src/components/Icon/Lightning.tsx
index d69410490e..9279cf31bc 100644
--- a/apps/wallet-mobile/src/components/Icon/Lightning.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Lightning.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Lightning = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Link.tsx b/apps/wallet-mobile/src/components/Icon/Link.tsx
index 50e5df231e..ab26e060f5 100644
--- a/apps/wallet-mobile/src/components/Icon/Link.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Link.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Link = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Lock.tsx b/apps/wallet-mobile/src/components/Icon/Lock.tsx
index be739debd1..28e496ae8a 100644
--- a/apps/wallet-mobile/src/components/Icon/Lock.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Lock.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Lock = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/LockFilled.tsx b/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
index 512efad0af..fe0a960c8f 100644
--- a/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/LockFilled.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const LockFilled = ({size = 16, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 16 16">
diff --git a/apps/wallet-mobile/src/components/Icon/Logout.tsx b/apps/wallet-mobile/src/components/Icon/Logout.tsx
index 681a661022..09b542f285 100644
--- a/apps/wallet-mobile/src/components/Icon/Logout.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Logout.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Logout = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Magnify.tsx b/apps/wallet-mobile/src/components/Icon/Magnify.tsx
index 510f5d07cd..1949316ef7 100644
--- a/apps/wallet-mobile/src/components/Icon/Magnify.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Magnify.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Magnify = ({size = 40, color = 'black'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Megaphone.tsx b/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
index 6c89d52d8a..ac0bbc9e7f 100644
--- a/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Megaphone.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Megaphone = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Message.tsx b/apps/wallet-mobile/src/components/Icon/Message.tsx
index 1a67483a98..0f7764f3de 100644
--- a/apps/wallet-mobile/src/components/Icon/Message.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Message.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Message = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/MinSwap.tsx b/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
index 9d3b9a32be..9ad2c5c668 100644
--- a/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MinSwap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const MinSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 164 164" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx b/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
index 6b32261e7d..f96a20e70e 100644
--- a/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MuesliSwap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const MuesliSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 36 36">
diff --git a/apps/wallet-mobile/src/components/Icon/MultiParty.tsx b/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
index 0be03b951e..5bc126b45b 100644
--- a/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MultiParty.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const MultiParty = ({size = 40, color = '#242838'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx b/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
index 7b24efc7b4..39bb8a4ae1 100644
--- a/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/MultipleWallets.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const MultipleWallets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/NftAsset.tsx b/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
index 42f09422bb..2d0e53b92d 100644
--- a/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
+++ b/apps/wallet-mobile/src/components/Icon/NftAsset.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const NftAsset = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/NoNfts.tsx b/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
index 239b09acc6..7e0779776d 100644
--- a/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
+++ b/apps/wallet-mobile/src/components/Icon/NoNfts.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Defs, G, LinearGradient, Path, Stop} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const NoNfts = ({size = 36}: IconProps) => (
   <Svg width={size} height={(size / 143) * 101} viewBox="0 0 143 101">
diff --git a/apps/wallet-mobile/src/components/Icon/Pin.tsx b/apps/wallet-mobile/src/components/Icon/Pin.tsx
index 17bf6846c8..bba9f619f1 100644
--- a/apps/wallet-mobile/src/components/Icon/Pin.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Pin.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Pin = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Placeholder.tsx b/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
index 13941cf887..902f1ec373 100644
--- a/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Placeholder.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Placeholder = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx b/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
index e211738c07..040095bd4f 100644
--- a/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
+++ b/apps/wallet-mobile/src/components/Icon/PlateNumber.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const PlateNumber = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Plus.tsx b/apps/wallet-mobile/src/components/Icon/Plus.tsx
index 6112ed75f5..ccab0c58b2 100644
--- a/apps/wallet-mobile/src/components/Icon/Plus.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Plus.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Plus = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx b/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
index 52999aff48..bd20b195f5 100644
--- a/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
+++ b/apps/wallet-mobile/src/components/Icon/PlusCircle.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const PlusCircle = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Portfolio.tsx b/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
index e0f2435323..341c7e3751 100644
--- a/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Portfolio.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Portfolio = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 18" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Qr.tsx b/apps/wallet-mobile/src/components/Icon/Qr.tsx
index b914921cb0..04c89d7cb6 100644
--- a/apps/wallet-mobile/src/components/Icon/Qr.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Qr.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Qr = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx b/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
index 62230591ba..a9b727c555 100644
--- a/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
+++ b/apps/wallet-mobile/src/components/Icon/QuestionMark.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const QuestionMark = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Received.tsx b/apps/wallet-mobile/src/components/Icon/Received.tsx
index 1ab86a7dc5..cab9047a94 100644
--- a/apps/wallet-mobile/src/components/Icon/Received.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Received.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Received = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Refresh.tsx b/apps/wallet-mobile/src/components/Icon/Refresh.tsx
index abfa37c4df..60e9f3775f 100644
--- a/apps/wallet-mobile/src/components/Icon/Refresh.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Refresh.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Refresh = ({size = 24, color = '#242838', active = false}: IconProps & {active: boolean}) => (
   <Svg width={size} height={size} viewBox="0 0 32 32" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Reload.tsx b/apps/wallet-mobile/src/components/Icon/Reload.tsx
index aad8f35270..6db11f86bd 100644
--- a/apps/wallet-mobile/src/components/Icon/Reload.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Reload.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Reload = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Resync.tsx b/apps/wallet-mobile/src/components/Icon/Resync.tsx
index a2d66183c4..da64a12bd0 100644
--- a/apps/wallet-mobile/src/components/Icon/Resync.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Resync.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Resync = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx b/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
index 8eac5f27a1..7ccd589365 100644
--- a/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
+++ b/apps/wallet-mobile/src/components/Icon/RewardManuallyPayout.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const RewardManuallyPayout = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg viewBox="0 0 36 36" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx b/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
index 2cb12ba827..ea9d29e828 100644
--- a/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
+++ b/apps/wallet-mobile/src/components/Icon/RewardWithdrawn.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const RewardWithdrawn = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg viewBox="0 0 36 36" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/Sandbox.tsx b/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
index ce1ccbb3e5..87f4a38750 100644
--- a/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Sandbox.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Sandbox = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Send.tsx b/apps/wallet-mobile/src/components/Icon/Send.tsx
index 4c76ffdc2f..74680a9362 100644
--- a/apps/wallet-mobile/src/components/Icon/Send.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Send.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Send = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Settings.tsx b/apps/wallet-mobile/src/components/Icon/Settings.tsx
index 9a1c334c6e..5e8d779159 100644
--- a/apps/wallet-mobile/src/components/Icon/Settings.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Settings.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Settings = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Share.tsx b/apps/wallet-mobile/src/components/Icon/Share.tsx
index fa7f12029c..7ab41d6568 100644
--- a/apps/wallet-mobile/src/components/Icon/Share.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Share.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Share = ({size = 36, color = '#000000'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Share2.tsx b/apps/wallet-mobile/src/components/Icon/Share2.tsx
index b71d1af5b4..a0b0280f60 100644
--- a/apps/wallet-mobile/src/components/Icon/Share2.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Share2.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Share2 = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx b/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
index 927b90d710..fe2c987412 100644
--- a/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SliderSettings.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const SliderSettings = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/SortTable.tsx b/apps/wallet-mobile/src/components/Icon/SortTable.tsx
index b3af083cff..8d33e0acd2 100644
--- a/apps/wallet-mobile/src/components/Icon/SortTable.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SortTable.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const SortTable = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx b/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
index bfa42baba7..2434cf3791 100644
--- a/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SpectrumSwap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {ClipPath, Defs, G, Path, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const SpectrumSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 44 41" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Square.tsx b/apps/wallet-mobile/src/components/Icon/Square.tsx
index ba3d0ad68e..c65e7241b2 100644
--- a/apps/wallet-mobile/src/components/Icon/Square.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Square.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Square = ({size = 24, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/Staking.tsx b/apps/wallet-mobile/src/components/Icon/Staking.tsx
index 604adfdb28..2e95b2a980 100644
--- a/apps/wallet-mobile/src/components/Icon/Staking.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Staking.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Staking = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx b/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
index 4d73e0caff..f6824d03ed 100644
--- a/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StakingKeyDeregistered.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Circle, G, Line, Path, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const StakingKeyDeregistered = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg viewBox="0 0 36 36" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx b/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
index a721e72da3..8c22891453 100644
--- a/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StakingKeyRegistered.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Line, Path, Polyline, Rect} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const StakingKeyRegistered = ({size = 36, color = '#6B7384'}: IconProps) => (
   <Svg viewBox="0 0 36 36" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/StarFilled.tsx b/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
index bd205c3554..b09a498ae4 100644
--- a/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StarFilled.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const StarFilled = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx b/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
index 197b178a28..44f791ec4f 100644
--- a/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
+++ b/apps/wallet-mobile/src/components/Icon/StarOutlined.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const StarOutlined = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx b/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
index ae98736a86..1cf9d1c3bd 100644
--- a/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/SundaeSwap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const SundaeSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 85.489 83.521" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Support.tsx b/apps/wallet-mobile/src/components/Icon/Support.tsx
index 68ce265654..9df84e1285 100644
--- a/apps/wallet-mobile/src/components/Icon/Support.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Support.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Support = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Swap.tsx b/apps/wallet-mobile/src/components/Icon/Swap.tsx
index 84a5f98414..c1e0f69048 100644
--- a/apps/wallet-mobile/src/components/Icon/Swap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Swap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Swap = ({size = 24, color}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Switch.tsx b/apps/wallet-mobile/src/components/Icon/Switch.tsx
index 85952e1b1b..eb47a890a4 100644
--- a/apps/wallet-mobile/src/components/Icon/Switch.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Switch.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Switch = (props: IconProps) => {
   const {color: colors} = useTheme()
diff --git a/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx b/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
index 015187508a..3c28ed7d6c 100644
--- a/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabDiscover.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabDiscover = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 25 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx b/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
index 97d9628bde..8a5804eac8 100644
--- a/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabDiscoverActive.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabDiscoverActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/TabMenu.tsx b/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
index 74dd0e5815..e227094d30 100644
--- a/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabMenu.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabMenu = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size - 1} viewBox="0 0 25 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx b/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
index b797ff1380..927f4fe765 100644
--- a/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabMenuActive.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabMenuActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx b/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
index 5c46beaea7..7e3685272f 100644
--- a/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabPortfolio.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabPortfolio = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx b/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
index f42830307a..bc4cdbf95d 100644
--- a/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabPortfolioActive.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabPortfolioActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/TabStaking.tsx b/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
index 59f09516b9..0b9b9ec88e 100644
--- a/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabStaking.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabStaking = ({size = 24, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24">
diff --git a/apps/wallet-mobile/src/components/Icon/TabWallet.tsx b/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
index 34092b8eb9..480f8394e2 100644
--- a/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabWallet.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabWallet = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx b/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
index 7f234e23ba..313f37d796 100644
--- a/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TabWalletActive.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TabWalletActive = ({size = 24, color = '#6B7384'}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Table.tsx b/apps/wallet-mobile/src/components/Icon/Table.tsx
index ca0e5972b2..11939d66d9 100644
--- a/apps/wallet-mobile/src/components/Icon/Table.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Table.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Table = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Telegram.tsx b/apps/wallet-mobile/src/components/Icon/Telegram.tsx
index c754fd9f32..e0b4092e39 100644
--- a/apps/wallet-mobile/src/components/Icon/Telegram.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Telegram.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Telegram = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx b/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
index 5e3c57ca52..ce7d7e1975 100644
--- a/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TermsOfUse.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TermsOfUse = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Theme.tsx b/apps/wallet-mobile/src/components/Icon/Theme.tsx
index 6e9273e2ac..df6db5d239 100644
--- a/apps/wallet-mobile/src/components/Icon/Theme.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Theme.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Theme = ({size = 20, color = '#6B7384'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 20 20" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx b/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
index cb014012a2..0f1f26bb79 100644
--- a/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/ThumbsUp.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const ThumbsUp = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Tokens.tsx b/apps/wallet-mobile/src/components/Icon/Tokens.tsx
index ec55ba9c46..6878609755 100644
--- a/apps/wallet-mobile/src/components/Icon/Tokens.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Tokens.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Tokens = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/TotalAda.tsx b/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
index 0ea75d360d..a23c306fbb 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalAda.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TotalAda = ({size = 44, color = 'black'}: IconProps) => (
   <Svg viewBox="0 0 44 44" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx b/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
index 79432b0d5a..7bbf2c373d 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalDelegated.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TotalDelegated = ({size = 44, color = 'black'}: IconProps) => (
   <Svg viewBox="0 0 44 44" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/TotalReward.tsx b/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
index 3a6a259af7..7a80d8824f 100644
--- a/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
+++ b/apps/wallet-mobile/src/components/Icon/TotalReward.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Circle, G, Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const TotalReward = ({size = 44, color = 'black'}: IconProps) => (
   <Svg viewBox="0 0 44 44" width={size} height={size}>
diff --git a/apps/wallet-mobile/src/components/Icon/Transaction.tsx b/apps/wallet-mobile/src/components/Icon/Transaction.tsx
index 244d3d52b3..cf5b131ab9 100644
--- a/apps/wallet-mobile/src/components/Icon/Transaction.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Transaction.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Transaction = ({size = 24, color = '#242838'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Twitter.tsx b/apps/wallet-mobile/src/components/Icon/Twitter.tsx
index 410d7abbe4..79636b30e5 100644
--- a/apps/wallet-mobile/src/components/Icon/Twitter.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Twitter.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Twitter = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Usb.tsx b/apps/wallet-mobile/src/components/Icon/Usb.tsx
index 2438d40c12..601207ae9c 100644
--- a/apps/wallet-mobile/src/components/Icon/Usb.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Usb.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Usb = ({color = '#4B6DDE', size = 25}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/Verify.tsx b/apps/wallet-mobile/src/components/Icon/Verify.tsx
index 280dcf4a44..d5828390a6 100644
--- a/apps/wallet-mobile/src/components/Icon/Verify.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Verify.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Verify = ({size = 40, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx b/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
index b7acd24ec6..768fd71f63 100644
--- a/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
+++ b/apps/wallet-mobile/src/components/Icon/VyfiSwap.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const VyfiSwap = ({size = 36}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 40 40" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/Wallet.tsx b/apps/wallet-mobile/src/components/Icon/Wallet.tsx
index c18eee1927..4de9193d1a 100644
--- a/apps/wallet-mobile/src/components/Icon/Wallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Wallet.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Wallet = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx b/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
index b307416c23..b12a5bff14 100644
--- a/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WalletAvatar.tsx
@@ -3,7 +3,7 @@ import {Image} from 'expo-image'
 import React from 'react'
 import {StyleSheet, View, ViewStyle} from 'react-native'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const WalletAvatar = ({image = '', size = 40, style}: IconProps & {image?: string; style?: ViewStyle}) => {
   const styles = useStyles()
diff --git a/apps/wallet-mobile/src/components/Icon/WalletStack.tsx b/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
index b511fe3c54..e9085b64dc 100644
--- a/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WalletStack.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const WalletStack = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Wallets.tsx b/apps/wallet-mobile/src/components/Icon/Wallets.tsx
index 3cb3b11bea..ff51435988 100644
--- a/apps/wallet-mobile/src/components/Icon/Wallets.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Wallets.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Wallets = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/Warning.tsx b/apps/wallet-mobile/src/components/Icon/Warning.tsx
index b5cc52396c..01f6b5fbac 100644
--- a/apps/wallet-mobile/src/components/Icon/Warning.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Warning.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const Warning = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="0 0 24 24" fill="none">
diff --git a/apps/wallet-mobile/src/components/Icon/WingRiders.tsx b/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
index 8538254a26..5fdf38fd4f 100644
--- a/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
+++ b/apps/wallet-mobile/src/components/Icon/WingRiders.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const WingRiders = ({size = 36}: IconProps) => {
   const {color} = useTheme()
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx b/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
index 80dd6a9616..20aeb40c37 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiApp.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Defs, LinearGradient, Path, Rect, Stop} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const YoroiApp = ({size = 36}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx b/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
index 4c79015105..73c6bdbf27 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiNightly.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {Path} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const YoroiNightly = ({size = 36, color = 'black'}: IconProps) => (
   <Svg width={size} height={size} viewBox="-2 -2 28 28">
diff --git a/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx b/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
index 44af722583..4f8f337e76 100644
--- a/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
+++ b/apps/wallet-mobile/src/components/Icon/YoroiWallet.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Svg, {G, Path, Polygon} from 'react-native-svg'
 
-import {IconProps} from '.'
+import {IconProps} from './type'
 
 export const YoroiWallet = ({color = 'white', size = 210}: IconProps) => {
   return (
diff --git a/apps/wallet-mobile/src/components/Icon/index.ts b/apps/wallet-mobile/src/components/Icon/index.ts
index 7139647865..37bb92c860 100644
--- a/apps/wallet-mobile/src/components/Icon/index.ts
+++ b/apps/wallet-mobile/src/components/Icon/index.ts
@@ -287,8 +287,3 @@ export const Icon = {
   AngleUp,
   AngleDown,
 }
-
-export type IconProps = {
-  size?: number
-  color?: string
-}
diff --git a/apps/wallet-mobile/src/components/Icon/type.ts b/apps/wallet-mobile/src/components/Icon/type.ts
new file mode 100644
index 0000000000..2c84766433
--- /dev/null
+++ b/apps/wallet-mobile/src/components/Icon/type.ts
@@ -0,0 +1,4 @@
+export type IconProps = {
+  size?: number
+  color?: string
+}

From 0f5792cf2dc64811a5cc0484f3f6424bf66f752b Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 17:07:27 +0200
Subject: [PATCH 11/16] fix

---
 apps/wallet-mobile/src/components/Button/Button.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/components/Button/Button.tsx b/apps/wallet-mobile/src/components/Button/Button.tsx
index 25c9bea6d7..4846925a58 100644
--- a/apps/wallet-mobile/src/components/Button/Button.tsx
+++ b/apps/wallet-mobile/src/components/Button/Button.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import React from 'react'
 import {ActivityIndicator, Pressable, PressableProps, StyleSheet, TextStyle, View, ViewStyle} from 'react-native'
 
-import type {IconProps} from '../Icon'
+import type {IconProps} from '../Icon/type'
 import {Text} from '../Text'
 
 export const ButtonType = {

From 58f48309a4b83a15bc3aff2249d9044277ccbf4d Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Thu, 26 Sep 2024 17:38:43 +0200
Subject: [PATCH 12/16] ...

---
 apps/wallet-mobile/src/components/Icon/Direction.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/components/Icon/Direction.tsx b/apps/wallet-mobile/src/components/Icon/Direction.tsx
index cccb61e57e..0a346b9c23 100644
--- a/apps/wallet-mobile/src/components/Icon/Direction.tsx
+++ b/apps/wallet-mobile/src/components/Icon/Direction.tsx
@@ -6,8 +6,8 @@ import {TransactionDirection, TransactionInfo} from '../../yoroi-wallets/types/o
 import {Received} from '../Icon/Received'
 import {Send} from '../Icon/Send'
 import {Transaction} from '../Icon/Transaction'
-import {IconProps} from './type'
 import {MultiParty} from './MultiParty'
+import {IconProps} from './type'
 
 export const Direction = ({transaction, size = defaultSize}: IconProps & {transaction: TransactionInfo}) => {
   const {color} = useTheme()

From 90b6c1a27be70a93f8f8bf2f363883e6f7cccfe9 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Tue, 8 Oct 2024 12:13:45 +0200
Subject: [PATCH 13/16] fix after merge

---
 .../Settings/SettingsScreenNavigator.tsx      |  4 +-
 .../messages/src/AppNavigator.json            | 34 +++----
 .../MediaDetailsScreen.json                   | 90 +++++++++----------
 .../src/legacy/Dashboard/UserSummary.json     | 18 ++--
 4 files changed, 73 insertions(+), 73 deletions(-)

diff --git a/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx b/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
index 6054fdd899..fee4ed792f 100644
--- a/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
+++ b/apps/wallet-mobile/src/features/Settings/SettingsScreenNavigator.tsx
@@ -138,8 +138,8 @@ export const SettingsScreenNavigator = () => {
         options={{
           title: strings.networkTitle,
           headerRight: () => (
-            <TouchableOpacity onPress={handleOpenModal} activeOpacity={0.5}>
-              <Icon.Info size={24} color={color.gray_900} style={{...atoms.px_lg}} />
+            <TouchableOpacity onPress={handleOpenModal} activeOpacity={0.5} style={{...atoms.px_lg}}>
+              <Icon.Info size={24} color={color.gray_900} />
             </TouchableOpacity>
           ),
         }}
diff --git a/apps/wallet-mobile/translations/messages/src/AppNavigator.json b/apps/wallet-mobile/translations/messages/src/AppNavigator.json
index 094412f95b..0d1c6a4daf 100644
--- a/apps/wallet-mobile/translations/messages/src/AppNavigator.json
+++ b/apps/wallet-mobile/translations/messages/src/AppNavigator.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Enter PIN",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 230,
+      "line": 233,
       "column": 17,
-      "index": 8390
+      "index": 8700
     },
     "end": {
-      "line": 233,
+      "line": 236,
       "column": 3,
-      "index": 8480
+      "index": 8790
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Set PIN",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 234,
+      "line": 237,
       "column": 18,
-      "index": 8500
+      "index": 8810
     },
     "end": {
-      "line": 237,
+      "line": 240,
       "column": 3,
-      "index": 8598
+      "index": 8908
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Auth with OS changes",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 238,
+      "line": 241,
       "column": 25,
-      "index": 8625
+      "index": 8935
     },
     "end": {
-      "line": 241,
+      "line": 244,
       "column": 3,
-      "index": 8739
+      "index": 9049
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Auth with OS changed detected",
     "file": "src/AppNavigator.tsx",
     "start": {
-      "line": 242,
+      "line": 245,
       "column": 27,
-      "index": 8768
+      "index": 9078
     },
     "end": {
-      "line": 245,
+      "line": 248,
       "column": 3,
-      "index": 8889
+      "index": 9199
     }
   }
-]
+]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
index 0b02223f8a..821ab3e8c8 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!NFT Details",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 378,
+      "line": 367,
       "column": 9,
-      "index": 10888
+      "index": 10519
     },
     "end": {
-      "line": 381,
+      "line": 370,
       "column": 3,
-      "index": 10959
+      "index": 10590
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Overview",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 382,
+      "line": 371,
       "column": 12,
-      "index": 10973
+      "index": 10604
     },
     "end": {
-      "line": 385,
+      "line": 374,
       "column": 3,
-      "index": 11044
+      "index": 10675
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Metadata",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 386,
+      "line": 375,
       "column": 12,
-      "index": 11058
+      "index": 10689
     },
     "end": {
-      "line": 389,
+      "line": 378,
       "column": 3,
-      "index": 11129
+      "index": 10760
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!NFT Name",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 390,
+      "line": 379,
       "column": 11,
-      "index": 11142
+      "index": 10773
     },
     "end": {
-      "line": 393,
+      "line": 382,
       "column": 3,
-      "index": 11212
+      "index": 10843
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Created",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 394,
+      "line": 383,
       "column": 13,
-      "index": 11227
+      "index": 10858
     },
     "end": {
-      "line": 397,
+      "line": 386,
       "column": 3,
-      "index": 11298
+      "index": 10929
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Description",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 398,
+      "line": 387,
       "column": 15,
-      "index": 11315
+      "index": 10946
     },
     "end": {
-      "line": 401,
+      "line": 390,
       "column": 3,
-      "index": 11392
+      "index": 11023
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Author",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 402,
+      "line": 391,
       "column": 10,
-      "index": 11404
+      "index": 11035
     },
     "end": {
-      "line": 405,
+      "line": 394,
       "column": 3,
-      "index": 11471
+      "index": 11102
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Fingerprint",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 406,
+      "line": 395,
       "column": 15,
-      "index": 11488
+      "index": 11119
     },
     "end": {
-      "line": 409,
+      "line": 398,
       "column": 3,
-      "index": 11565
+      "index": 11196
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Policy id",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 410,
+      "line": 399,
       "column": 12,
-      "index": 11579
+      "index": 11210
     },
     "end": {
-      "line": 413,
+      "line": 402,
       "column": 3,
-      "index": 11651
+      "index": 11282
     }
   },
   {
@@ -139,14 +139,14 @@
     "defaultMessage": "!!!Details on",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 414,
+      "line": 403,
       "column": 16,
-      "index": 11669
+      "index": 11300
     },
     "end": {
-      "line": 417,
+      "line": 406,
       "column": 3,
-      "index": 11746
+      "index": 11377
     }
   },
   {
@@ -154,14 +154,14 @@
     "defaultMessage": "!!!Copy metadata",
     "file": "src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.tsx",
     "start": {
-      "line": 418,
+      "line": 407,
       "column": 16,
-      "index": 11764
+      "index": 11395
     },
     "end": {
-      "line": 421,
+      "line": 410,
       "column": 3,
-      "index": 11844
+      "index": 11475
     }
   }
-]
+]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
index 46ffe4bb2f..64526f1453 100644
--- a/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
+++ b/apps/wallet-mobile/translations/messages/src/legacy/Dashboard/UserSummary.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 163,
       "column": 9,
-      "index": 5279
+      "index": 4877
     },
     "end": {
       "line": 166,
       "column": 3,
-      "index": 5381
+      "index": 4979
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 167,
       "column": 16,
-      "index": 5399
+      "index": 4997
     },
     "end": {
       "line": 170,
       "column": 3,
-      "index": 5509
+      "index": 5107
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 171,
       "column": 18,
-      "index": 5529
+      "index": 5127
     },
     "end": {
       "line": 174,
       "column": 3,
-      "index": 5643
+      "index": 5241
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 175,
       "column": 23,
-      "index": 5668
+      "index": 5266
     },
     "end": {
       "line": 178,
       "column": 3,
-      "index": 5780
+      "index": 5378
     }
   }
-]
+]
\ No newline at end of file

From 45d261a3ab1e8a4b9294125d6eb60a5898daa6ae Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Tue, 8 Oct 2024 12:15:42 +0200
Subject: [PATCH 14/16] Fix alignment

---
 .../features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
index 87123c7856..e9b4fc2325 100644
--- a/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
+++ b/apps/wallet-mobile/src/features/Exchange/common/ShowBuyBanner/BuyBannerSmall.tsx
@@ -63,7 +63,7 @@ const useStyles = () => {
       flexGrow: 0,
     },
     button: {
-      ...atoms.self_center,
+      ...atoms.self_start,
     },
     title: {
       ...atoms.body_1_lg_medium,

From acb9da3c55ae6043cd4b6f11c12fef5b3eada365 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Fri, 11 Oct 2024 11:13:52 +0200
Subject: [PATCH 15/16] fix conflicts

---
 .../features/ReviewTx/common/CopiableText.tsx |   6 +-
 .../features/ReviewTx/common/TokenDetails.tsx |   6 +-
 .../MediaDetailsScreen.json                   |  46 ++---
 .../ListAmountsToSendScreen.json              |  10 +-
 .../Settings/SettingsScreenNavigator.json     | 160 ++++++++---------
 .../WalletSettings/WalletSettingsScreen.json  | 168 +++++++++---------
 6 files changed, 198 insertions(+), 198 deletions(-)

diff --git a/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx b/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx
index b09812b5a6..9d2865f4c1 100644
--- a/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx
+++ b/apps/wallet-mobile/src/features/ReviewTx/common/CopiableText.tsx
@@ -2,18 +2,18 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
 
+import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../components/Icon'
-import {useCopy} from '../../../hooks/useCopy'
 
 export const CopiableText = ({children, textToCopy}: {children: React.ReactNode; textToCopy: string}) => {
   const {styles, colors} = useStyles()
-  const [, copy] = useCopy()
+  const {copy} = useCopy()
 
   return (
     <View style={styles.text}>
       {children}
 
-      <TouchableOpacity onPress={() => copy(textToCopy)} activeOpacity={0.5}>
+      <TouchableOpacity onPress={() => copy({text: textToCopy})} activeOpacity={0.5}>
         <Icon.Copy size={24} color={colors.copy} />
       </TouchableOpacity>
     </View>
diff --git a/apps/wallet-mobile/src/features/ReviewTx/common/TokenDetails.tsx b/apps/wallet-mobile/src/features/ReviewTx/common/TokenDetails.tsx
index 6f590decfa..e96569c482 100644
--- a/apps/wallet-mobile/src/features/ReviewTx/common/TokenDetails.tsx
+++ b/apps/wallet-mobile/src/features/ReviewTx/common/TokenDetails.tsx
@@ -4,11 +4,11 @@ import {Portfolio} from '@yoroi/types'
 import * as React from 'react'
 import {Linking, ScrollView, StyleSheet, Text, TouchableOpacity, View} from 'react-native'
 
+import {useCopy} from '../../../components/Clipboard/ClipboardProvider'
 import {Icon} from '../../../components/Icon'
 import {MediaPreview} from '../../../components/MediaPreview/MediaPreview'
 import {SimpleTab} from '../../../components/SimpleTab/SimpleTab'
 import {Space} from '../../../components/Space/Space'
-import {useCopy} from '../../../hooks/useCopy'
 import {time} from '../../../kernel/constants'
 import {isEmptyString} from '../../../kernel/utils'
 import {useSelectedWallet} from '../../WalletManager/common/hooks/useSelectedWallet'
@@ -99,7 +99,7 @@ const Info = ({info}: {info: Portfolio.Token.Info}) => {
 const Json = ({discovery, isActive}: {discovery?: Portfolio.Token.Discovery; isActive: boolean}) => {
   const {styles, colors} = useStyles()
   const strings = useStrings()
-  const [, copy] = useCopy()
+  const {copy} = useCopy()
 
   if (!isActive || !discovery) return null
 
@@ -110,7 +110,7 @@ const Json = ({discovery, isActive}: {discovery?: Portfolio.Token.Discovery; isA
       <View style={styles.jsonHeader}>
         <Text style={styles.jsonLabel}>{strings.metadata}</Text>
 
-        <TouchableOpacity onPress={() => copy(stringifiedMetadata)} activeOpacity={0.5}>
+        <TouchableOpacity onPress={() => copy({text: stringifiedMetadata})} activeOpacity={0.5}>
           <Icon.Copy size={24} color={colors.copy} />
         </TouchableOpacity>
       </View>
diff --git a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
index 7070b8c6ba..d8c3203900 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Portfolio/common/MediaDetailsScreen/MediaDetailsScreen.json
@@ -6,12 +6,12 @@
     "start": {
       "line": 367,
       "column": 9,
-      "index": 10908
+      "index": 10539
     },
     "end": {
       "line": 370,
       "column": 3,
-      "index": 10979
+      "index": 10610
     }
   },
   {
@@ -21,12 +21,12 @@
     "start": {
       "line": 371,
       "column": 12,
-      "index": 10993
+      "index": 10624
     },
     "end": {
       "line": 374,
       "column": 3,
-      "index": 11064
+      "index": 10695
     }
   },
   {
@@ -36,12 +36,12 @@
     "start": {
       "line": 375,
       "column": 12,
-      "index": 11078
+      "index": 10709
     },
     "end": {
       "line": 378,
       "column": 3,
-      "index": 11149
+      "index": 10780
     }
   },
   {
@@ -51,12 +51,12 @@
     "start": {
       "line": 379,
       "column": 11,
-      "index": 11162
+      "index": 10793
     },
     "end": {
       "line": 382,
       "column": 3,
-      "index": 11232
+      "index": 10863
     }
   },
   {
@@ -66,12 +66,12 @@
     "start": {
       "line": 383,
       "column": 13,
-      "index": 11247
+      "index": 10878
     },
     "end": {
       "line": 386,
       "column": 3,
-      "index": 11318
+      "index": 10949
     }
   },
   {
@@ -81,12 +81,12 @@
     "start": {
       "line": 387,
       "column": 15,
-      "index": 11335
+      "index": 10966
     },
     "end": {
       "line": 390,
       "column": 3,
-      "index": 11412
+      "index": 11043
     }
   },
   {
@@ -96,12 +96,12 @@
     "start": {
       "line": 391,
       "column": 10,
-      "index": 11424
+      "index": 11055
     },
     "end": {
       "line": 394,
       "column": 3,
-      "index": 11491
+      "index": 11122
     }
   },
   {
@@ -111,12 +111,12 @@
     "start": {
       "line": 395,
       "column": 15,
-      "index": 11508
+      "index": 11139
     },
     "end": {
       "line": 398,
       "column": 3,
-      "index": 11585
+      "index": 11216
     }
   },
   {
@@ -126,12 +126,12 @@
     "start": {
       "line": 399,
       "column": 12,
-      "index": 11599
+      "index": 11230
     },
     "end": {
       "line": 402,
       "column": 3,
-      "index": 11671
+      "index": 11302
     }
   },
   {
@@ -141,12 +141,12 @@
     "start": {
       "line": 403,
       "column": 16,
-      "index": 11689
+      "index": 11320
     },
     "end": {
       "line": 406,
       "column": 3,
-      "index": 11766
+      "index": 11397
     }
   },
   {
@@ -156,12 +156,12 @@
     "start": {
       "line": 407,
       "column": 16,
-      "index": 11784
+      "index": 11415
     },
     "end": {
       "line": 410,
       "column": 3,
-      "index": 11864
+      "index": 11495
     }
   }
-]
+]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
index 3f118ac576..0df5b7981c 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Add token",
     "file": "src/features/Send/useCases/ListAmountsToSend/ListAmountsToSendScreen.tsx",
     "start": {
-      "line": 226,
+      "line": 221,
       "column": 12,
-      "index": 7420
+      "index": 7359
     },
     "end": {
-      "line": 229,
+      "line": 224,
       "column": 3,
-      "index": 7497
+      "index": 7436
     }
   }
-]
+]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/SettingsScreenNavigator.json b/apps/wallet-mobile/translations/messages/src/features/Settings/SettingsScreenNavigator.json
index 98c2c91766..070d220f6c 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/SettingsScreenNavigator.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/SettingsScreenNavigator.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!Wallet",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 265,
+      "line": 256,
       "column": 18,
-      "index": 8007
+      "index": 7773
     },
     "end": {
-      "line": 268,
+      "line": 259,
       "column": 3,
-      "index": 8105
+      "index": 7871
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Application",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 269,
+      "line": 260,
       "column": 15,
-      "index": 8122
+      "index": 7888
     },
     "end": {
-      "line": 272,
+      "line": 263,
       "column": 3,
-      "index": 8231
+      "index": 7997
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Change PIN",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 273,
+      "line": 264,
       "column": 24,
-      "index": 8257
+      "index": 8023
     },
     "end": {
-      "line": 276,
+      "line": 267,
       "column": 3,
-      "index": 8366
+      "index": 8132
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Change spending password",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 277,
+      "line": 268,
       "column": 23,
-      "index": 8391
+      "index": 8157
     },
     "end": {
-      "line": 280,
+      "line": 271,
       "column": 3,
-      "index": 8505
+      "index": 8271
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Remove wallet",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 281,
+      "line": 272,
       "column": 21,
-      "index": 8528
+      "index": 8294
     },
     "end": {
-      "line": 284,
+      "line": 275,
       "column": 3,
-      "index": 8629
+      "index": 8395
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Terms of Service Agreement",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 285,
+      "line": 276,
       "column": 23,
-      "index": 8654
+      "index": 8420
     },
     "end": {
-      "line": 288,
+      "line": 279,
       "column": 3,
-      "index": 8770
+      "index": 8536
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Change wallet name",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 289,
+      "line": 280,
       "column": 25,
-      "index": 8797
+      "index": 8563
     },
     "end": {
-      "line": 292,
+      "line": 283,
       "column": 3,
-      "index": 8901
+      "index": 8667
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Support",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 293,
+      "line": 284,
       "column": 16,
-      "index": 8919
+      "index": 8685
     },
     "end": {
-      "line": 296,
+      "line": 287,
       "column": 3,
-      "index": 9010
+      "index": 8776
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Easy confirmation",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 297,
+      "line": 288,
       "column": 31,
-      "index": 9043
+      "index": 8809
     },
     "end": {
-      "line": 300,
+      "line": 291,
       "column": 3,
-      "index": 9158
+      "index": 8924
     }
   },
   {
@@ -139,14 +139,14 @@
     "defaultMessage": "!!!Easy confirmation",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 301,
+      "line": 292,
       "column": 32,
-      "index": 9192
+      "index": 8958
     },
     "end": {
-      "line": 304,
+      "line": 295,
       "column": 3,
-      "index": 9308
+      "index": 9074
     }
   },
   {
@@ -154,14 +154,14 @@
     "defaultMessage": "!!!Set PIN",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 305,
+      "line": 296,
       "column": 18,
-      "index": 9328
+      "index": 9094
     },
     "end": {
-      "line": 308,
+      "line": 299,
       "column": 3,
-      "index": 9426
+      "index": 9192
     }
   },
   {
@@ -169,14 +169,14 @@
     "defaultMessage": "!!!Settings",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 309,
+      "line": 300,
       "column": 17,
-      "index": 9445
+      "index": 9211
     },
     "end": {
-      "line": 312,
+      "line": 303,
       "column": 3,
-      "index": 9548
+      "index": 9314
     }
   },
   {
@@ -184,14 +184,14 @@
     "defaultMessage": "!!!Language",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 313,
+      "line": 304,
       "column": 17,
-      "index": 9567
+      "index": 9333
     },
     "end": {
-      "line": 316,
+      "line": 307,
       "column": 3,
-      "index": 9665
+      "index": 9431
     }
   },
   {
@@ -199,14 +199,14 @@
     "defaultMessage": "!!!Theming",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 317,
+      "line": 308,
       "column": 14,
-      "index": 9681
+      "index": 9447
     },
     "end": {
-      "line": 320,
+      "line": 311,
       "column": 3,
-      "index": 9775
+      "index": 9541
     }
   },
   {
@@ -214,14 +214,14 @@
     "defaultMessage": "!!!Network",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 321,
+      "line": 312,
       "column": 16,
-      "index": 9793
+      "index": 9559
     },
     "end": {
-      "line": 324,
+      "line": 315,
       "column": 3,
-      "index": 9889
+      "index": 9655
     }
   },
   {
@@ -229,14 +229,14 @@
     "defaultMessage": "!!!App settings",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 325,
+      "line": 316,
       "column": 20,
-      "index": 9911
+      "index": 9677
     },
     "end": {
-      "line": 328,
+      "line": 319,
       "column": 3,
-      "index": 10029
+      "index": 9795
     }
   },
   {
@@ -244,14 +244,14 @@
     "defaultMessage": "!!!About",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 329,
+      "line": 320,
       "column": 14,
-      "index": 10045
+      "index": 9811
     },
     "end": {
-      "line": 332,
+      "line": 323,
       "column": 3,
-      "index": 10145
+      "index": 9911
     }
   },
   {
@@ -259,14 +259,14 @@
     "defaultMessage": "!!!Privacy Policy",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 333,
+      "line": 324,
       "column": 22,
-      "index": 10169
+      "index": 9935
     },
     "end": {
-      "line": 336,
+      "line": 327,
       "column": 3,
-      "index": 10272
+      "index": 10038
     }
   },
   {
@@ -274,14 +274,14 @@
     "defaultMessage": "!!!Collateral",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 337,
+      "line": 328,
       "column": 14,
-      "index": 10288
+      "index": 10054
     },
     "end": {
-      "line": 340,
+      "line": 331,
       "column": 3,
-      "index": 10359
+      "index": 10125
     }
   },
   {
@@ -289,14 +289,14 @@
     "defaultMessage": "!!!Log",
     "file": "src/features/Settings/SettingsScreenNavigator.tsx",
     "start": {
-      "line": 341,
+      "line": 332,
       "column": 18,
-      "index": 10379
+      "index": 10145
     },
     "end": {
-      "line": 344,
+      "line": 335,
       "column": 3,
-      "index": 10436
+      "index": 10202
     }
   }
 ]
\ No newline at end of file
diff --git a/apps/wallet-mobile/translations/messages/src/features/Settings/WalletSettings/WalletSettingsScreen.json b/apps/wallet-mobile/translations/messages/src/features/Settings/WalletSettings/WalletSettingsScreen.json
index 0c242a6bf8..91a15ad429 100644
--- a/apps/wallet-mobile/translations/messages/src/features/Settings/WalletSettings/WalletSettingsScreen.json
+++ b/apps/wallet-mobile/translations/messages/src/features/Settings/WalletSettings/WalletSettingsScreen.json
@@ -4,14 +4,14 @@
     "defaultMessage": "!!!General",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 227,
+      "line": 214,
       "column": 11,
-      "index": 7420
+      "index": 6741
     },
     "end": {
-      "line": 230,
+      "line": 217,
       "column": 3,
-      "index": 7518
+      "index": 6839
     }
   },
   {
@@ -19,14 +19,14 @@
     "defaultMessage": "!!!Actions",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 231,
+      "line": 218,
       "column": 11,
-      "index": 7531
+      "index": 6852
     },
     "end": {
-      "line": 234,
+      "line": 221,
       "column": 3,
-      "index": 7629
+      "index": 6950
     }
   },
   {
@@ -34,14 +34,14 @@
     "defaultMessage": "!!!Switch wallet",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 235,
+      "line": 222,
       "column": 16,
-      "index": 7647
+      "index": 6968
     },
     "end": {
-      "line": 238,
+      "line": 225,
       "column": 3,
-      "index": 7756
+      "index": 7077
     }
   },
   {
@@ -49,14 +49,14 @@
     "defaultMessage": "!!!Logout",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 239,
+      "line": 226,
       "column": 10,
-      "index": 7768
+      "index": 7089
     },
     "end": {
-      "line": 242,
+      "line": 229,
       "column": 3,
-      "index": 7864
+      "index": 7185
     }
   },
   {
@@ -64,14 +64,14 @@
     "defaultMessage": "!!!Wallet name",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 243,
+      "line": 230,
       "column": 14,
-      "index": 7880
+      "index": 7201
     },
     "end": {
-      "line": 246,
+      "line": 233,
       "column": 3,
-      "index": 7985
+      "index": 7306
     }
   },
   {
@@ -79,14 +79,14 @@
     "defaultMessage": "!!!Security",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 247,
+      "line": 234,
       "column": 12,
-      "index": 7999
+      "index": 7320
     },
     "end": {
-      "line": 250,
+      "line": 237,
       "column": 3,
-      "index": 8099
+      "index": 7420
     }
   },
   {
@@ -94,14 +94,14 @@
     "defaultMessage": "!!!Change spending password",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 251,
+      "line": 238,
       "column": 18,
-      "index": 8119
+      "index": 7440
     },
     "end": {
-      "line": 254,
+      "line": 241,
       "column": 3,
-      "index": 8241
+      "index": 7562
     }
   },
   {
@@ -109,14 +109,14 @@
     "defaultMessage": "!!!Easy transaction confirmation",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 255,
+      "line": 242,
       "column": 20,
-      "index": 8263
+      "index": 7584
     },
     "end": {
-      "line": 258,
+      "line": 245,
       "column": 3,
-      "index": 8392
+      "index": 7713
     }
   },
   {
@@ -124,14 +124,14 @@
     "defaultMessage": "!!!Skip the password and approve transactions with biometrics",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 259,
+      "line": 246,
       "column": 24,
-      "index": 8418
+      "index": 7739
     },
     "end": {
-      "line": 262,
+      "line": 249,
       "column": 3,
-      "index": 8580
+      "index": 7901
     }
   },
   {
@@ -139,14 +139,14 @@
     "defaultMessage": "!!!Remove wallet",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 263,
+      "line": 250,
       "column": 16,
-      "index": 8598
+      "index": 7919
     },
     "end": {
-      "line": 266,
+      "line": 253,
       "column": 3,
-      "index": 8707
+      "index": 8028
     }
   },
   {
@@ -154,14 +154,14 @@
     "defaultMessage": "!!!Collateral",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 267,
+      "line": 254,
       "column": 14,
-      "index": 8723
+      "index": 8044
     },
     "end": {
-      "line": 270,
+      "line": 257,
       "column": 3,
-      "index": 8794
+      "index": 8115
     }
   },
   {
@@ -169,14 +169,14 @@
     "defaultMessage": "!!!Multiple addresses",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 271,
+      "line": 258,
       "column": 21,
-      "index": 8817
+      "index": 8138
     },
     "end": {
-      "line": 274,
+      "line": 261,
       "column": 3,
-      "index": 8903
+      "index": 8224
     }
   },
   {
@@ -184,14 +184,14 @@
     "defaultMessage": "!!!Single address",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 275,
+      "line": 262,
       "column": 17,
-      "index": 8922
+      "index": 8243
     },
     "end": {
-      "line": 278,
+      "line": 265,
       "column": 3,
-      "index": 9000
+      "index": 8321
     }
   },
   {
@@ -199,14 +199,14 @@
     "defaultMessage": "!!!By enabling this you can operate with more wallet addresses",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 279,
+      "line": 266,
       "column": 25,
-      "index": 9027
+      "index": 8348
     },
     "end": {
-      "line": 282,
+      "line": 269,
       "column": 3,
-      "index": 9158
+      "index": 8479
     }
   },
   {
@@ -214,14 +214,14 @@
     "defaultMessage": "!!!Network:",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 284,
+      "line": 271,
       "column": 11,
-      "index": 9219
+      "index": 8540
     },
     "end": {
-      "line": 287,
+      "line": 274,
       "column": 3,
-      "index": 9285
+      "index": 8606
     }
   },
   {
@@ -229,14 +229,14 @@
     "defaultMessage": "!!!Wallet type:",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 288,
+      "line": 275,
       "column": 14,
-      "index": 9301
+      "index": 8622
     },
     "end": {
-      "line": 291,
+      "line": 278,
       "column": 3,
-      "index": 9407
+      "index": 8728
     }
   },
   {
@@ -244,14 +244,14 @@
     "defaultMessage": "!!!Byron-era wallet",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 292,
+      "line": 279,
       "column": 15,
-      "index": 9424
+      "index": 8745
     },
     "end": {
-      "line": 295,
+      "line": 282,
       "column": 3,
-      "index": 9535
+      "index": 8856
     }
   },
   {
@@ -259,14 +259,14 @@
     "defaultMessage": "!!!Shelley-era wallet",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 296,
+      "line": 283,
       "column": 17,
-      "index": 9554
+      "index": 8875
     },
     "end": {
-      "line": 299,
+      "line": 286,
       "column": 3,
-      "index": 9669
+      "index": 8990
     }
   },
   {
@@ -274,14 +274,14 @@
     "defaultMessage": "!!!Unknown Wallet Type",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 300,
+      "line": 287,
       "column": 21,
-      "index": 9692
+      "index": 9013
     },
     "end": {
-      "line": 303,
+      "line": 290,
       "column": 3,
-      "index": 9812
+      "index": 9133
     }
   },
   {
@@ -289,14 +289,14 @@
     "defaultMessage": "!!!About",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 304,
+      "line": 291,
       "column": 9,
-      "index": 9823
+      "index": 9144
     },
     "end": {
-      "line": 307,
+      "line": 294,
       "column": 3,
-      "index": 9917
+      "index": 9238
     }
   },
   {
@@ -304,14 +304,14 @@
     "defaultMessage": "!!!Resync",
     "file": "src/features/Settings/WalletSettings/WalletSettingsScreen.tsx",
     "start": {
-      "line": 308,
+      "line": 295,
       "column": 10,
-      "index": 9929
+      "index": 9250
     },
     "end": {
-      "line": 311,
+      "line": 298,
       "column": 3,
-      "index": 10031
+      "index": 9352
     }
   }
 ]
\ No newline at end of file

From 69c5031efeaddee1a8859aff5e51efceb6a24cc6 Mon Sep 17 00:00:00 2001
From: jorbuedo <jorbuedo@gmail.com>
Date: Fri, 11 Oct 2024 11:43:09 +0200
Subject: [PATCH 16/16] fix

---
 .../ReviewTx/useCases/ReviewTxScreen/ReviewTxScreen.tsx         | 2 +-
 .../Settings/ManageCollateral/InitialCollateralInfoModal.tsx    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTxScreen.tsx b/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTxScreen.tsx
index c1d728dbe5..035dc332c2 100644
--- a/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTxScreen.tsx
+++ b/apps/wallet-mobile/src/features/ReviewTx/useCases/ReviewTxScreen/ReviewTxScreen.tsx
@@ -58,7 +58,7 @@ export const ReviewTxScreen = () => {
       </MaterialTab.Navigator>
 
       <Actions>
-        <Button title={strings.confirm} shelleyTheme onPress={onConfirm} />
+        <Button title={strings.confirm} onPress={onConfirm} />
       </Actions>
     </SafeArea>
   )
diff --git a/apps/wallet-mobile/src/features/Settings/ManageCollateral/InitialCollateralInfoModal.tsx b/apps/wallet-mobile/src/features/Settings/ManageCollateral/InitialCollateralInfoModal.tsx
index 589cd07a1f..4c98f2a468 100644
--- a/apps/wallet-mobile/src/features/Settings/ManageCollateral/InitialCollateralInfoModal.tsx
+++ b/apps/wallet-mobile/src/features/Settings/ManageCollateral/InitialCollateralInfoModal.tsx
@@ -20,7 +20,7 @@ export const InitialCollateralInfoModal = ({onConfirm}: {onConfirm: () => void})
       <Space fill />
 
       <View style={styles.actions}>
-        <Button title={strings.initialCollateralInfoModalButton} mainTheme onPress={onConfirm} />
+        <Button title={strings.initialCollateralInfoModalButton} onPress={onConfirm} />
       </View>
     </View>
   )