diff --git a/src/pages/commonFeed/CommonFeed.tsx b/src/pages/commonFeed/CommonFeed.tsx index 919a4b9030..97bd7b46fa 100644 --- a/src/pages/commonFeed/CommonFeed.tsx +++ b/src/pages/commonFeed/CommonFeed.tsx @@ -29,7 +29,7 @@ import { useRoutesContext } from "@/shared/contexts"; import { useAuthorizedModal, useQueryParams } from "@/shared/hooks"; import { useCommonFeedItems, - useUserActivity, + useLastVisitedCommon, useUserCommonIds, } from "@/shared/hooks/useCases"; import { useCommonPinnedFeedItems } from "@/shared/hooks/useCases/useCommonPinnedFeedItems"; @@ -118,7 +118,7 @@ const CommonFeedComponent: FC = (props) => { fetched: isCommonDataFetched, fetchCommonData, } = useCommonData(userId); - const { updateUserActivity } = useUserActivity(userId); + const { updateLastVisitedCommon } = useLastVisitedCommon(userId); const parentCommonId = commonData?.common.directParent?.commonId; const anotherCommonId = userCommonIds[0] === commonId ? userCommonIds[1] : userCommonIds[0]; @@ -419,30 +419,28 @@ const CommonFeedComponent: FC = (props) => { }, [rootCommonMember?.id]); useEffect(() => { - return () => { + const updateLastVisited = () => { const common = stateRef.current?.data?.common; - dispatch( - commonLayoutActions.setLastCommonFromFeed({ - id: commonId, - data: common - ? { - name: common.name, - image: common.image, - isProject: checkIsProject(common), - memberCount: common.memberCount, - } - : null, - }), - ); + updateLastVisitedCommon({ + id: commonId, + data: common + ? { + name: common.name, + image: common.image, + isProject: checkIsProject(common), + memberCount: common.memberCount, + } + : null, + }); }; - }, [commonId]); - useEffect(() => { - updateUserActivity({ - lastVisitedCommon: commonId, - }); - }, [updateUserActivity, commonId]); + updateLastVisited(); + + return () => { + updateLastVisited(); + }; + }, [updateLastVisitedCommon, commonId]); if (!isDataFetched) { const headerEl = renderLoadingHeader ? ( diff --git a/src/pages/commonFeed/CommonFeedPage.tsx b/src/pages/commonFeed/CommonFeedPage.tsx index 233a90a473..68f8ac59f6 100644 --- a/src/pages/commonFeed/CommonFeedPage.tsx +++ b/src/pages/commonFeed/CommonFeedPage.tsx @@ -1,12 +1,13 @@ import React, { FC, useEffect, useMemo } from "react"; import { useDispatch, useSelector } from "react-redux"; import { useParams } from "react-router-dom"; +import { selectUser } from "@/pages/Auth/store/selectors"; import { InboxItemType } from "@/shared/constants"; import { MainRoutesProvider } from "@/shared/contexts"; +import { useLastVisitedCommon } from "@/shared/hooks/useCases"; import { MultipleSpacesLayoutPageContent } from "@/shared/layouts"; import { multipleSpacesLayoutActions, - selectCommonLayoutLastCommonFromFeed, selectMultipleSpacesLayoutMainWidth, } from "@/store/states"; import BaseCommonFeedPage, { @@ -59,7 +60,9 @@ const CommonFeedPage: FC = () => { const { id: commonId } = useParams(); const dispatch = useDispatch(); const layoutMainWidth = useSelector(selectMultipleSpacesLayoutMainWidth); - const lastCommonFromFeed = useSelector(selectCommonLayoutLastCommonFromFeed); + const user = useSelector(selectUser()); + const userId = user?.uid; + const { lastCommonFromFeed } = useLastVisitedCommon(userId); const onActiveItemDataChange = useActiveItemDataChange(); const feedLayoutSettings = useMemo( () => ({ diff --git a/src/shared/hooks/useCases/index.ts b/src/shared/hooks/useCases/index.ts index 72c3a2816f..1fda0b1ab5 100644 --- a/src/shared/hooks/useCases/index.ts +++ b/src/shared/hooks/useCases/index.ts @@ -23,7 +23,7 @@ export { useProposalById } from "./useProposalById"; export { useRootCommonMembershipIntro } from "./useRootCommonMembershipIntro"; export { useSubCommons } from "./useSubCommons"; export { useSupportersData } from "./useSupportersData"; -export { useUserActivity } from "./useUserActivity"; +export { useLastVisitedCommon } from "./useLastVisitedCommon"; export { useUserById } from "./useUserById"; export { default as useUserCards } from "./useUserCards"; export { useUserCommonIds } from "./useUserCommonIds"; diff --git a/src/shared/hooks/useCases/useUserActivity.ts b/src/shared/hooks/useCases/useLastVisitedCommon.ts similarity index 56% rename from src/shared/hooks/useCases/useUserActivity.ts rename to src/shared/hooks/useCases/useLastVisitedCommon.ts index 1379a0f51d..3fa8672057 100644 --- a/src/shared/hooks/useCases/useUserActivity.ts +++ b/src/shared/hooks/useCases/useLastVisitedCommon.ts @@ -1,37 +1,37 @@ import { useCallback, useEffect } from "react"; import { useDispatch, useSelector } from "react-redux"; import { Logger, UserActivityService } from "@/services"; -import { UserActivity } from "@/shared/models"; import { commonLayoutActions, + CommonLayoutState, selectCommonLayoutLastCommonFromFeed, } from "@/store/states"; interface Return { - lastVisitedCommon?: string; - updateUserActivity: (data: Partial) => void; + lastVisitedCommon: CommonLayoutState["lastCommonFromFeed"]; + updateLastVisitedCommon: ( + data: CommonLayoutState["lastCommonFromFeed"], + ) => void; } -export const useUserActivity = (userId?: string): Return => { +export const useLastVisitedCommon = (userId?: string): Return => { const dispatch = useDispatch(); - const lastCommonFromFeed = useSelector(selectCommonLayoutLastCommonFromFeed); + const lastVisitedCommon = useSelector(selectCommonLayoutLastCommonFromFeed); - const updateUserActivity = useCallback( - async (data: Partial) => { - if (data.lastVisitedCommon) { - dispatch( - commonLayoutActions.setLastCommonFromFeed({ - id: data.lastVisitedCommon, - data: null, - }), - ); - } - if (!userId) { + const updateLastVisitedCommon = useCallback< + Return["updateLastVisitedCommon"] + >( + async (data) => { + dispatch(commonLayoutActions.setLastCommonFromFeed(data)); + + if (!userId || !data?.id) { return; } try { - await UserActivityService.updateUserActivity(userId, data); + await UserActivityService.updateUserActivity(userId, { + lastVisitedCommon: data.id, + }); } catch (error) { Logger.error(error); } @@ -62,7 +62,7 @@ export const useUserActivity = (userId?: string): Return => { }, [userId]); return { - lastVisitedCommon: lastCommonFromFeed?.id, - updateUserActivity, + lastVisitedCommon, + updateLastVisitedCommon, }; }; diff --git a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx index 40d759d824..de37d17d22 100644 --- a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx +++ b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx @@ -10,7 +10,10 @@ import { import { Tab, Tabs } from "@/shared/components"; import { useRoutesContext } from "@/shared/contexts"; import { useModal } from "@/shared/hooks"; -import { useUserActivity, useUserCommonIds } from "@/shared/hooks/useCases"; +import { + useLastVisitedCommon, + useUserCommonIds, +} from "@/shared/hooks/useCases"; import { Avatar2Icon, Blocks2Icon, InboxIcon } from "@/shared/icons"; import { CreateCommonPrompt } from "@/shared/layouts/MultipleSpacesLayout/components/Header/components/Navigation/components"; import { LayoutTab } from "../../constants"; @@ -41,7 +44,7 @@ const LayoutTabs: FC = (props) => { const user = useSelector(selectUser()); const userId = user?.uid; const { data: userCommonIds } = useUserCommonIds(); - const { lastVisitedCommon } = useUserActivity(userId); + const { lastVisitedCommon } = useLastVisitedCommon(userId); const { isShowing: isCreateCommonPromptOpen, onOpen: onCreateCommonPromptOpen, @@ -81,7 +84,7 @@ const LayoutTabs: FC = (props) => { } as CSSProperties; const handleSpacesClick = () => { - const commonForRedirectId = lastVisitedCommon || userCommonIds[0]; + const commonForRedirectId = lastVisitedCommon?.id || userCommonIds[0]; if (commonForRedirectId) { history.push(getCommonPagePath(commonForRedirectId)); diff --git a/src/shared/layouts/MultipleSpacesLayout/components/Header/components/Navigation/Navigation.tsx b/src/shared/layouts/MultipleSpacesLayout/components/Header/components/Navigation/Navigation.tsx index 962edabb97..ed1a2b51e0 100644 --- a/src/shared/layouts/MultipleSpacesLayout/components/Header/components/Navigation/Navigation.tsx +++ b/src/shared/layouts/MultipleSpacesLayout/components/Header/components/Navigation/Navigation.tsx @@ -7,10 +7,13 @@ import { selectUser, selectUserStreamsWithNotificationsAmount, } from "@/pages/Auth/store/selectors"; -import { InboxItemType, ROUTE_PATHS } from "@/shared/constants"; +import { ROUTE_PATHS } from "@/shared/constants"; import { useRoutesContext } from "@/shared/contexts"; import { useModal } from "@/shared/hooks"; -import { useUserActivity, useUserCommonIds } from "@/shared/hooks/useCases"; +import { + useLastVisitedCommon, + useUserCommonIds, +} from "@/shared/hooks/useCases"; import { BlocksIcon, InboxIcon } from "@/shared/icons"; import { CommonSidenavLayoutTab, @@ -40,8 +43,8 @@ const Navigation: FC = (props) => { const user = useSelector(selectUser()); const userId = user?.uid; const { data: userCommonIds } = useUserCommonIds(); - const { lastVisitedCommon } = useUserActivity(userId); - const mySpacesCommonId = lastVisitedCommon || userCommonIds[0] || ""; + const { lastVisitedCommon } = useLastVisitedCommon(userId); + const mySpacesCommonId = lastVisitedCommon?.id || userCommonIds[0] || ""; const mySpacesPagePath = ( mySpacesCommonId ? getCommonPagePath(mySpacesCommonId) : "" ) as ROUTE_PATHS;