[release-4.7] Bug 2060451: Fix a crash when the preferred namespace contains just numbers

frontend/packages/console-app/src/components/detect-namespace/namespace.ts

@@ -3,40 +3,25 @@ import * as React from 'react';
 // @ts-ignore: FIXME missing exports due to out-of-sync @types/react-redux version
 import { useDispatch } from 'react-redux';
 import { useLocation } from 'react-router-dom';
-import { getNamespace } from '@console/internal/components/utils/link';
-import { useUserSettingsCompatibility } from '@console/shared/src/hooks/useUserSettingsCompatibility';
 import { setActiveNamespace } from '@console/internal/actions/ui';
-import {
-  ALL_NAMESPACES_KEY,
-  USERSETTINGS_PREFIX,
-  NAMESPACE_USERSETTINGS_PREFIX,
-  NAMESPACE_LOCAL_STORAGE_KEY,
-} from '@console/shared/src/constants';
+import { getNamespace } from '@console/internal/components/utils/link';
+import { usePreferredNamespace } from '../user-preferences/namespace/usePreferredNamespace';
+import { useLastNamespace } from './useLastNamespace';
+import { ALL_NAMESPACES_KEY } from '@console/shared/src/constants';
 
 type NamespaceContextType = {
   namespace?: string;
   setNamespace?: (ns: string) => void;
 };
 
-const FAVORITE_NAMESPACE_NAME_USERSETTINGS_KEY = `${NAMESPACE_USERSETTINGS_PREFIX}.favorite`;
-const FAVORITE_NAMESPACE_NAME_LOCAL_STORAGE_KEY = NAMESPACE_LOCAL_STORAGE_KEY;
-
-const LAST_NAMESPACE_NAME_USER_SETTINGS_KEY = `${USERSETTINGS_PREFIX}.lastNamespace`;
-const LAST_NAMESPACE_NAME_LOCAL_STORAGE_KEY = `bridge/last-namespace-name`;
-
 export const NamespaceContext = React.createContext<NamespaceContextType>({});
 
 export const useValuesForNamespaceContext = () => {
   const { pathname } = useLocation();
   const urlNamespace = getNamespace(pathname);
 
-  const [favoritedNamespace, , favoriteLoaded] = useUserSettingsCompatibility<string>(
-    FAVORITE_NAMESPACE_NAME_USERSETTINGS_KEY,
-    FAVORITE_NAMESPACE_NAME_LOCAL_STORAGE_KEY,
-  );
-  const [lastNamespace, setLastNamespace, lastNamespaceLoaded] = useUserSettingsCompatibility<
-    string
-  >(LAST_NAMESPACE_NAME_USER_SETTINGS_KEY, LAST_NAMESPACE_NAME_LOCAL_STORAGE_KEY);
+  const [favoritedNamespace, , favoriteLoaded] = usePreferredNamespace();
+  const [lastNamespace, setLastNamespace, lastNamespaceLoaded] = useLastNamespace();
 
   const dispatch = useDispatch();
   const setNamespace = React.useCallback(

frontend/packages/console-app/src/components/detect-namespace/useLastNamespace.ts

@@ -0,0 +1,21 @@
+import {
+  LAST_NAMESPACE_NAME_USER_SETTINGS_KEY,
+  LAST_NAMESPACE_NAME_LOCAL_STORAGE_KEY,
+} from '@console/shared/src/constants';
+import { useUserSettingsCompatibility } from '@console/shared/src/hooks/useUserSettingsCompatibility';
+
+export const useLastNamespace = (): [
+  string,
+  React.Dispatch<React.SetStateAction<string>>,
+  boolean,
+] => {
+  const [lastNamespace, setLastNamespace, lastNamespaceLoaded] = useUserSettingsCompatibility<
+    string
+  >(LAST_NAMESPACE_NAME_USER_SETTINGS_KEY, LAST_NAMESPACE_NAME_LOCAL_STORAGE_KEY);
+
+  // This toString is workaround because the useUserSettings hook returns a number or boolean
+  // when the saved value represents a number (1234) or boolean (true/false).
+  // This is a workaround for https://bugzilla.redhat.com/show_bug.cgi?id=2009345.
+  // We will implement a more generic fix with https://issues.redhat.com/browse/ODC-6514
+  return [lastNamespace?.toString(), setLastNamespace, lastNamespaceLoaded];
+};

frontend/packages/console-app/src/components/user-preferences/namespace/usePreferredNamespace.ts

@@ -0,0 +1,22 @@
+import { Dispatch, SetStateAction } from 'react';
+import { useUserSettingsCompatibility } from '@console/shared';
+
+const PREFERRED_NAMESPACE_USER_SETTING_KEY: string = 'console.namespace.favorite';
+const PREFERRED_NAMESPACE_NAME_LOCAL_STORAGE_KEY = 'dropdown-storage-namespaces';
+
+export const usePreferredNamespace = (): [string, Dispatch<SetStateAction<string>>, boolean] => {
+  const [
+    preferredNamespace,
+    setPreferredNamespace,
+    preferredNamespaceLoaded,
+  ] = useUserSettingsCompatibility<string>(
+    PREFERRED_NAMESPACE_USER_SETTING_KEY,
+    PREFERRED_NAMESPACE_NAME_LOCAL_STORAGE_KEY,
+  );
+
+  // This toString is workaround because the useUserSettings hook returns a number or boolean
+  // when the saved value represents a number (1234) or boolean (true/false).
+  // This is a workaround for https://bugzilla.redhat.com/show_bug.cgi?id=2009345.
+  // We will implement a more generic fix with https://issues.redhat.com/browse/ODC-6514
+  return [preferredNamespace?.toString(), setPreferredNamespace, preferredNamespaceLoaded];
+};

frontend/packages/console-shared/src/constants/common.ts

@@ -37,6 +37,7 @@ export const NAMESPACE_USERSETTINGS_PREFIX = `${USERSETTINGS_PREFIX}.namespace`;
 export const NAMESPACE_LOCAL_STORAGE_KEY = 'dropdown-storage-namespaces';
 export const APPLICATION_USERSETTINGS_PREFIX = `${USERSETTINGS_PREFIX}.applications`;
 export const APPLICATION_LOCAL_STORAGE_KEY = 'dropdown-storage-applications';
+export const LAST_NAMESPACE_NAME_USER_SETTINGS_KEY = `${USERSETTINGS_PREFIX}.lastNamespace`;
 export const LAST_NAMESPACE_NAME_LOCAL_STORAGE_KEY = `${STORAGE_PREFIX}/last-namespace-name`;
 export const API_DISCOVERY_RESOURCES_LOCAL_STORAGE_KEY = `${STORAGE_PREFIX}/api-discovery-resources`;
 export const COMMUNITY_PROVIDERS_WARNING_LOCAL_STORAGE_KEY = `${STORAGE_PREFIX}/community-providers-warning`;