Add utils/queries, refactor streaming

This commit is contained in:
Alex Gleason 2022-09-22 16:28:05 -05:00
parent c12999a438
commit 075cb15940
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
3 changed files with 48 additions and 27 deletions

View file

@ -1,6 +1,6 @@
import { getSettings } from 'soapbox/actions/settings';
import messages from 'soapbox/locales/messages';
import { queryClient } from 'soapbox/queries/client';
import { updatePageItem, appendPageItem } from 'soapbox/utils/queries';
import { play, soundCache } from 'soapbox/utils/sounds';
import { connectStream } from '../stream';
@ -24,8 +24,6 @@ import {
processTimelineUpdate,
} from './timelines';
import type { InfiniteData } from '@tanstack/react-query';
import type { PaginatedResult } from 'soapbox/queries/chats';
import type { AppDispatch, RootState } from 'soapbox/store';
import type { APIEntity, Chat, ChatMessage } from 'soapbox/types/entities';
@ -56,24 +54,10 @@ interface ChatPayload extends Omit<Chat, 'last_message'> {
const updateChat = (payload: ChatPayload) => {
const { last_message: lastMessage } = payload;
queryClient.setQueriesData<InfiniteData<PaginatedResult<Chat>>>(['chats', 'search'], (data) => {
if (data) {
const pages = data.pages.map(page => {
const result = page.result.map(chat => chat.id === payload.id ? payload as any : chat);
return { ...page, result };
});
return { ...data, pages };
}
});
updatePageItem<Chat>(['chats', 'search'], payload as any, (o, n) => o.id === n.id);
if (lastMessage) {
queryClient.setQueryData<InfiniteData<PaginatedResult<ChatMessage>>>(['chats', 'messages', payload.id], (data) => {
if (data) {
const pages = [...data.pages];
pages[0] = { ...pages[0], result: [...pages[0].result, lastMessage] };
return { ...data, pages };
}
});
appendPageItem(['chats', 'messages', payload.id], lastMessage);
}
};

View file

@ -8,6 +8,7 @@ import compareId from 'soapbox/compare_id';
import { useChatContext } from 'soapbox/contexts/chat-context';
import { useApi, useAppDispatch, useFeatures } from 'soapbox/hooks';
import { normalizeChatMessage } from 'soapbox/normalizers';
import { flattenPages } from 'soapbox/utils/queries';
import { queryClient } from './client';
@ -88,10 +89,7 @@ const useChatMessages = (chatId: string) => {
},
});
const data = queryInfo.data?.pages.reduce<IChatMessage[]>(
(prev: IChatMessage[], curr) => [...curr.result, ...prev],
[],
);
const data = flattenPages(queryInfo);
return {
...queryInfo,
@ -139,10 +137,7 @@ const useChats = (search?: string) => {
},
});
const data = queryInfo.data?.pages.reduce<IChat[]>(
(prev: IChat[], curr) => [...prev, ...curr.result],
[],
);
const data = flattenPages(queryInfo);
const chatsQuery = {
...queryInfo,

View file

@ -0,0 +1,42 @@
import { queryClient } from 'soapbox/queries/client';
import type { InfiniteData, QueryKey, UseInfiniteQueryResult } from '@tanstack/react-query';
import type { PaginatedResult } from 'soapbox/queries/chats';
/** Flatten paginated results into a single array. */
const flattenPages = <T>(queryInfo: UseInfiniteQueryResult<PaginatedResult<T>>) => {
return queryInfo.data?.pages.reduce<T[]>(
(prev: T[], curr) => [...prev, ...curr.result],
[],
);
};
/** Traverse pages and update the item inside if found. */
const updatePageItem = <T>(queryKey: QueryKey, newItem: T, isItem: (item: T, newItem: T) => boolean) => {
queryClient.setQueriesData<InfiniteData<PaginatedResult<T>>>(queryKey, (data) => {
if (data) {
const pages = data.pages.map(page => {
const result = page.result.map(item => isItem(item, newItem) ? newItem : item);
return { ...page, result };
});
return { ...data, pages };
}
});
};
/** Insert the new item at the beginning of the first page. */
const appendPageItem = <T>(queryKey: QueryKey, newItem: T) => {
queryClient.setQueryData<InfiniteData<PaginatedResult<T>>>(queryKey, (data) => {
if (data) {
const pages = [...data.pages];
pages[0] = { ...pages[0], result: [...pages[0].result, newItem] };
return { ...data, pages };
}
});
};
export {
flattenPages,
updatePageItem,
appendPageItem,
};