diff --git a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironment.tsx b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironment.tsx index 31015ad43b..62d5287d56 100644 --- a/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironment.tsx +++ b/frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/FeatureOverviewEnvironment.tsx @@ -134,13 +134,7 @@ const FeatureOverviewEnvironment = ({ return ( ; + hiddenEnvironments?: Array; } export const useGlobalLocalStorage = () => { @@ -11,8 +11,14 @@ export const useGlobalLocalStorage = () => { {}, ); + // fix incorrect values introduced by a bug + const parsedValue = { + ...value, + hiddenEnvironments: Array.from(value.hiddenEnvironments || []), + }; + return { - value, + value: parsedValue, setValue, }; }; diff --git a/frontend/src/hooks/useHiddenEnvironments.ts b/frontend/src/hooks/useHiddenEnvironments.ts index b9929e75f1..64318b9f85 100644 --- a/frontend/src/hooks/useHiddenEnvironments.ts +++ b/frontend/src/hooks/useHiddenEnvironments.ts @@ -9,21 +9,12 @@ export const useHiddenEnvironments = () => { useGlobalLocalStorage(); const [hiddenEnvironments, setStoredHiddenEnvironments] = useState< Set - >( - new Set( - Array.isArray(globalStore.hiddenEnvironments) - ? globalStore.hiddenEnvironments - : [], - ), - ); + >(new Set(globalStore.hiddenEnvironments)); const setHiddenEnvironments = (environment: string) => { - // @ts-expect-error setGlobalStore((params) => { const hiddenEnvironments = new Set( - Array.isArray(globalStore.hiddenEnvironments) - ? globalStore.hiddenEnvironments - : [], + Array.from(params.hiddenEnvironments || []), ); if (hiddenEnvironments.has(environment)) { hiddenEnvironments.delete(environment); diff --git a/frontend/src/utils/storage.test.ts b/frontend/src/utils/storage.test.ts index 5d98caccf9..c8aa3f510e 100644 --- a/frontend/src/utils/storage.test.ts +++ b/frontend/src/utils/storage.test.ts @@ -117,4 +117,12 @@ describe('localStorage with TTL', () => { ); expect(retrievedObject).toBeUndefined(); }); + + test('should handle set with any level of nesting', () => { + setLocalStorageItem( + 'testKey', + new Set([{ nestedSet: new Set([1, 2]) }]), + ); + expect(getLocalStorageItem('testKey')).toEqual([{ nestedSet: [1, 2] }]); + }); }); diff --git a/frontend/src/utils/storage.ts b/frontend/src/utils/storage.ts index 113f3a65f5..e54a75568d 100644 --- a/frontend/src/utils/storage.ts +++ b/frontend/src/utils/storage.ts @@ -39,7 +39,12 @@ export function setLocalStorageItem( ? new Date().getTime() + timeToLive : null, }; - window.localStorage.setItem(key, JSON.stringify(item)); + window.localStorage.setItem( + key, + JSON.stringify(item, (_key, value) => + value instanceof Set ? [...value] : value, + ), + ); } catch (err: unknown) { console.warn(err); } @@ -59,7 +64,12 @@ export function setSessionStorageItem( ? new Date().getTime() + timeToLive : null, }; - window.sessionStorage.setItem(key, JSON.stringify(item)); + window.sessionStorage.setItem( + key, + JSON.stringify(item, (_key, value) => + value instanceof Set ? [...value] : value, + ), + ); } catch (err: unknown) { console.warn(err); }