Removed Onyx.connect in CardUtils lib file (part 1)

package.json

@@ -46,7 +46,7 @@
     "test:debug": "TZ=utc NODE_OPTIONS='--inspect-brk --experimental-vm-modules' jest --runInBand",
     "perf-test": "NODE_OPTIONS=--experimental-vm-modules npx reassure",
     "typecheck": "NODE_OPTIONS=--max_old_space_size=8192 tsc",
-    "lint": "NODE_OPTIONS=--max_old_space_size=8192 eslint . --max-warnings=314 --cache --cache-location=node_modules/.cache/eslint",
+    "lint": "NODE_OPTIONS=--max_old_space_size=8192 eslint . --max-warnings=313 --cache --cache-location=node_modules/.cache/eslint",
     "lint-changed": "NODE_OPTIONS=--max_old_space_size=8192 ./scripts/lintChanged.sh",
     "lint-watch": "npx eslint-watch --watch --changed",
     "shellcheck": "./scripts/shellCheck.sh",

src/libs/CardUtils.ts

@@ -22,7 +22,7 @@
 import StringUtils from './StringUtils';
 
 let allCards: OnyxValues[typeof ONYXKEYS.CARD_LIST] = {};
 Onyx.connect({
     key: ONYXKEYS.CARD_LIST,
     callback: (val) => {
         if (!val || Object.keys(val).length === 0) {
@@ -34,7 +34,7 @@
 });
 
 let allWorkspaceCards: OnyxCollection<WorkspaceCardsList> = {};
 Onyx.connect({
     key: ONYXKEYS.COLLECTION.WORKSPACE_CARDS_LIST,
     waitForCollectionCallback: true,
     callback: (value) => {
@@ -42,14 +42,6 @@
     },
 });
 
-let customCardNames: OnyxEntry<Record<string, string>> = {};
-Onyx.connect({
-    key: ONYXKEYS.NVP_EXPENSIFY_COMPANY_CARDS_CUSTOM_NAMES,
-    callback: (value) => {
-        customCardNames = value;
-    },
-});
-
 /**
  * @returns string with a month in MM format
  */
@@ -691,10 +683,6 @@
     return Number.isNaN(fundID) ? CONST.DEFAULT_NUMBER_ID : fundID;
 }
 
-function getCustomCardName(cardID: string) {
-    return customCardNames?.[cardID];
-}
-
 export {
     isExpensifyCard,
     getDomainCards,
@@ -745,5 +733,4 @@
     getPlaidInstitutionIconUrl,
     getPlaidInstitutionId,
     getCorrectStepForPlaidSelectedBank,
-    getCustomCardName,
 };

src/pages/workspace/companyCards/WorkspaceCompanyCardEditCardNamePage.tsx

@@ -12,7 +12,7 @@ import useLocalize from '@hooks/useLocalize';
 import useOnyx from '@hooks/useOnyx';
 import useThemeStyles from '@hooks/useThemeStyles';
 import useWorkspaceAccountID from '@hooks/useWorkspaceAccountID';
-import {getCompanyFeeds, getCustomCardName, getDomainOrWorkspaceAccountID} from '@libs/CardUtils';
+import {getCompanyFeeds, getDomainOrWorkspaceAccountID} from '@libs/CardUtils';
 import {addErrorMessage} from '@libs/ErrorUtils';
 import type {PlatformStackScreenProps} from '@libs/Navigation/PlatformStackNavigation/types';
 import {getFieldRequiredErrors} from '@libs/ValidationUtils';
@@ -26,15 +26,16 @@ import ROUTES from '@src/ROUTES';
 import type SCREENS from '@src/SCREENS';
 import INPUT_IDS from '@src/types/form/EditExpensifyCardNameForm';
 import type {CompanyCardFeed} from '@src/types/onyx';
+import isLoadingOnyxValue from '@src/types/utils/isLoadingOnyxValue';
 
 type WorkspaceCompanyCardEditCardNamePageProps = PlatformStackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.COMPANY_CARD_NAME>;
 
 function WorkspaceCompanyCardEditCardNamePage({route}: WorkspaceCompanyCardEditCardNamePageProps) {
     const {policyID, cardID} = route.params;
     const workspaceAccountID = useWorkspaceAccountID(policyID);
     const bank = decodeURIComponent(route.params.bank);
-    const [customCardNames] = useOnyx(ONYXKEYS.NVP_EXPENSIFY_COMPANY_CARDS_CUSTOM_NAMES, {canBeMissing: true});
-    const defaultValue = customCardNames?.[cardID] ?? getCustomCardName(cardID);
+    const [customCardNames, customCardNamesMetadata] = useOnyx(ONYXKEYS.NVP_EXPENSIFY_COMPANY_CARDS_CUSTOM_NAMES, {canBeMissing: true});
+    const defaultValue = customCardNames?.[cardID];
 
     const {translate} = useLocalize();
     const {inputCallbackRef} = useAutoFocusInput();
@@ -65,6 +66,10 @@ function WorkspaceCompanyCardEditCardNamePage({route}: WorkspaceCompanyCardEditC
         return errors;
     };
 
+    if (isLoadingOnyxValue(customCardNamesMetadata)) {
+        return null;
+    }
+
     return (
         <AccessOrNotFoundWrapper
             policyID={policyID}