Merge pull request #1058 from AppQuality/UN-541-permission-hook

chore: refactor PermissionItem to use custom hook for workspace access check

Author: cannarocks

src/common/components/navigation/workspacesDropdown/PermissionItem.tsx

@@ -1,26 +1,9 @@
-import { useEffect, useState } from 'react';
-import { useAppSelector } from 'src/app/hooks';
 import { appTheme } from 'src/app/theme';
-import { selectWorkspaces } from 'src/features/workspaces/selectors';
-import { useActiveWorkspace } from 'src/hooks/useActiveWorkspace';
+import { useCanAccessToActiveWorkspace } from 'src/hooks/useCanAccessToActiveWorkspace';
 import { WorkspaceSettings } from '../../inviteUsers/workspaceSettings';
 
 export const PermissionItem = () => {
-  const { activeWorkspace } = useActiveWorkspace();
-  const workspaces = useAppSelector(selectWorkspaces);
-
-  const [canManageUsers, setCanManageUsers] = useState(false);
-
-  useEffect(() => {
-    if (activeWorkspace) {
-      const personalWorkspaces = workspaces.filter((ws) => !ws.isShared);
-      const activeWorkspaceInPersonal = !!personalWorkspaces.find(
-        (ws) => ws.id === activeWorkspace?.id
-      );
-
-      setCanManageUsers(activeWorkspaceInPersonal);
-    }
-  }, [activeWorkspace]);
+  const canManageUsers = useCanAccessToActiveWorkspace();
 
   return canManageUsers ? (
     <div style={{ marginLeft: appTheme.space.sm }}>

src/hooks/useCanAccessToActiveWorkspace.ts

@@ -0,0 +1,26 @@
+import { useEffect, useState } from 'react';
+import { useAppSelector } from 'src/app/hooks';
+import { selectWorkspaces } from 'src/features/workspaces/selectors';
+import { useActiveWorkspace } from './useActiveWorkspace';
+
+const useCanAccessToActiveWorkspace = () => {
+  const { activeWorkspace } = useActiveWorkspace();
+  const workspaces = useAppSelector(selectWorkspaces);
+
+  const [hasAccess, setHasAccess] = useState(false);
+
+  useEffect(() => {
+    if (activeWorkspace) {
+      const personalWorkspaces = workspaces.filter((ws) => !ws.isShared);
+      const activeWorkspaceInPersonal = !!personalWorkspaces.find(
+        (ws) => ws.id === activeWorkspace?.id
+      );
+
+      setHasAccess(activeWorkspaceInPersonal);
+    }
+  }, [activeWorkspace]);
+
+  return hasAccess;
+};
+
+export { useCanAccessToActiveWorkspace };