From 1a494b26e7bc420a79668b4c5367f651e28a440c Mon Sep 17 00:00:00 2001
From: siandreev <andreev.sergey.i@yandex.ru>
Date: Thu, 12 Dec 2024 14:09:00 +0100
Subject: [PATCH] fix: minor layout improvements

---
 .../uikit/src/components/create/AddWallet.tsx | 40 +++++++++---------
 .../desktop/aside/WalletAsideMenu.tsx         | 41 ++++++++++---------
 .../desktop/header/DesktopWalletHeader.tsx    | 18 ++++----
 .../uikit/src/components/nft/NftAction.tsx    | 27 ++++++------
 .../desktop-pages/nft/DesktopCollectables.tsx |  7 +---
 5 files changed, 68 insertions(+), 65 deletions(-)

diff --git a/packages/uikit/src/components/create/AddWallet.tsx b/packages/uikit/src/components/create/AddWallet.tsx
index 5f7843dff..2ac401ae1 100644
--- a/packages/uikit/src/components/create/AddWallet.tsx
+++ b/packages/uikit/src/components/create/AddWallet.tsx
@@ -165,25 +165,27 @@ export const AddWalletContent: FC<{ onSelect: (path: AddWalletMethod) => void }>
                     </AddMethodText>
                     <RightIconStyled />
                 </AddMethod>
-                {canAddMultisig && !hideMultisig && (
-                    <AddMethod onClick={() => onSelect('multisig')}>
-                        <ButtonIcon>
-                            <WalletPencilIcon />
-                        </ButtonIcon>
-                        <AddMethodText>
-                            <AddMethodLabel>
-                                {t('add_wallet_new_multisig_title')}{' '}
-                                <HideOnReview>
-                                    <Badge color="accentBlue">PRO</Badge>
-                                </HideOnReview>
-                            </AddMethodLabel>
-                            <AddMethodDescription>
-                                {t('add_wallet_new_multisig_description')}
-                            </AddMethodDescription>
-                        </AddMethodText>
-                        <RightIconStyled />
-                    </AddMethod>
-                )}
+                <HideOnReview>
+                    {canAddMultisig && !hideMultisig && (
+                        <AddMethod onClick={() => onSelect('multisig')}>
+                            <ButtonIcon>
+                                <WalletPencilIcon />
+                            </ButtonIcon>
+                            <AddMethodText>
+                                <AddMethodLabel>
+                                    {t('add_wallet_new_multisig_title')}{' '}
+                                    <HideOnReview>
+                                        <Badge color="accentBlue">PRO</Badge>
+                                    </HideOnReview>
+                                </AddMethodLabel>
+                                <AddMethodDescription>
+                                    {t('add_wallet_new_multisig_description')}
+                                </AddMethodDescription>
+                            </AddMethodText>
+                            <RightIconStyled />
+                        </AddMethod>
+                    )}
+                </HideOnReview>
                 <AddMethod onClick={() => onSelect('testnet')}>
                     <ButtonIcon>
                         <WalletTestnetIcon />
diff --git a/packages/uikit/src/components/desktop/aside/WalletAsideMenu.tsx b/packages/uikit/src/components/desktop/aside/WalletAsideMenu.tsx
index 084511ea9..e006f3911 100644
--- a/packages/uikit/src/components/desktop/aside/WalletAsideMenu.tsx
+++ b/packages/uikit/src/components/desktop/aside/WalletAsideMenu.tsx
@@ -96,15 +96,16 @@ export const WalletAsideMenu = () => {
                     </AsideMenuItemStyled>
                 )}
             </NavLink>
+
+            <NavLink to={AppRoute.purchases}>
+                {({ isActive }) => (
+                    <AsideMenuItemStyled isSelected={isActive}>
+                        <SaleBadgeIcon />
+                        <Label2>{t('wallet_aside_collectibles')}</Label2>
+                    </AsideMenuItemStyled>
+                )}
+            </NavLink>
             <HideOnReview>
-                <NavLink to={AppRoute.purchases}>
-                    {({ isActive }) => (
-                        <AsideMenuItemStyled isSelected={isActive}>
-                            <SaleBadgeIcon />
-                            <Label2>{t('wallet_aside_collectibles')}</Label2>
-                        </AsideMenuItemStyled>
-                    )}
-                </NavLink>
                 <NavLink to={AppRoute.dns}>
                     {({ isActive }) => (
                         <AsideMenuItemStyled isSelected={isActive}>
@@ -123,19 +124,19 @@ export const WalletAsideMenu = () => {
                         )}
                     </NavLink>
                 )}
+                {isMultisig && !isTestnet && <MultisigOrdersMenuItem />}
+                {showMultisigs && !isTestnet && (
+                    <NavLink to={AppRoute.multisigWallets}>
+                        {({ isActive }) => (
+                            <AsideMenuItemStyled isSelected={isActive}>
+                                <ListIcon />
+                                <Label2>{t('wallet_aside_multisig_wallets')}</Label2>
+                            </AsideMenuItemStyled>
+                        )}
+                    </NavLink>
+                )}
+                {canUseBattery && <BatterySettingsListItem />}
             </HideOnReview>
-            {isMultisig && !isTestnet && <MultisigOrdersMenuItem />}
-            {showMultisigs && !isTestnet && (
-                <NavLink to={AppRoute.multisigWallets}>
-                    {({ isActive }) => (
-                        <AsideMenuItemStyled isSelected={isActive}>
-                            <ListIcon />
-                            <Label2>{t('wallet_aside_multisig_wallets')}</Label2>
-                        </AsideMenuItemStyled>
-                    )}
-                </NavLink>
-            )}
-            <HideOnReview>{canUseBattery && <BatterySettingsListItem />}</HideOnReview>
             <NavLink to={AppRoute.walletSettings} end>
                 {({ isActive }) => (
                     <AsideMenuItemStyled isSelected={isActive}>
diff --git a/packages/uikit/src/components/desktop/header/DesktopWalletHeader.tsx b/packages/uikit/src/components/desktop/header/DesktopWalletHeader.tsx
index 1c0804589..58ae7a474 100644
--- a/packages/uikit/src/components/desktop/header/DesktopWalletHeader.tsx
+++ b/packages/uikit/src/components/desktop/header/DesktopWalletHeader.tsx
@@ -73,14 +73,16 @@ const DesktopWalletHeaderPayload = () => {
                             {t('wallet_send')}
                         </ButtonStyled>
                     )}
-                    {!isReadOnly && isStandardTonWallet(activeWallet) && (
-                        <LinkStyled to={AppProRoute.multiSend}>
-                            <ButtonStyled size="small">
-                                <ArrowUpIcon />
-                                {t('wallet_multi_send')}
-                            </ButtonStyled>
-                        </LinkStyled>
-                    )}
+                    <HideOnReview>
+                        {!isReadOnly && isStandardTonWallet(activeWallet) && (
+                            <LinkStyled to={AppProRoute.multiSend}>
+                                <ButtonStyled size="small">
+                                    <ArrowUpIcon />
+                                    {t('wallet_multi_send')}
+                                </ButtonStyled>
+                            </LinkStyled>
+                        )}
+                    </HideOnReview>
                     <ButtonStyled
                         size="small"
                         onClick={() => {
diff --git a/packages/uikit/src/components/nft/NftAction.tsx b/packages/uikit/src/components/nft/NftAction.tsx
index 99a34ce3d..973aca052 100644
--- a/packages/uikit/src/components/nft/NftAction.tsx
+++ b/packages/uikit/src/components/nft/NftAction.tsx
@@ -10,6 +10,7 @@ import { Body2 } from '../Text';
 import { Button } from '../fields/Button';
 import { LinkNft } from './LinkNft';
 import { RenewNft } from './RenewNft';
+import { HideOnReview } from '../ios/HideOnReview';
 
 const getMarketplaceUrl = (nftItem: NftItem) => {
     const { marketplace } = nftItem.metadata;
@@ -29,18 +30,20 @@ const ViewOnMarketButton: FC<{ url: string }> = ({ url }) => {
     const sdk = useAppSdk();
 
     return (
-        <Button
-            size="large"
-            secondary
-            fullWidth
-            onClick={e => {
-                e.preventDefault();
-                e.stopPropagation();
-                sdk.openPage(url);
-            }}
-        >
-            {t('nft_open_in_marketplace')}
-        </Button>
+        <HideOnReview>
+            <Button
+                size="large"
+                secondary
+                fullWidth
+                onClick={e => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    sdk.openPage(url);
+                }}
+            >
+                {t('nft_open_in_marketplace')}
+            </Button>
+        </HideOnReview>
     );
 };
 const ActionTransfer: FC<{
diff --git a/packages/uikit/src/desktop-pages/nft/DesktopCollectables.tsx b/packages/uikit/src/desktop-pages/nft/DesktopCollectables.tsx
index 46e0f97bb..8b7ef4e94 100644
--- a/packages/uikit/src/desktop-pages/nft/DesktopCollectables.tsx
+++ b/packages/uikit/src/desktop-pages/nft/DesktopCollectables.tsx
@@ -15,7 +15,6 @@ import { useMemo } from 'react';
 import { SlidersIcon } from '../../components/Icon';
 import { IconButtonTransparentBackground } from '../../components/fields/IconButton';
 import { useWalletFilteredNftList } from '../../state/nft';
-import { HideOnReview } from '../../components/ios/HideOnReview';
 
 const gap = '10px';
 const maxColumnsNumber = 4;
@@ -72,11 +71,7 @@ const SettingsButtonStyled = styled(IconButtonTransparentBackground)`
 `;
 
 export const DesktopCollectables = () => {
-    return (
-        <HideOnReview>
-            <DesktopCollectablesContent />
-        </HideOnReview>
-    );
+    return <DesktopCollectablesContent />;
 };
 
 export const DesktopCollectablesContent = () => {