fix: Fix issue with showing invalid active tenant loaded from localSt…

…orage that was assigned in other user session
apptension · Apr 11, 2024 · 87aa6de · 87aa6de
1 parent 88ef08c
commit 87aa6de
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 9 deletions.
diff --git a/...bs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.component.tsx b/...bs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.component.tsx
@@ -1,12 +1,14 @@
+import { CurrentUserType } from '@sb/webapp-api-client';
 import { TenantType } from '@sb/webapp-api-client/constants';
+import { useCommonQuery } from '@sb/webapp-api-client/providers';
 import { prop } from 'ramda';
 import { useEffect, useMemo, useSyncExternalStore } from 'react';
 import { useParams } from 'react-router-dom';
 
 import { useTenants } from '../../hooks/useTenants/useTenants.hook';
 import currentTenantContext from './currentTenantProvider.context';
 import { setCurrentTenantStorageState, store } from './currentTenantProvider.storage';
-import { CurrentTenantProviderProps } from './currentTenantProvider.types';
+import { CurrentTenantProviderProps, CurrentTenantStorageState } from './currentTenantProvider.types';
 
 export type TenantPathParams = {
   tenantId: string;
@@ -22,9 +24,20 @@ export type TenantPathParams = {
 export const CurrentTenantProvider = ({ children }: CurrentTenantProviderProps) => {
   const params = useParams<TenantPathParams>();
   let { tenantId } = params;
+  const { data } = useCommonQuery();
+  const userId = (data?.currentUser as CurrentUserType)?.id;
 
   const tenants = useTenants();
-  const storedTenantId = useSyncExternalStore(store.subscribe, store.getSnapshot);
+  // const storedTenantId = useSyncExternalStore(store.subscribe, store.getSnapshot);
+  const storedState = useSyncExternalStore(store.subscribe, store.getSnapshot);
+  let storedTenantId, parsedStoredState: CurrentTenantStorageState;
+  try {
+    parsedStoredState = JSON.parse(storedState);
+    storedTenantId = parsedStoredState?.[userId] ?? null;
+  } catch (e) {
+    parsedStoredState = {};
+    storedTenantId = null;
+  }
 
   if (
     !tenantId &&
@@ -37,7 +50,7 @@ export const CurrentTenantProvider = ({ children }: CurrentTenantProviderProps)
     tenantId = storedTenantId;
   }
 
-  let currentTenant = tenants.find((t) => t?.id === tenantId);
+  let currentTenant = tenants.filter((t) => t?.membership.invitationAccepted).find((t) => t?.id === tenantId);
   if (!currentTenant) {
     // select first default
     currentTenant = tenants.find((t) => t?.type === TenantType.PERSONAL);
@@ -49,7 +62,8 @@ export const CurrentTenantProvider = ({ children }: CurrentTenantProviderProps)
 
   useEffect(() => {
     if (currentTenant) {
-      setCurrentTenantStorageState(currentTenant.id);
+      parsedStoredState[userId] = currentTenant.id;
+      setCurrentTenantStorageState(parsedStoredState);
     }
   }, [currentTenant?.id]);
 

diff --git a/...-libs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.storage.ts b/...-libs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.storage.ts
@@ -1,20 +1,21 @@
 import { reportError } from '@sb/webapp-core/utils/reportError';
 
-import { CURRENT_TENANT_STORAGE_KEY } from './currentTenantProvider.types';
+import { CURRENT_TENANT_STORAGE_KEY, CurrentTenantStorageState } from './currentTenantProvider.types';
 
-export const setCurrentTenantStorageState = (tenantId: string) => {
+export const setCurrentTenantStorageState = (storageState: CurrentTenantStorageState) => {
   try {
-    localStorage.setItem(CURRENT_TENANT_STORAGE_KEY, tenantId);
+    const newValue = JSON.stringify(storageState);
+    localStorage.setItem(CURRENT_TENANT_STORAGE_KEY, newValue);
     // On localStorage.setItem, the storage event is only triggered on other tabs and windows.
     // So we manually dispatch a storage event to trigger the subscribe function on the current window as well.
-    window.dispatchEvent(new StorageEvent('storage', { key: CURRENT_TENANT_STORAGE_KEY, newValue: tenantId }));
+    window.dispatchEvent(new StorageEvent('storage', { key: CURRENT_TENANT_STORAGE_KEY, newValue }));
   } catch (e) {
     reportError(e);
   }
 };
 
 export const store = {
-  getSnapshot: () => localStorage.getItem(CURRENT_TENANT_STORAGE_KEY),
+  getSnapshot: () => localStorage.getItem(CURRENT_TENANT_STORAGE_KEY) ?? '{}',
   subscribe: (listener: () => void) => {
     window.addEventListener('storage', listener);
     return () => window.removeEventListener('storage', listener);

diff --git a/...pp-libs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.types.ts b/...pp-libs/webapp-tenants/src/providers/currentTenantProvider/currentTenantProvider.types.ts
@@ -5,3 +5,7 @@ export const CURRENT_TENANT_STORAGE_KEY = 'currentTenant';
 export type CurrentTenantProviderProps = {
   storageKey?: string;
 } & PropsWithChildren;
+
+export type CurrentTenantStorageState = {
+  [key: string]: string;
+};