fix projects in sidenav fetch on item click from breadcrumbs

daostack · Oct 24, 2023 · 7d47273 · 7d47273
1 parent 742d3fc
commit 7d47273
Show file tree

Hide file tree

Showing 11 changed files with 33 additions and 2 deletions.
diff --git a/src/pages/OldCommon/components/CommonListContainer/CreateCommonModal/CreateCommonModal.tsx b/src/pages/OldCommon/components/CommonListContainer/CreateCommonModal/CreateCommonModal.tsx
@@ -284,6 +284,7 @@ export default function CreateCommonModal(props: CreateCommonModalProps) {
       image: createdCommonData.common.image,
       name: createdCommonData.common.name,
       directParent: createdCommonData.common.directParent,
+      rootCommonId: createdCommonData.common.rootCommonId,
       hasMembership: true,
       hasPermissionToAddProject,
       notificationsAmount: 0,

diff --git a/src/pages/commonCreation/components/CommonCreation/CommonCreation.tsx b/src/pages/commonCreation/components/CommonCreation/CommonCreation.tsx
@@ -39,6 +39,7 @@ const CommonCreation: FC = () => {
       image: common.image,
       name: common.name,
       directParent: common.directParent,
+      rootCommonId: common.rootCommonId,
       hasMembership: true,
       hasPermissionToAddProject,
       notificationsAmount: 0,

diff --git a/src/pages/commonCreation/components/ProjectCreation/ProjectCreation.tsx b/src/pages/commonCreation/components/ProjectCreation/ProjectCreation.tsx
@@ -72,6 +72,7 @@ const ProjectCreation: FC<ProjectCreationProps> = (props) => {
         image: createdProject.image,
         name: createdProject.name,
         directParent: createdProject.directParent,
+        rootCommonId: createdProject.rootCommonId,
         hasMembership: true,
         hasPermissionToAddProject: Object.values(governance.circles).some(
           (circle) => circle.allowedActions[GovernanceActions.CREATE_PROJECT],

diff --git a/...ed/layouts/CommonSidenavLayout/components/SidenavContent/hooks/useProjectsSubscription.ts b/...ed/layouts/CommonSidenavLayout/components/SidenavContent/hooks/useProjectsSubscription.ts
@@ -28,6 +28,7 @@ const getProjectItemFromCommon = async (
     image: common.image,
     name: common.name,
     directParent: common.directParent,
+    rootCommonId: common.rootCommonId,
   };
 
   if (initialItem) {

diff --git a/...t/components/Header/components/Breadcrumbs/components/BreadcrumbsItem/BreadcrumbsItem.tsx b/...t/components/Header/components/Breadcrumbs/components/BreadcrumbsItem/BreadcrumbsItem.tsx
@@ -13,6 +13,7 @@ export interface BreadcrumbsItemProps {
   onCommonCreate?: () => void;
   withMenu?: boolean;
   isLoading?: boolean;
+  onClick?: () => void;
 }
 
 const BreadcrumbsItem: FC<BreadcrumbsItemProps> = (props) => {
@@ -23,6 +24,7 @@ const BreadcrumbsItem: FC<BreadcrumbsItemProps> = (props) => {
     onCommonCreate,
     withMenu = true,
     isLoading = false,
+    onClick,
   } = props;
   const history = useHistory();
   const { getCommonPagePath } = useRoutesContext();
@@ -32,6 +34,7 @@ const BreadcrumbsItem: FC<BreadcrumbsItemProps> = (props) => {
   const handleButtonClick = () => {
     if (!withMenu) {
       history.push(getCommonPagePath(activeItem.commonId));
+      onClick?.();
       return;
     }
     if (containerRef.current) {

diff --git a/...ents/Header/components/Breadcrumbs/components/FeedItemBreadcrumbs/FeedItemBreadcrumbs.tsx b/...ents/Header/components/Breadcrumbs/components/FeedItemBreadcrumbs/FeedItemBreadcrumbs.tsx
@@ -1,5 +1,11 @@
 import React, { FC } from "react";
-import { MultipleSpacesLayoutFeedItemBreadcrumbs } from "@/store/states";
+import { useDispatch, useSelector } from "react-redux";
+import {
+  commonLayoutActions,
+  MultipleSpacesLayoutFeedItemBreadcrumbs,
+  ProjectsStateItem,
+  selectCommonLayoutCommonId,
+} from "@/store/states";
 import { useGoToCreateCommon } from "../../../../../../hooks";
 import { LoadingBreadcrumbsItem } from "../LoadingBreadcrumbsItem";
 import { Separator } from "../Separator";
@@ -13,8 +19,21 @@ interface FeedItemBreadcrumbsProps {
 
 const FeedItemBreadcrumbs: FC<FeedItemBreadcrumbsProps> = (props) => {
   const { breadcrumbs, itemsWithMenus } = props;
+  const dispatch = useDispatch();
+  const currentLayoutCommonId = useSelector(selectCommonLayoutCommonId);
   const goToCreateCommon = useGoToCreateCommon();
 
+  const handleItemClick = (item: ProjectsStateItem) => {
+    if (
+      currentLayoutCommonId &&
+      item.rootCommonId &&
+      item.rootCommonId !== currentLayoutCommonId
+    ) {
+      dispatch(commonLayoutActions.setCurrentCommonId(item.rootCommonId));
+      dispatch(commonLayoutActions.clearProjects());
+    }
+  };
+
   return (
     <ul className={styles.container}>
       {breadcrumbs.areItemsLoading && <LoadingBreadcrumbsItem />}
@@ -26,6 +45,7 @@ const FeedItemBreadcrumbs: FC<FeedItemBreadcrumbsProps> = (props) => {
               activeItem={item}
               onCommonCreate={index === 0 ? goToCreateCommon : undefined}
               withMenu={itemsWithMenus}
+              onClick={() => handleItemClick(item)}
             />
           </React.Fragment>
         ))}

diff --git a/...mbs/components/FeedItemBreadcrumbs/components/FeedBreadcrumbsItem/FeedBreadcrumbsItem.tsx b/...mbs/components/FeedItemBreadcrumbs/components/FeedBreadcrumbsItem/FeedBreadcrumbsItem.tsx
@@ -12,7 +12,7 @@ import {
 
 type FeedBreadcrumbsItemProps = Pick<
   BreadcrumbsItemProps,
-  "activeItem" | "onCommonCreate" | "withMenu"
+  "activeItem" | "onCommonCreate" | "withMenu" | "onClick"
 >;
 
 const getItemsByParentId = (

diff --git a/src/store/states/commonLayout/saga/getCommons.ts b/src/store/states/commonLayout/saga/getCommons.ts
@@ -89,6 +89,7 @@ export function* getCommons(
         image: common.image,
         name: common.name,
         directParent: common.directParent,
+        rootCommonId: common.rootCommonId,
         hasMembership,
         hasPermissionToAddProject,
         notificationsAmount: 0,

diff --git a/src/store/states/commonLayout/saga/getProjects.ts b/src/store/states/commonLayout/saga/getProjects.ts
@@ -54,6 +54,7 @@ export function* getProjects(
         image: common.image,
         name: common.name,
         directParent: common.directParent,
+        rootCommonId: common.rootCommonId,
         hasMembership,
         hasPermissionToAddProject,
         notificationsAmount: 0,

diff --git a/src/store/states/multipleSpacesLayout/saga/fetchBreadcrumbsItemsByCommonId.ts b/src/store/states/multipleSpacesLayout/saga/fetchBreadcrumbsItemsByCommonId.ts
@@ -24,6 +24,7 @@ const fetchProjectsInfoByActiveCommonId = async (
     image: common.image,
     name: common.name,
     directParent: common.directParent,
+    rootCommonId: common.rootCommonId,
     hasMembership: true,
   }));
 };

diff --git a/src/store/states/projects/saga.ts b/src/store/states/projects/saga.ts
@@ -25,6 +25,7 @@ function* getProjects(action: ReturnType<typeof actions.getProjects.request>) {
         image: common.image,
         name: common.name,
         directParent: common.directParent,
+        rootCommonId: common.rootCommonId,
         hasMembership,
         notificationsAmount: 0,
       }),