fix membership modals showing based on global data fetched flag

daostack · Sep 19, 2023 · 6d9df4c · 6d9df4c
1 parent e663da4
commit 6d9df4c
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 6 deletions.
diff --git a/src/pages/commonFeed/CommonFeed.tsx b/src/pages/commonFeed/CommonFeed.tsx
@@ -122,6 +122,7 @@ const CommonFeedComponent: FC<CommonFeedProps> = (props) => {
     rootCommonId: commonData?.common.rootCommonId,
     parentCommonId,
     governanceCircles: commonData?.governance.circles,
+    rootCommonGovernanceCircles: commonData?.rootCommonGovernance?.circles,
   });
   const {
     data: commonPinnedFeedItems,
@@ -479,14 +480,14 @@ const CommonFeedComponent: FC<CommonFeedProps> = (props) => {
       {commonData.common && commonData.governance && (
         <>
           <MembershipRequestModal
-            isShowing={isCommonJoinModalOpen}
+            isShowing={isGlobalDataFetched && isCommonJoinModalOpen}
             onClose={onCommonJoinModalClose}
             common={commonData.common}
             governance={commonData.governance}
             showLoadingAfterSuccessfulCreation
           />
           <JoinProjectModal
-            isShowing={isProjectJoinModalOpen}
+            isShowing={isGlobalDataFetched && isProjectJoinModalOpen}
             onClose={onProjectJoinModalClose}
             common={commonData.common}
             governance={commonData.governance}
@@ -496,7 +497,7 @@ const CommonFeedComponent: FC<CommonFeedProps> = (props) => {
       )}
       {commonData.rootCommon && commonData.rootCommonGovernance && (
         <MembershipRequestModal
-          isShowing={isRootCommonJoinModalOpen}
+          isShowing={isGlobalDataFetched && isRootCommonJoinModalOpen}
           onClose={onRootCommonJoinModalClose}
           common={commonData.rootCommon}
           governance={commonData.rootCommonGovernance}

diff --git a/src/pages/commonFeed/hooks/useGlobalCommonData.ts b/src/pages/commonFeed/hooks/useGlobalCommonData.ts
@@ -1,4 +1,4 @@
-import { useCallback } from "react";
+import { useCallback, useEffect } from "react";
 import { useCommonMember } from "@/pages/OldCommon/hooks";
 import { LoadingState } from "@/shared/interfaces";
 import { Circles, CirclesPermissions, CommonMember } from "@/shared/models";
@@ -8,6 +8,7 @@ interface UseGlobalCommonDataArguments {
   rootCommonId?: string;
   parentCommonId?: string;
   governanceCircles?: Circles;
+  rootCommonGovernanceCircles?: Circles;
 }
 
 type State = LoadingState<{
@@ -23,7 +24,13 @@ interface Return extends State {
 export const useGlobalCommonData = (
   data: UseGlobalCommonDataArguments,
 ): Return => {
-  const { commonId, rootCommonId, parentCommonId, governanceCircles } = data;
+  const {
+    commonId,
+    rootCommonId,
+    parentCommonId,
+    governanceCircles,
+    rootCommonGovernanceCircles,
+  } = data;
   const {
     loading: isCommonMemberLoading,
     fetched: isCommonMemberFetched,
@@ -43,6 +50,9 @@ export const useGlobalCommonData = (
     setCommonMember: setRootCommonMember,
   } = useCommonMember({
     shouldAutoReset: false,
+    withSubscription: true,
+    commonId: rootCommonId,
+    governanceCircles: rootCommonGovernanceCircles,
   });
   const {
     loading: isParentCommonMemberLoading,
@@ -71,12 +81,20 @@ export const useGlobalCommonData = (
   }, [rootCommonId, fetchRootCommonMember, setRootCommonMember]);
 
   const fetchParentCommonMemberData = useCallback(() => {
+    if (parentCommonId && rootCommonId === parentCommonId) {
+      return;
+    }
     if (parentCommonId) {
       fetchParentCommonMember(parentCommonId, {}, true);
     } else {
       setParentCommonMember(null);
     }
-  }, [parentCommonId, fetchParentCommonMember, setParentCommonMember]);
+  }, [
+    rootCommonId,
+    parentCommonId,
+    fetchParentCommonMember,
+    setParentCommonMember,
+  ]);
 
   const fetchUserRelatedData = useCallback(() => {
     fetchCommonMember(commonId, {}, true);
@@ -89,6 +107,12 @@ export const useGlobalCommonData = (
     fetchParentCommonMemberData,
   ]);
 
+  useEffect(() => {
+    if (rootCommonId === parentCommonId) {
+      setParentCommonMember(rootCommonMember);
+    }
+  }, [rootCommonMember]);
+
   return {
     loading: isGlobalDataLoading,
     fetched: isGlobalDataFetched,