Merge pull request #50 from software-mansion-labs/ideal-nav/rbr-gbr-f…

…ixes Ideal nav/rbr gbr fixes
allroundexperts · Jan 30, 2024 · 71f9b47 · 71f9b47
2 parents 0010e02 + 383d224
commit 71f9b47
Show file tree

Hide file tree

Showing 10 changed files with 242 additions and 146 deletions.
diff --git a/src/CONST.ts b/src/CONST.ts
@@ -1328,6 +1328,7 @@ const CONST = {
             REIMBURSEMENT_MANUAL: 'reimburseManual',
         },
         ID_FAKE: '_FAKE_',
+        EMPTY: 'EMPTY',
     },
 
     CUSTOM_UNITS: {

diff --git a/src/components/Indicator.tsx b/src/components/Indicator.tsx
@@ -1,25 +1,17 @@
 import React from 'react';
 import {StyleSheet, View} from 'react-native';
-import type {OnyxCollection} from 'react-native-onyx';
 import {withOnyx} from 'react-native-onyx';
 import type {OnyxEntry} from 'react-native-onyx/lib/types';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
-import * as PolicyUtils from '@libs/PolicyUtils';
 import * as UserUtils from '@libs/UserUtils';
 import * as PaymentMethods from '@userActions/PaymentMethods';
 import ONYXKEYS from '@src/ONYXKEYS';
-import type {BankAccountList, FundList, LoginList, Policy, PolicyMembers, ReimbursementAccount, UserWallet, WalletTerms} from '@src/types/onyx';
+import type {BankAccountList, FundList, LoginList, UserWallet, WalletTerms} from '@src/types/onyx';
 
 type CheckingMethod = () => boolean;
 
 type IndicatorOnyxProps = {
-    /** The employee list of all policies (coming from Onyx) */
-    allPolicyMembers: OnyxCollection<PolicyMembers>;
-
-    /** All the user's policies (from Onyx via withFullPolicy) */
-    policies: OnyxCollection<Policy>;
-
     /** List of bank accounts */
     bankAccountList: OnyxEntry<BankAccountList>;
 
@@ -29,9 +21,6 @@ type IndicatorOnyxProps = {
     /** The user's wallet (coming from Onyx) */
     userWallet: OnyxEntry<UserWallet>;
 
-    /** Bank account attached to free plan */
-    reimbursementAccount: OnyxEntry<ReimbursementAccount>;
-
     /** Information about the user accepting the terms for payments */
     walletTerms: OnyxEntry<WalletTerms>;
 
@@ -41,25 +30,16 @@ type IndicatorOnyxProps = {
 
 type IndicatorProps = IndicatorOnyxProps;
 
-function Indicator({reimbursementAccount, allPolicyMembers, policies, bankAccountList, fundList, userWallet, walletTerms, loginList}: IndicatorOnyxProps) {
+function Indicator({bankAccountList, fundList, userWallet, walletTerms, loginList}: IndicatorOnyxProps) {
     const theme = useTheme();
     const styles = useThemeStyles();
 
-    // If a policy was just deleted from Onyx, then Onyx will pass a null value to the props, and
-    // those should be cleaned out before doing any error checking
-    const cleanPolicies = Object.fromEntries(Object.entries(policies ?? {}).filter(([, policy]) => !!policy));
-    const cleanAllPolicyMembers = Object.fromEntries(Object.entries(allPolicyMembers ?? {}).filter(([, policyMembers]) => !!policyMembers));
-
     // All of the error & info-checking methods are put into an array. This is so that using _.some() will return
     // early as soon as the first error / info condition is returned. This makes the checks very efficient since
     // we only care if a single error / info condition exists anywhere.
     const errorCheckingMethods: CheckingMethod[] = [
         () => Object.keys(userWallet?.errors ?? {}).length > 0,
         () => PaymentMethods.hasPaymentMethodError(bankAccountList, fundList),
-        () => Object.values(cleanPolicies).some(PolicyUtils.hasPolicyError),
-        () => Object.values(cleanPolicies).some(PolicyUtils.hasCustomUnitsError),
-        () => Object.values(cleanAllPolicyMembers).some(PolicyUtils.hasPolicyMemberError),
-        () => Object.keys(reimbursementAccount?.errors ?? {}).length > 0,
         () => !!loginList && UserUtils.hasLoginListError(loginList),
 
         // Wallet term errors that are not caused by an IOU (we show the red brick indicator for those in the LHN instead)
@@ -78,18 +58,9 @@ function Indicator({reimbursementAccount, allPolicyMembers, policies, bankAccoun
 Indicator.displayName = 'Indicator';
 
 export default withOnyx<IndicatorProps, IndicatorOnyxProps>({
-    allPolicyMembers: {
-        key: ONYXKEYS.COLLECTION.POLICY_MEMBERS,
-    },
-    policies: {
-        key: ONYXKEYS.COLLECTION.POLICY,
-    },
     bankAccountList: {
         key: ONYXKEYS.BANK_ACCOUNT_LIST,
     },
-    reimbursementAccount: {
-        key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
-    },
     fundList: {
         key: ONYXKEYS.FUND_LIST,
     },

diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx
@@ -573,7 +573,7 @@ function MenuItem(
                                     </View>
                                 )}
                                 {!!brickRoadIndicator && (
-                                    <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.ml1]}>
+                                    <View style={[styles.alignItemsCenter, styles.justifyContentCenter, styles.ml1, styles.mr2]}>
                                         <Icon
                                             src={Expensicons.DotIndicator}
                                             fill={brickRoadIndicator === 'error' ? theme.danger : theme.success}

diff --git a/src/libs/BrickRoadsUtils.ts b/src/libs/BrickRoadsUtils.ts
diff --git a/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx b/src/libs/Navigation/AppNavigator/createCustomBottomTabNavigator/BottomTabBar.tsx
@@ -14,6 +14,7 @@ import interceptAnonymousUser from '@libs/interceptAnonymousUser';
 import getTopmostBottomTabRoute from '@libs/Navigation/getTopmostBottomTabRoute';
 import Navigation from '@libs/Navigation/Navigation';
 import type {RootStackParamList} from '@libs/Navigation/types';
+import {checkIfWorkspaceSettingsTabHasRBR, getChatTabBrickRoad} from '@libs/WorkspacesUtils';
 import BottomTabBarFloatingActionButton from '@pages/home/sidebar/BottomTabBarFloatingActionButton';
 import variables from '@styles/variables';
 import CONST from '@src/CONST';
@@ -33,6 +34,10 @@ function BottomTabBar() {
         return topmostBottomTabRoute?.name ?? SCREENS.HOME;
     });
 
+    const showWorkspaceRedBrickRoad = checkIfWorkspaceSettingsTabHasRBR(activeWorkspaceID) && currentTabName === SCREENS.HOME;
+
+    const chatTabBrickRoad = currentTabName !== SCREENS.HOME ? getChatTabBrickRoad(activeWorkspaceID) : undefined;
+
     return (
         <View style={styles.bottomTabBarContainer}>
             <Tooltip text={translate('common.chats')}>
@@ -45,12 +50,17 @@ function BottomTabBar() {
                     wrapperStyle={styles.flexGrow1}
                     style={styles.bottomTabBarItem}
                 >
-                    <Icon
-                        src={Expensicons.ChatBubble}
-                        fill={currentTabName === SCREENS.HOME ? theme.iconMenu : theme.icon}
-                        width={variables.iconBottomBar}
-                        height={variables.iconBottomBar}
-                    />
+                    <View>
+                        <Icon
+                            src={Expensicons.ChatBubble}
+                            fill={currentTabName === SCREENS.HOME ? theme.iconMenu : theme.icon}
+                            width={variables.iconBottomBar}
+                            height={variables.iconBottomBar}
+                        />
+                        {chatTabBrickRoad && (
+                            <View style={styles.bottomTabStatusIndicator(chatTabBrickRoad === CONST.BRICK_ROAD_INDICATOR_STATUS.INFO ? theme.iconSuccessFill : theme.danger)} />
+                        )}
+                    </View>
                 </PressableWithFeedback>
             </Tooltip>
             <BottomTabBarFloatingActionButton />
@@ -66,12 +76,15 @@ function BottomTabBar() {
                     wrapperStyle={styles.flexGrow1}
                     style={styles.bottomTabBarItem}
                 >
-                    <Icon
-                        src={Expensicons.Wrench}
-                        fill={currentTabName === SCREENS.ALL_SETTINGS || currentTabName === SCREENS.WORKSPACE.INITIAL ? theme.iconMenu : theme.icon}
-                        width={variables.iconBottomBar}
-                        height={variables.iconBottomBar}
-                    />
+                    <View>
+                        <Icon
+                            src={Expensicons.Wrench}
+                            fill={currentTabName === SCREENS.ALL_SETTINGS || currentTabName === SCREENS.WORKSPACE.INITIAL ? theme.iconMenu : theme.icon}
+                            width={variables.iconBottomBar}
+                            height={variables.iconBottomBar}
+                        />
+                        {showWorkspaceRedBrickRoad && <View style={styles.bottomTabStatusIndicator(theme.danger)} />}
+                    </View>
                 </PressableWithFeedback>
             </Tooltip>
             <PurposeForUsingExpensifyModal />