Skip to content

Commit

Permalink
Merge pull request #2301 from daostack/feature/CW-2288-inbox-feed-cac…
Browse files Browse the repository at this point in the history
…hing

Use caching to load inbox and feed faster #2288
  • Loading branch information
andreymikhadyuk authored Nov 13, 2023
2 parents 5f5f58c + aca420c commit a363e60
Show file tree
Hide file tree
Showing 37 changed files with 602 additions and 113 deletions.
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,7 @@
"react-virtualized": "^9.22.3",
"react-zoom-pan-pinch": "^3.2.0",
"redux": "^4.0.4",
"redux-persist": "^6.0.0",
"redux-saga": "^1.1.3",
"reselect": "^4.0.0",
"slate": "^0.94.1",
Expand Down
7 changes: 5 additions & 2 deletions src/pages/App/AppWrapper.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
import React, { FC } from "react";
import { Provider } from "react-redux";
import { store } from "@/shared/appConfig";
import { PersistGate } from "redux-persist/integration/react";
import { store, persistor } from "@/shared/appConfig";
import { NotificationProvider } from "./providers";

const AppWrapper: FC = ({ children }) => (
<Provider store={store}>
<NotificationProvider>{children}</NotificationProvider>
<PersistGate loading={null} persistor={persistor}>
<NotificationProvider>{children}</NotificationProvider>
</PersistGate>
</Provider>
);

Expand Down
20 changes: 18 additions & 2 deletions src/pages/Auth/store/saga.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@ import { getProvider } from "@/shared/utils/authProvider";
import { getFundingRequestNotification } from "@/shared/utils/notifications";
import {
cacheActions,
commonActions,
commonLayoutActions,
inboxActions,
multipleSpacesLayoutActions,
} from "@/store/states";
import {
Expand Down Expand Up @@ -301,6 +303,16 @@ const updateUserData = async (user: User): Promise<User> => {
});
};

const resetGlobalData = (fullReset: boolean) => {
if (fullReset) {
store.dispatch(multipleSpacesLayoutActions.resetMultipleSpacesLayout());
store.dispatch(commonLayoutActions.clearData());
}
store.dispatch(inboxActions.resetInbox());
store.dispatch(cacheActions.resetFeedStates());
store.dispatch(commonActions.resetCommon());
};

function* socialLoginSaga({
payload,
}: ReturnType<typeof actions.socialLogin.request>) {
Expand Down Expand Up @@ -465,8 +477,6 @@ function* logOut() {
window.ReactNativeWebView.postMessage(WebviewActions.logout);
}

yield put(multipleSpacesLayoutActions.resetMultipleSpacesLayout());
yield put(commonLayoutActions.clearData());
history.push(ROUTE_PATHS.HOME);
yield true;
}
Expand Down Expand Up @@ -567,6 +577,12 @@ function* authSagas() {

firebase.auth().onAuthStateChanged(async (res) => {
try {
const { user: userInStore } = store.getState().auth;

if (userInStore?.uid !== res?.uid) {
resetGlobalData(!res);
}

store.dispatch(
actions.setAuthProvider(
getAuthProviderFromProviderData(res?.providerData),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,9 @@ import { DeletePrompt, GlobalOverlay, ReportModal } from "@/shared/components";
import { EntityTypes } from "@/shared/constants";
import { useModal, useNotification } from "@/shared/hooks";
import {
FeedItemFollowState,
useCommon,
useDiscussionById,
useFeedItemFollow,
useFeedItemUserMetadata,
useUserById,
} from "@/shared/hooks/useCases";
Expand Down Expand Up @@ -63,6 +63,7 @@ interface DiscussionFeedCardProps {
getNonAllowedItems?: GetNonAllowedItemsOptions;
onActiveItemDataChange?: (data: FeedLayoutItemChangeData) => void;
directParent?: DirectParent | null;
feedItemFollow: FeedItemFollowState;
onUserSelect?: (userId: string, commonId?: string) => void;
}

Expand All @@ -89,6 +90,7 @@ const DiscussionFeedCard = forwardRef<FeedItemRef, DiscussionFeedCardProps>(
getNonAllowedItems,
onActiveItemDataChange,
directParent,
feedItemFollow,
onUserSelect,
} = props;
const {
Expand Down Expand Up @@ -124,10 +126,6 @@ const DiscussionFeedCard = forwardRef<FeedItemRef, DiscussionFeedCardProps>(
fetchFeedItemUserMetadata,
} = useFeedItemUserMetadata();
const { data: common } = useCommon(isHome ? commonId : "");
const feedItemFollow = useFeedItemFollow(
{ feedItemId: item.id, commonId },
{ withSubscription: true },
);
const menuItems = useMenuItems(
{
commonId,
Expand Down
29 changes: 26 additions & 3 deletions src/pages/common/components/FeedItem/FeedItem.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React, { forwardRef, memo } from "react";
import React, { forwardRef, memo, useEffect } from "react";
import { useFeedItemFollow } from "@/shared/hooks/useCases";
import { FeedLayoutItemChangeData } from "@/shared/interfaces";
import {
Circles,
Expand Down Expand Up @@ -64,10 +65,31 @@ const FeedItem = forwardRef<FeedItemRef, FeedItemProps>((props, ref) => {
onActiveItemDataChange,
directParent,
} = props;
const { onFeedItemUpdate, getLastMessage, getNonAllowedItems, onUserSelect } =
useFeedItemContext();
const {
onFeedItemUpdate,
onFeedItemUnfollowed,
getLastMessage,
getNonAllowedItems,
onUserSelect,
} = useFeedItemContext();
const feedItemFollow = useFeedItemFollow(
{ feedItemId: item.id, commonId },
{ withSubscription: true },
);
useFeedItemSubscription(item.id, commonId, onFeedItemUpdate);

useEffect(() => {
if (
feedItemFollow.isUserFeedItemFollowDataFetched &&
!feedItemFollow.userFeedItemFollowData
) {
onFeedItemUnfollowed?.(item.id);
}
}, [
feedItemFollow.isUserFeedItemFollowDataFetched,
feedItemFollow.userFeedItemFollowData,
]);

if (
shouldCheckItemVisibility &&
!checkIsItemVisibleForUser(
Expand Down Expand Up @@ -103,6 +125,7 @@ const FeedItem = forwardRef<FeedItemRef, FeedItemProps>((props, ref) => {
isMobileVersion,
onActiveItemDataChange: handleActiveItemDataChange,
directParent,
feedItemFollow,
onUserSelect,
};

Expand Down
1 change: 1 addition & 0 deletions src/pages/common/components/FeedItem/context.ts
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ export interface FeedItemContextValue {
setExpandedFeedItemId?: (feedItemId: string | null) => void;
renderFeedItemBaseContent?: (props: FeedItemBaseContentProps) => ReactNode;
onFeedItemUpdate?: (item: CommonFeed, isRemoved: boolean) => void;
onFeedItemUnfollowed?: (itemId: string) => void;
feedCardSettings?: FeedCardSettings;
getLastMessage: (options: GetLastMessageOptions) => TextEditorValue;
getNonAllowedItems?: GetNonAllowedItemsOptions;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@ import { DeletePrompt, GlobalOverlay } from "@/shared/components";
import { useRoutesContext } from "@/shared/contexts";
import { useForceUpdate, useModal, useNotification } from "@/shared/hooks";
import {
FeedItemFollowState,
useDiscussionById,
useFeedItemFollow,
useFeedItemUserMetadata,
useProposalById,
useUserById,
Expand Down Expand Up @@ -80,6 +80,7 @@ interface ProposalFeedCardProps {
getLastMessage: (options: GetLastMessageOptions) => TextEditorValue;
getNonAllowedItems?: GetNonAllowedItemsOptions;
isMobileVersion?: boolean;
feedItemFollow: FeedItemFollowState;
onActiveItemDataChange?: (data: FeedLayoutItemChangeData) => void;
onUserSelect?: (userId: string, commonId?: string) => void;
}
Expand All @@ -101,6 +102,7 @@ const ProposalFeedCard = forwardRef<FeedItemRef, ProposalFeedCardProps>(
getLastMessage,
getNonAllowedItems,
isMobileVersion,
feedItemFollow,
onActiveItemDataChange,
onUserSelect,
} = props;
Expand Down Expand Up @@ -175,10 +177,6 @@ const ProposalFeedCard = forwardRef<FeedItemRef, ProposalFeedCardProps>(
onOpen: onShareModalOpen,
onClose: onShareModalClose,
} = useModal(false);
const feedItemFollow = useFeedItemFollow(
{ feedItemId: item.id, commonId },
{ withSubscription: true },
);
const menuItems = useMenuItems(
{
commonId,
Expand Down
13 changes: 12 additions & 1 deletion src/pages/commonFeed/CommonFeed.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ import {
getCommonPageAboutTabPath,
} from "@/shared/utils";
import {
cacheActions,
commonActions,
commonLayoutActions,
selectCommonAction,
Expand Down Expand Up @@ -162,7 +163,11 @@ const CommonFeedComponent: FC<CommonFeedProps> = (props) => {
hasMore: hasMoreCommonFeedItems,
fetch: fetchCommonFeedItems,
batchNumber,
} = useCommonFeedItems(commonId, commonFeedItemIdsForNotListening);
} = useCommonFeedItems(
commonId,
commonFeedItemIdsForNotListening,
sharedFeedItemId,
);

const {
isModalOpen: isCommonJoinModalOpen,
Expand Down Expand Up @@ -330,7 +335,13 @@ const CommonFeedComponent: FC<CommonFeedProps> = (props) => {
useEffect(() => {
fetchData();

const interval = setInterval(() => {
dispatch(cacheActions.copyFeedStateByCommonId(commonId));
}, 5000);

return () => {
clearInterval(interval);
dispatch(cacheActions.copyFeedStateByCommonId(commonId));
dispatch(commonActions.resetCommon());
};
}, [commonId]);
Expand Down
4 changes: 4 additions & 0 deletions src/pages/commonFeed/components/FeedLayout/FeedLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,7 @@ interface FeedLayoutProps {
renderFeedItemBaseContent: (props: FeedItemBaseContentProps) => ReactNode;
renderChatChannelItem?: (props: ChatChannelFeedLayoutItemProps) => ReactNode;
onFeedItemUpdate?: (item: CommonFeed, isRemoved: boolean) => void;
onFeedItemUnfollowed?: (itemId: string) => void;
getLastMessage: (options: GetLastMessageOptions) => TextEditorValue;
sharedFeedItemId?: string | null;
emptyText?: string;
Expand Down Expand Up @@ -159,6 +160,7 @@ const FeedLayout: ForwardRefRenderFunction<FeedLayoutRef, FeedLayoutProps> = (
renderFeedItemBaseContent,
renderChatChannelItem,
onFeedItemUpdate,
onFeedItemUnfollowed,
getLastMessage,
sharedFeedItemId,
emptyText,
Expand Down Expand Up @@ -326,13 +328,15 @@ const FeedLayout: ForwardRefRenderFunction<FeedLayoutRef, FeedLayoutProps> = (
setExpandedFeedItemId,
renderFeedItemBaseContent,
onFeedItemUpdate,
onFeedItemUnfollowed,
getLastMessage,
getNonAllowedItems,
onUserSelect: handleUserWithCommonClick,
}),
[
renderFeedItemBaseContent,
onFeedItemUpdate,
onFeedItemUnfollowed,
getLastMessage,
getNonAllowedItems,
handleUserWithCommonClick,
Expand Down
17 changes: 13 additions & 4 deletions src/pages/inbox/BaseInbox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,18 @@ const InboxPage: FC<InboxPageProps> = (props) => {
[dispatch],
);

const handleFeedItemUnfollowed = useCallback(
(itemId: string) => {
dispatch(
inboxActions.updateFeedItem({
item: { id: itemId },
isRemoved: true,
}),
);
},
[dispatch],
);

const handleActiveItemChange = useCallback(
(activeItemId?: string) => {
dispatch(inboxActions.removeEmptyChatChannelItems(activeItemId));
Expand Down Expand Up @@ -221,10 +233,6 @@ const InboxPage: FC<InboxPageProps> = (props) => {

useEffect(() => {
fetchData();

return () => {
dispatch(inboxActions.resetInbox());
};
}, [userId]);

useEffect(() => {
Expand Down Expand Up @@ -271,6 +279,7 @@ const InboxPage: FC<InboxPageProps> = (props) => {
renderFeedItemBaseContent={renderFeedItemBaseContent}
renderChatChannelItem={renderChatChannelItem}
onFeedItemUpdate={handleFeedItemUpdate}
onFeedItemUnfollowed={handleFeedItemUnfollowed}
getLastMessage={getLastMessage}
sharedFeedItemId={sharedFeedItemId}
emptyText={
Expand Down
22 changes: 22 additions & 0 deletions src/services/Chat.ts
Original file line number Diff line number Diff line change
Expand Up @@ -234,6 +234,28 @@ class ChatService {
});
};

public getChatChannels = async (options: {
participantId: string;
startAt?: Timestamp;
endAt?: Timestamp;
}): Promise<ChatChannel[]> => {
const { participantId, startAt, endAt } = options;
let query = this.getChatChannelCollection()
.where("participants", "array-contains", participantId)
.orderBy("updatedAt", "desc");

if (startAt) {
query = query.startAt(startAt);
}
if (endAt) {
query = query.endAt(endAt);
}

const snapshot = await query.get();

return snapshot.docs.map((doc) => doc.data());
};

public subscribeToNewUpdatedChatChannels = (
participantId: string,
endBefore: Timestamp,
Expand Down
23 changes: 23 additions & 0 deletions src/services/FeedItemFollows.ts
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,29 @@ class FeedItemFollowsService {
await Api.post(ApiEndpoint.FollowFeedItem, data, { cancelToken });
};

public getFollowFeedItems = async (options: {
userId: string;
startAt?: Timestamp;
endAt?: Timestamp;
}): Promise<FeedItemFollow[]> => {
const { userId, startAt, endAt } = options;
let query = this.getFeedItemFollowsSubCollection(userId).orderBy(
"lastActivity",
"desc",
);

if (startAt) {
query = query.startAt(startAt);
}
if (endAt) {
query = query.endAt(endAt);
}

const snapshot = await query.get();

return snapshot.docs.map((doc) => doc.data());
};

public subscribeToNewUpdatedFollowFeedItem = (
userId: string,
endBefore: Timestamp,
Expand Down
4 changes: 2 additions & 2 deletions src/shared/appConfig.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import configureStore from "@/store";
import history from "./history";

const { store } = configureStore(history);
const { store, persistor } = configureStore(history);

export { history, store };
export { history, store, persistor };
Loading

0 comments on commit a363e60

Please sign in to comment.