From 452ee87923f4cc63b0986c536aff4e55af053b5e Mon Sep 17 00:00:00 2001 From: Andrey Mikhadyuk Date: Wed, 4 Oct 2023 15:56:46 +0300 Subject: [PATCH 01/68] add lastCommonIdFromFeed to open correct page on Feed tab click --- .../components/LayoutTabs/LayoutTabs.tsx | 40 ++++++++++++++++--- src/store/states/commonLayout/actions.ts | 4 ++ src/store/states/commonLayout/constants.ts | 2 + src/store/states/commonLayout/reducer.ts | 6 +++ src/store/states/commonLayout/selectors.ts | 3 ++ src/store/states/commonLayout/types.ts | 1 + 6 files changed, 51 insertions(+), 5 deletions(-) diff --git a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx index c3f386c4fb..589de0ac93 100644 --- a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx +++ b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx @@ -1,5 +1,6 @@ -import React, { CSSProperties, FC, ReactNode } from "react"; -import { useSelector } from "react-redux"; +import React, { CSSProperties, FC, ReactNode, useEffect } from "react"; +import { useDispatch, useSelector } from "react-redux"; +import { useParams } from "react-router"; import { useHistory } from "react-router-dom"; import classNames from "classnames"; import { @@ -7,9 +8,12 @@ import { selectUserStreamsWithNotificationsAmount, } from "@/pages/Auth/store/selectors"; import { Tab, Tabs } from "@/shared/components"; +import { ROUTE_PATHS } from "@/shared/constants"; import { useRoutesContext } from "@/shared/contexts"; import { Avatar2Icon, BlocksIcon, InboxIcon } from "@/shared/icons"; -import { openSidenav } from "@/shared/utils"; +import { matchOneOfRoutes, openSidenav } from "@/shared/utils"; +import { selectCommonLayoutLastCommonIdFromFeed } from "@/store/states"; +import { setLastCommonIdFromFeed } from "@/store/states/commonLayout/actions"; import { LayoutTab } from "../../constants"; import { getActiveLayoutTab, getLayoutTabName } from "./utils"; import styles from "./LayoutTabs.module.scss"; @@ -29,7 +33,13 @@ interface TabConfiguration { const LayoutTabs: FC = (props) => { const { className } = props; const history = useHistory(); - const { getInboxPagePath, getProfilePagePath } = useRoutesContext(); + const { id: commonIdFromUrl } = useParams<{ id: string }>(); + const { getCommonPagePath, getInboxPagePath, getProfilePagePath } = + useRoutesContext(); + const dispatch = useDispatch(); + const lastCommonIdFromFeed = useSelector( + selectCommonLayoutLastCommonIdFromFeed, + ); const isAuthenticated = useSelector(authentificated()); const userStreamsWithNotificationsAmount = useSelector( selectUserStreamsWithNotificationsAmount(), @@ -67,6 +77,14 @@ const LayoutTabs: FC = (props) => { "--items-amount": tabs.length, } as CSSProperties; + const handleSpacesClick = () => { + if (lastCommonIdFromFeed) { + history.push(getCommonPagePath(lastCommonIdFromFeed)); + } else { + openSidenav(); + } + }; + const handleTabChange = (value: unknown) => { if (activeTab === value) { return; @@ -74,7 +92,7 @@ const LayoutTabs: FC = (props) => { switch (value) { case LayoutTab.Spaces: - openSidenav(); + handleSpacesClick(); break; case LayoutTab.Inbox: history.push(getInboxPagePath()); @@ -87,6 +105,18 @@ const LayoutTabs: FC = (props) => { } }; + useEffect(() => { + if ( + matchOneOfRoutes( + history.location.pathname, + [ROUTE_PATHS.COMMON, ROUTE_PATHS.V04_COMMON], + { exact: false }, + ) + ) { + dispatch(setLastCommonIdFromFeed(commonIdFromUrl)); + } + }, [commonIdFromUrl]); + return ( (); +export const setLastCommonIdFromFeed = createStandardAction( + CommonLayoutActionType.SET_LAST_COMMON_ID_FROM_FEED, +)(); + export const clearData = createStandardAction( CommonLayoutActionType.CLEAR_DATA, )(); diff --git a/src/store/states/commonLayout/constants.ts b/src/store/states/commonLayout/constants.ts index 38f9c2f751..4f68f889bc 100644 --- a/src/store/states/commonLayout/constants.ts +++ b/src/store/states/commonLayout/constants.ts @@ -13,6 +13,8 @@ export enum CommonLayoutActionType { SET_CURRENT_COMMON_ID = "@COMMON_LAYOUT/SET_CURRENT_COMMON_ID", + SET_LAST_COMMON_ID_FROM_FEED = "@COMMON_LAYOUT/SET_LAST_COMMON_ID_FROM_FEED", + CLEAR_DATA = "@COMMON_LAYOUT/CLEAR_DATA", CLEAR_DATA_EXCEPT_OF_CURRENT = "@COMMON_LAYOUT/CLEAR_DATA_EXCEPT_OF_CURRENT", diff --git a/src/store/states/commonLayout/reducer.ts b/src/store/states/commonLayout/reducer.ts index 6ee068348b..6c50f3b7b6 100644 --- a/src/store/states/commonLayout/reducer.ts +++ b/src/store/states/commonLayout/reducer.ts @@ -9,6 +9,7 @@ type Action = ActionType; const initialState: CommonLayoutState = { currentCommonId: null, + lastCommonIdFromFeed: null, commons: [], areCommonsLoading: false, areCommonsFetched: false, @@ -123,6 +124,11 @@ export const reducer = createReducer(initialState) nextState.currentCommonId = payload; }), ) + .handleAction(actions.setLastCommonIdFromFeed, (state, { payload }) => + produce(state, (nextState) => { + nextState.lastCommonIdFromFeed = payload; + }), + ) .handleAction(actions.clearData, (state) => produce(state, (nextState) => { clearData(nextState); diff --git a/src/store/states/commonLayout/selectors.ts b/src/store/states/commonLayout/selectors.ts index 4450bf213b..14eae9ebea 100644 --- a/src/store/states/commonLayout/selectors.ts +++ b/src/store/states/commonLayout/selectors.ts @@ -6,6 +6,9 @@ const selectCommonLayout = (state: AppState) => state.commonLayout; export const selectCommonLayoutCommonId = (state: AppState) => state.commonLayout.currentCommonId; +export const selectCommonLayoutLastCommonIdFromFeed = (state: AppState) => + state.commonLayout.lastCommonIdFromFeed; + export const selectCommonLayoutCommons = (state: AppState) => state.commonLayout.commons; diff --git a/src/store/states/commonLayout/types.ts b/src/store/states/commonLayout/types.ts index fde59ed117..f473a76ee1 100644 --- a/src/store/states/commonLayout/types.ts +++ b/src/store/states/commonLayout/types.ts @@ -2,6 +2,7 @@ import { ProjectsStateItem } from "../projects"; export interface CommonLayoutState { currentCommonId: string | null; + lastCommonIdFromFeed: string | null; commons: ProjectsStateItem[]; areCommonsLoading: boolean; areCommonsFetched: boolean; From c12505135919792062d389066cfee4ce170ea64e Mon Sep 17 00:00:00 2001 From: Roie Natan Date: Thu, 5 Oct 2023 10:45:54 +0300 Subject: [PATCH 02/68] show loader until messages are loaded. Show no message only when discussion message count is zero --- src/pages/common/components/ChatComponent/ChatComponent.tsx | 1 + .../ChatComponent/components/ChatContent/ChatContent.tsx | 4 +++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/pages/common/components/ChatComponent/ChatComponent.tsx b/src/pages/common/components/ChatComponent/ChatComponent.tsx index be49eb8f92..52337bb88c 100644 --- a/src/pages/common/components/ChatComponent/ChatComponent.tsx +++ b/src/pages/common/components/ChatComponent/ChatComponent.tsx @@ -669,6 +669,7 @@ export default function ChatComponent({ onUserClick={onUserClick} onFeedItemClick={onFeedItemClick} onInternalLinkClick={onInternalLinkClick} + messageCount={discussion?.messageCount} />
diff --git a/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx b/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx index 141992de99..6b4042844c 100644 --- a/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx +++ b/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx @@ -60,6 +60,7 @@ interface ChatContentInterface { onUserClick?: (userId: string) => void; onFeedItemClick?: (feedItemId: string) => void; onInternalLinkClick?: (data: InternalLinkData) => void; + messageCount?: number; } const isToday = (someDate: Date) => { @@ -97,6 +98,7 @@ const ChatContent: ForwardRefRenderFunction< onUserClick, onFeedItemClick, onInternalLinkClick, + messageCount, }, chatContentRef, ) => { @@ -299,7 +301,7 @@ const ChatContent: ForwardRefRenderFunction< ); })} - {!dateList.length && !isLoading && ( + {!isLoading && messageCount === 0 && (

There are no messages here yet.
From 227331aae080597dc90d8f3a8392b9da0c3af980 Mon Sep 17 00:00:00 2001 From: Andrey Mikhadyuk Date: Thu, 5 Oct 2023 11:05:42 +0300 Subject: [PATCH 03/68] add header and tabs to feed loading state --- src/pages/commonFeed/CommonFeed.tsx | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/src/pages/commonFeed/CommonFeed.tsx b/src/pages/commonFeed/CommonFeed.tsx index a1ed5b2049..20d72dd7b0 100644 --- a/src/pages/commonFeed/CommonFeed.tsx +++ b/src/pages/commonFeed/CommonFeed.tsx @@ -29,6 +29,7 @@ import { useRoutesContext } from "@/shared/contexts"; import { useAuthorizedModal, useQueryParams } from "@/shared/hooks"; import { useCommonFeedItems, useUserCommonIds } from "@/shared/hooks/useCases"; import { useCommonPinnedFeedItems } from "@/shared/hooks/useCases/useCommonPinnedFeedItems"; +import { useIsTabletView } from "@/shared/hooks/viewport"; import { RightArrowThinIcon } from "@/shared/icons"; import { checkIsFeedItemFollowLayoutItem, @@ -88,6 +89,7 @@ const CommonFeedComponent: FC = (props) => { onActiveItemDataChange, } = props; const { getCommonPagePath, getProfilePagePath } = useRoutesContext(); + const isTabletView = useIsTabletView(); const queryParams = useQueryParams(); const dispatch = useDispatch(); const history = useHistory(); @@ -397,23 +399,20 @@ const CommonFeedComponent: FC = (props) => { } }, [rootCommonMember?.id]); - if (!isDataFetched) { - return ( -

- -
+ if (!isDataFetched || !commonData) { + const content = isDataFetched ? ( + + ) : ( + ); - } - if (!commonData) { + return ( <> } /> -
- -
+
{content}
); From 517937197640ccc2c404d2ef49e115ea2ef8eb1a Mon Sep 17 00:00:00 2001 From: Andrey Mikhadyuk Date: Thu, 5 Oct 2023 11:57:36 +0300 Subject: [PATCH 04/68] move header common content to a separate component --- .../HeaderContent/HeaderContent.module.scss | 103 ----------------- .../HeaderContent/HeaderContent.tsx | 51 +++------ .../HeaderCommonContent.module.scss | 105 ++++++++++++++++++ .../HeaderCommonContent.tsx | 63 +++++++++++ .../components/HeaderCommonContent/index.ts | 1 + .../HeaderContent/components/index.ts | 1 + 6 files changed, 184 insertions(+), 140 deletions(-) create mode 100644 src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/HeaderCommonContent.module.scss create mode 100644 src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/HeaderCommonContent.tsx create mode 100644 src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/index.ts diff --git a/src/pages/commonFeed/components/HeaderContent/HeaderContent.module.scss b/src/pages/commonFeed/components/HeaderContent/HeaderContent.module.scss index 3758bde7a9..1a56974e0d 100644 --- a/src/pages/commonFeed/components/HeaderContent/HeaderContent.module.scss +++ b/src/pages/commonFeed/components/HeaderContent/HeaderContent.module.scss @@ -12,109 +12,6 @@ } } -.openSidenavButton { - display: none; - - @include tablet { - display: flex; - } -} - -.commonContent { - display: flex; - overflow: hidden; -} - -.commonLink { - padding: 0 1.5rem 0 1.375rem; - display: flex; - align-items: center; - text-decoration: none; - overflow: hidden; - box-sizing: border-box; - - &:hover { - .commonName { - color: $c-pink-primary; - text-decoration: underline; - } - } - - @include tablet { - padding-left: 0; - padding-right: 0.5rem; - } -} - -.openSidenavIcon { - width: 1.5rem; - height: 1.5rem; - margin-right: 0.625rem; - transform: rotate(180deg); - color: $c-neutrals-600; -} - -.image { - width: 2.125rem; - height: 2.125rem; - margin-right: 0.75rem; - object-fit: cover; - box-sizing: border-box; - - @include tablet { - width: 2rem; - height: 2rem; - margin-right: 0.625rem; - } -} -.imageNonRounded { - border-radius: 0.375rem; -} -.imageRounded { - border-radius: 50%; -} - -.commonInfoWrapper { - display: flex; - flex-direction: column; - overflow: hidden; -} - -.commonMainInfoWrapper { - display: flex; - align-items: center; - column-gap: 8px; -} - -.commonName { - margin: 0; - font-family: PoppinsSans, sans-serif; - font-weight: 500; - font-size: $moderate-small; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - - @include tablet { - font-size: $moderate-xsmall; - } -} - -.commonMembersAmount { - margin: 0; - font-size: $mobile-title; - letter-spacing: 0.02em; - color: $c-gray-40; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - - @include tablet { - font-family: PoppinsSans, sans-serif; - font-size: $xxsmall-2; - } -} - .actionButtonsWrapper { display: flex; align-items: center; diff --git a/src/pages/commonFeed/components/HeaderContent/HeaderContent.tsx b/src/pages/commonFeed/components/HeaderContent/HeaderContent.tsx index 1636649037..981dd5077d 100644 --- a/src/pages/commonFeed/components/HeaderContent/HeaderContent.tsx +++ b/src/pages/commonFeed/components/HeaderContent/HeaderContent.tsx @@ -1,19 +1,19 @@ import React, { FC } from "react"; -import { NavLink } from "react-router-dom"; import classNames from "classnames"; -import { useRoutesContext } from "@/shared/contexts"; import { useCommonFollow } from "@/shared/hooks/useCases"; import { useIsTabletView } from "@/shared/hooks/viewport"; -import { RightArrowThinIcon, StarIcon } from "@/shared/icons"; import { CirclesPermissions, Common, CommonMember, Governance, } from "@/shared/models"; -import { CommonAvatar, TopNavigationOpenSidenavButton } from "@/shared/ui-kit"; -import { checkIsProject, getPluralEnding } from "@/shared/utils"; -import { ActionsButton, NewStreamButton } from "./components"; +import { checkIsProject } from "@/shared/utils"; +import { + ActionsButton, + HeaderCommonContent, + NewStreamButton, +} from "./components"; import styles from "./HeaderContent.module.scss"; interface HeaderContentProps { @@ -25,45 +25,22 @@ interface HeaderContentProps { const HeaderContent: FC = (props) => { const { className, common, commonMember, governance } = props; - const { getCommonPageAboutTabPath } = useRoutesContext(); const isMobileVersion = useIsTabletView(); const commonFollow = useCommonFollow(common.id, commonMember); - const isProject = checkIsProject(common); const showFollowIcon = commonFollow.isFollowInProgress ? !commonMember?.isFollowing : commonMember?.isFollowing; return (
-
- } - /> - - - -
-
-

{common.name}

- {showFollowIcon && } -
-

- {common.memberCount} member{getPluralEnding(common.memberCount)} -

-
- -
+
= (props) => { + const { + commonId, + commonName, + commonImage, + isProject, + memberCount, + showFollowIcon = false, + } = props; + const { getCommonPageAboutTabPath } = useRoutesContext(); + + return ( +
+ } + /> + + + +
+
+

{commonName}

+ {showFollowIcon && } +
+

+ {memberCount} member{getPluralEnding(memberCount)} +

+
+ +
+ ); +}; + +export default HeaderCommonContent; diff --git a/src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/index.ts b/src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/index.ts new file mode 100644 index 0000000000..c704d1dde3 --- /dev/null +++ b/src/pages/commonFeed/components/HeaderContent/components/HeaderCommonContent/index.ts @@ -0,0 +1 @@ +export { default as HeaderCommonContent } from "./HeaderCommonContent"; diff --git a/src/pages/commonFeed/components/HeaderContent/components/index.ts b/src/pages/commonFeed/components/HeaderContent/components/index.ts index 0f8782fc2a..4711e9ed50 100644 --- a/src/pages/commonFeed/components/HeaderContent/components/index.ts +++ b/src/pages/commonFeed/components/HeaderContent/components/index.ts @@ -1,3 +1,4 @@ +export * from "./HeaderCommonContent"; export * from "./NewStreamButton"; export * from "./ShareButton"; export * from "./ActionsButton"; From b1d221d56a2686a4864bbd675f7468977861f64b Mon Sep 17 00:00:00 2001 From: Andrey Mikhadyuk Date: Thu, 5 Oct 2023 12:10:42 +0300 Subject: [PATCH 05/68] extend last common from feed type --- .../components/LayoutTabs/LayoutTabs.tsx | 29 ++++--------------- src/store/states/commonLayout/actions.ts | 8 ++--- src/store/states/commonLayout/constants.ts | 2 +- src/store/states/commonLayout/reducer.ts | 6 ++-- src/store/states/commonLayout/selectors.ts | 4 +-- src/store/states/commonLayout/types.ts | 10 ++++++- 6 files changed, 25 insertions(+), 34 deletions(-) diff --git a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx index 589de0ac93..581b04d66f 100644 --- a/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx +++ b/src/shared/layouts/CommonSidenavLayout/components/LayoutTabs/LayoutTabs.tsx @@ -1,6 +1,5 @@ -import React, { CSSProperties, FC, ReactNode, useEffect } from "react"; -import { useDispatch, useSelector } from "react-redux"; -import { useParams } from "react-router"; +import React, { CSSProperties, FC, ReactNode } from "react"; +import { useSelector } from "react-redux"; import { useHistory } from "react-router-dom"; import classNames from "classnames"; import { @@ -8,12 +7,10 @@ import { selectUserStreamsWithNotificationsAmount, } from "@/pages/Auth/store/selectors"; import { Tab, Tabs } from "@/shared/components"; -import { ROUTE_PATHS } from "@/shared/constants"; import { useRoutesContext } from "@/shared/contexts"; import { Avatar2Icon, BlocksIcon, InboxIcon } from "@/shared/icons"; -import { matchOneOfRoutes, openSidenav } from "@/shared/utils"; -import { selectCommonLayoutLastCommonIdFromFeed } from "@/store/states"; -import { setLastCommonIdFromFeed } from "@/store/states/commonLayout/actions"; +import { openSidenav } from "@/shared/utils"; +import { selectCommonLayoutLastCommonFromFeed } from "@/store/states"; import { LayoutTab } from "../../constants"; import { getActiveLayoutTab, getLayoutTabName } from "./utils"; import styles from "./LayoutTabs.module.scss"; @@ -33,12 +30,10 @@ interface TabConfiguration { const LayoutTabs: FC = (props) => { const { className } = props; const history = useHistory(); - const { id: commonIdFromUrl } = useParams<{ id: string }>(); const { getCommonPagePath, getInboxPagePath, getProfilePagePath } = useRoutesContext(); - const dispatch = useDispatch(); const lastCommonIdFromFeed = useSelector( - selectCommonLayoutLastCommonIdFromFeed, + selectCommonLayoutLastCommonFromFeed, ); const isAuthenticated = useSelector(authentificated()); const userStreamsWithNotificationsAmount = useSelector( @@ -79,7 +74,7 @@ const LayoutTabs: FC = (props) => { const handleSpacesClick = () => { if (lastCommonIdFromFeed) { - history.push(getCommonPagePath(lastCommonIdFromFeed)); + history.push(getCommonPagePath(lastCommonIdFromFeed.id)); } else { openSidenav(); } @@ -105,18 +100,6 @@ const LayoutTabs: FC = (props) => { } }; - useEffect(() => { - if ( - matchOneOfRoutes( - history.location.pathname, - [ROUTE_PATHS.COMMON, ROUTE_PATHS.V04_COMMON], - { exact: false }, - ) - ) { - dispatch(setLastCommonIdFromFeed(commonIdFromUrl)); - } - }, [commonIdFromUrl]); - return ( (); -export const setLastCommonIdFromFeed = createStandardAction( - CommonLayoutActionType.SET_LAST_COMMON_ID_FROM_FEED, -)(); +export const setLastCommonFromFeed = createStandardAction( + CommonLayoutActionType.SET_LAST_COMMON_FROM_FEED, +)(); export const clearData = createStandardAction( CommonLayoutActionType.CLEAR_DATA, diff --git a/src/store/states/commonLayout/constants.ts b/src/store/states/commonLayout/constants.ts index 4f68f889bc..5ac407dafb 100644 --- a/src/store/states/commonLayout/constants.ts +++ b/src/store/states/commonLayout/constants.ts @@ -13,7 +13,7 @@ export enum CommonLayoutActionType { SET_CURRENT_COMMON_ID = "@COMMON_LAYOUT/SET_CURRENT_COMMON_ID", - SET_LAST_COMMON_ID_FROM_FEED = "@COMMON_LAYOUT/SET_LAST_COMMON_ID_FROM_FEED", + SET_LAST_COMMON_FROM_FEED = "@COMMON_LAYOUT/SET_LAST_COMMON_FROM_FEED", CLEAR_DATA = "@COMMON_LAYOUT/CLEAR_DATA", diff --git a/src/store/states/commonLayout/reducer.ts b/src/store/states/commonLayout/reducer.ts index 6c50f3b7b6..5b718e6a84 100644 --- a/src/store/states/commonLayout/reducer.ts +++ b/src/store/states/commonLayout/reducer.ts @@ -9,7 +9,7 @@ type Action = ActionType; const initialState: CommonLayoutState = { currentCommonId: null, - lastCommonIdFromFeed: null, + lastCommonFromFeed: null, commons: [], areCommonsLoading: false, areCommonsFetched: false, @@ -124,9 +124,9 @@ export const reducer = createReducer(initialState) nextState.currentCommonId = payload; }), ) - .handleAction(actions.setLastCommonIdFromFeed, (state, { payload }) => + .handleAction(actions.setLastCommonFromFeed, (state, { payload }) => produce(state, (nextState) => { - nextState.lastCommonIdFromFeed = payload; + nextState.lastCommonFromFeed = payload; }), ) .handleAction(actions.clearData, (state) => diff --git a/src/store/states/commonLayout/selectors.ts b/src/store/states/commonLayout/selectors.ts index 14eae9ebea..3906927769 100644 --- a/src/store/states/commonLayout/selectors.ts +++ b/src/store/states/commonLayout/selectors.ts @@ -6,8 +6,8 @@ const selectCommonLayout = (state: AppState) => state.commonLayout; export const selectCommonLayoutCommonId = (state: AppState) => state.commonLayout.currentCommonId; -export const selectCommonLayoutLastCommonIdFromFeed = (state: AppState) => - state.commonLayout.lastCommonIdFromFeed; +export const selectCommonLayoutLastCommonFromFeed = (state: AppState) => + state.commonLayout.lastCommonFromFeed; export const selectCommonLayoutCommons = (state: AppState) => state.commonLayout.commons; diff --git a/src/store/states/commonLayout/types.ts b/src/store/states/commonLayout/types.ts index f473a76ee1..64af0fd0a8 100644 --- a/src/store/states/commonLayout/types.ts +++ b/src/store/states/commonLayout/types.ts @@ -2,7 +2,15 @@ import { ProjectsStateItem } from "../projects"; export interface CommonLayoutState { currentCommonId: string | null; - lastCommonIdFromFeed: string | null; + lastCommonFromFeed: { + id: string; + data: { + name: string; + image: string; + isProject: boolean; + memberCount: number; + } | null; + } | null; commons: ProjectsStateItem[]; areCommonsLoading: boolean; areCommonsFetched: boolean; From 1120402829cab10b6df92b18d1019c4f3874f2ea Mon Sep 17 00:00:00 2001 From: Roie Natan Date: Thu, 5 Oct 2023 12:11:09 +0300 Subject: [PATCH 06/68] use discussionMessagesData to detrmine --- .../ChatComponent/ChatComponent.tsx | 10 +++--- .../components/ChatContent/ChatContent.tsx | 32 ++----------------- 2 files changed, 7 insertions(+), 35 deletions(-) diff --git a/src/pages/common/components/ChatComponent/ChatComponent.tsx b/src/pages/common/components/ChatComponent/ChatComponent.tsx index 52337bb88c..c9bab445e7 100644 --- a/src/pages/common/components/ChatComponent/ChatComponent.tsx +++ b/src/pages/common/components/ChatComponent/ChatComponent.tsx @@ -49,7 +49,6 @@ import { TextEditorSize, removeTextEditorEmptyEndLinesValues, countTextEditorEmojiElements, - Loader, } from "@/shared/ui-kit"; import { getUserName, hasPermission, isMobile } from "@/shared/utils"; import { @@ -651,10 +650,6 @@ export default function ChatComponent({ type={type} commonMember={commonMember} governanceCircles={governanceCircles} - isCommonMemberFetched={isCommonMemberFetched} - isJoiningPending={false} - hasAccess={hasAccess} - isHidden={false} chatWrapperId={chatWrapperId} messages={messages} dateList={dateList} @@ -669,7 +664,10 @@ export default function ChatComponent({ onUserClick={onUserClick} onFeedItemClick={onFeedItemClick} onInternalLinkClick={onInternalLinkClick} - messageCount={discussion?.messageCount} + isEmpty={ + discussionMessagesData.fetched && + !discussionMessagesData.data?.length + } // not using messageCount because it includes the deleted messages as well. />
diff --git a/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx b/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx index 6b4042844c..f8775030d4 100644 --- a/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx +++ b/src/pages/common/components/ChatComponent/components/ChatContent/ChatContent.tsx @@ -11,7 +11,6 @@ import { useSelector } from "react-redux"; import { scroller, animateScroll } from "react-scroll"; import { v4 as uuidv4 } from "uuid"; import { selectUser } from "@/pages/Auth/store/selectors"; -import { EmptyTabComponent } from "@/pages/OldCommon/components/CommonDetailContainer"; import { ChatMessage, InternalLinkData } from "@/shared/components"; import { ChatType, @@ -42,10 +41,6 @@ interface ChatContentInterface { type: ChatType; commonMember: CommonMember | null; governanceCircles?: Circles; - isCommonMemberFetched: boolean; - isJoiningPending?: boolean; - hasAccess: boolean; - isHidden: boolean; chatWrapperId: string; messages: Record; dateList: string[]; @@ -60,7 +55,7 @@ interface ChatContentInterface { onUserClick?: (userId: string) => void; onFeedItemClick?: (feedItemId: string) => void; onInternalLinkClick?: (data: InternalLinkData) => void; - messageCount?: number; + isEmpty?: boolean; } const isToday = (someDate: Date) => { @@ -80,10 +75,6 @@ const ChatContent: ForwardRefRenderFunction< type, commonMember, governanceCircles, - isCommonMemberFetched, - isJoiningPending, - hasAccess, - isHidden, chatWrapperId, messages, dateList, @@ -98,7 +89,7 @@ const ChatContent: ForwardRefRenderFunction< onUserClick, onFeedItemClick, onInternalLinkClick, - messageCount, + isEmpty, }, chatContentRef, ) => { @@ -195,23 +186,6 @@ const ChatContent: ForwardRefRenderFunction< [scrollToContainerBottom], ); - if (!hasAccess || isHidden) { - return ( -