fixup! feat(suite-native): Add coin behind feature flag

trezor · Feb 26, 2024 · d7ea06e · d7ea06e
1 parent 1b1854c
commit d7ea06e
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 30 deletions.
diff --git a/suite-native/accounts/src/components/AddAccountsButton.tsx b/suite-native/accounts/src/components/AddAccountsButton.tsx
@@ -10,24 +10,37 @@ import {
     StackNavigationProps,
 } from '@suite-native/navigation';
 import { IconButton } from '@suite-native/atoms';
-import { selectIsPortfolioTrackerDevice } from '@suite-common/wallet-core';
-import { FeatureFlag, useFeatureFlag } from '@suite-native/feature-flags';
+import {
+    selectAreAllDevicesDisconnectedOrAccountless,
+    selectDeviceDiscovery,
+    selectIsPortfolioTrackerDevice,
+} from '@suite-common/wallet-core';
+
+import { useIsAddCoinAccountEnabled } from '../useIsAddCoinAccountEnabled';
 
 export const AddAccountButton = () => {
-    const isSelectedDevicePortfolioTracker = useSelector(selectIsPortfolioTrackerDevice);
-    const [isAddCoinAccountEnabled] = useFeatureFlag(FeatureFlag.IsAddCoinAccountEnabled);
-    const [isDeviceConnectEnabled] = useFeatureFlag(FeatureFlag.IsDeviceConnectEnabled);
     const navigation =
         useNavigation<StackNavigationProps<RootStackParamList, RootStackRoutes.AccountsImport>>();
 
+    const isSelectedDevicePortfolioTracker = useSelector(selectIsPortfolioTrackerDevice);
+    const discovery = useSelector(selectDeviceDiscovery);
+    const areAllDevicesDisconnectedOrAccountless = useSelector(
+        selectAreAllDevicesDisconnectedOrAccountless,
+    );
+    const { isAddCoinAccountEnabled } = useIsAddCoinAccountEnabled();
+
+    const shouldShowAddAccountButton =
+        isSelectedDevicePortfolioTracker ||
+        (isAddCoinAccountEnabled && !areAllDevicesDisconnectedOrAccountless && !discovery);
+
     const navigateToImportScreen = () => {
         navigation.navigate(RootStackRoutes.AccountsImport, {
             screen: AccountsImportStackRoutes.SelectNetwork,
         });
     };
 
     const navigateToAddCoinAccount = () => {
-        if (isDeviceConnectEnabled && isAddCoinAccountEnabled) {
+        if (isAddCoinAccountEnabled) {
             navigation.navigate(RootStackRoutes.AddCoinAccountStack, {
                 screen: AddCoinAccountStackRoutes.AddCoinAccount,
                 params: {
@@ -37,7 +50,7 @@ export const AddAccountButton = () => {
         }
     };
 
-    return (
+    return shouldShowAddAccountButton ? (
         <IconButton
             iconName="plus"
             onPress={
@@ -46,5 +59,5 @@ export const AddAccountButton = () => {
             colorScheme="tertiaryElevation0"
             size="medium"
         />
-    );
+    ) : null;
 };
diff --git a/suite-native/accounts/src/components/SearchableAccountsListScreenHeader.tsx b/suite-native/accounts/src/components/SearchableAccountsListScreenHeader.tsx
@@ -6,17 +6,10 @@ import Animated, {
     withDelay,
     withTiming,
 } from 'react-native-reanimated';
-import { useSelector } from 'react-redux';
 
 import { ScreenSubHeader } from '@suite-native/navigation';
 import { Box, IconButton } from '@suite-native/atoms';
 import { prepareNativeStyle, useNativeStyles } from '@trezor/styles';
-import {
-    selectAreAllDevicesDisconnectedOrAccountless,
-    selectDeviceDiscovery,
-    selectIsPortfolioTrackerDevice,
-} from '@suite-common/wallet-core';
-import { FeatureFlag, useFeatureFlag } from '@suite-native/feature-flags';
 
 import { AccountsSearchForm, SEARCH_INPUT_ANIMATION_DURATION } from './AccountsSearchForm';
 import { AddAccountButton } from './AddAccountsButton';
@@ -41,13 +34,6 @@ export const SearchableAccountsListScreenHeader = ({
     const isFirstRender = useSharedValue(true);
     const { applyStyle } = useNativeStyles();
 
-    const discovery = useSelector(selectDeviceDiscovery);
-    const areAllDevicesDisconnectedOrAccountless = useSelector(
-        selectAreAllDevicesDisconnectedOrAccountless,
-    );
-    const isSelectedDevicePortfolioTracker = useSelector(selectIsPortfolioTrackerDevice);
-    const [isAddCoinAccountEnabled] = useFeatureFlag(FeatureFlag.IsAddCoinAccountEnabled);
-    const [isDeviceConnectEnabled] = useFeatureFlag(FeatureFlag.IsDeviceConnectEnabled);
     const [isSearchActive, setIsSearchActive] = useState(false);
 
     const handleHideFilter = () => {
@@ -77,13 +63,6 @@ export const SearchableAccountsListScreenHeader = ({
         };
     };
 
-    const shouldShowAddAccountButton =
-        isSelectedDevicePortfolioTracker ||
-        (isAddCoinAccountEnabled &&
-            isDeviceConnectEnabled &&
-            !areAllDevicesDisconnectedOrAccountless &&
-            !discovery);
-
     return (
         <Box style={applyStyle(searchFormContainerStyle)}>
             {isSearchActive ? (
@@ -98,7 +77,7 @@ export const SearchableAccountsListScreenHeader = ({
                 >
                     <ScreenSubHeader
                         content={title}
-                        rightIcon={shouldShowAddAccountButton && <AddAccountButton />}
+                        rightIcon={<AddAccountButton />}
                         leftIcon={
                             <IconButton
                                 iconName="search"

diff --git a/suite-native/accounts/src/index.ts b/suite-native/accounts/src/index.ts
@@ -8,3 +8,4 @@ export * from './useAccountLabelForm';
 export * from './selectors';
 export * from './transactionCacheMiddleware';
 export * from './useTransactionCache';
+export * from './useIsAddCoinAccountEnabled';
diff --git a/suite-native/accounts/src/useIsAddCoinAccountEnabled.ts b/suite-native/accounts/src/useIsAddCoinAccountEnabled.ts
@@ -0,0 +1,8 @@
+import { FeatureFlag, useFeatureFlag } from '@suite-native/feature-flags';
+
+export const useIsAddCoinAccountEnabled = () => {
+    const [isAddCoinAccountEnabled] = useFeatureFlag(FeatureFlag.IsAddCoinAccountEnabled);
+    const [isDeviceConnectEnabled] = useFeatureFlag(FeatureFlag.IsDeviceConnectEnabled);
+
+    return { isAddCoinAccountEnabled: isDeviceConnectEnabled && isAddCoinAccountEnabled };
+};