♻️(frontend) use dedicated favorite_list route
It exists a dedicated endpoint to list favorite documents. Better use it to avoid relying on the general documents listing endpoint.
This commit is contained in:
committed by
Manuel Raynaud
parent
668d7cd404
commit
f81db395ef
@@ -19,6 +19,7 @@ import {
|
||||
Doc,
|
||||
KEY_DOC,
|
||||
KEY_LIST_DOC,
|
||||
KEY_LIST_FAVORITE_DOC,
|
||||
ModalRemoveDoc,
|
||||
getEmojiAndTitle,
|
||||
useCopyDocLink,
|
||||
@@ -67,10 +68,10 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
|
||||
},
|
||||
});
|
||||
const removeFavoriteDoc = useDeleteFavoriteDoc({
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_DOC],
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_DOC, KEY_LIST_FAVORITE_DOC],
|
||||
});
|
||||
const makeFavoriteDoc = useCreateFavoriteDoc({
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_DOC],
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_DOC, KEY_LIST_FAVORITE_DOC],
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
@@ -5,6 +5,7 @@ export * from './useDeleteFavoriteDoc';
|
||||
export * from './useDoc';
|
||||
export * from './useDocOptions';
|
||||
export * from './useDocs';
|
||||
export * from './useDocsFavorite';
|
||||
export * from './useDuplicateDoc';
|
||||
export * from './useRestoreDoc';
|
||||
export * from './useSubDocs';
|
||||
|
||||
@@ -0,0 +1,72 @@
|
||||
import { UseQueryOptions, useQuery } from '@tanstack/react-query';
|
||||
|
||||
import {
|
||||
APIError,
|
||||
APIList,
|
||||
InfiniteQueryConfig,
|
||||
errorCauses,
|
||||
fetchAPI,
|
||||
useAPIInfiniteQuery,
|
||||
} from '@/api';
|
||||
|
||||
import { Doc } from '../types';
|
||||
|
||||
export type DocsFavoriteParams = {
|
||||
page: number;
|
||||
};
|
||||
|
||||
export type DocsFavoriteResponse = APIList<Doc>;
|
||||
export const getDocsFavorite = async (
|
||||
params: DocsFavoriteParams,
|
||||
): Promise<DocsFavoriteResponse> => {
|
||||
const searchParams = new URLSearchParams();
|
||||
|
||||
if (params.page) {
|
||||
searchParams.set('page', params.page.toString());
|
||||
}
|
||||
|
||||
const response = await fetchAPI(
|
||||
`documents/favorite_list/?${searchParams.toString()}`,
|
||||
);
|
||||
|
||||
if (!response.ok) {
|
||||
throw new APIError(
|
||||
'Failed to get the favorite docs',
|
||||
await errorCauses(response),
|
||||
);
|
||||
}
|
||||
|
||||
return response.json() as Promise<DocsFavoriteResponse>;
|
||||
};
|
||||
|
||||
export const KEY_LIST_FAVORITE_DOC = 'docs_favorite_list';
|
||||
|
||||
type UseDocsOptions = UseQueryOptions<
|
||||
DocsFavoriteResponse,
|
||||
APIError,
|
||||
DocsFavoriteResponse
|
||||
>;
|
||||
type UseInfiniteDocsOptions = InfiniteQueryConfig<DocsFavoriteResponse>;
|
||||
|
||||
export function useDocsFavorite(
|
||||
params: DocsFavoriteParams,
|
||||
queryConfig?: UseDocsOptions,
|
||||
) {
|
||||
return useQuery<DocsFavoriteResponse, APIError, DocsFavoriteResponse>({
|
||||
queryKey: [KEY_LIST_FAVORITE_DOC, params],
|
||||
queryFn: () => getDocsFavorite(params),
|
||||
...queryConfig,
|
||||
});
|
||||
}
|
||||
|
||||
export const useInfiniteDocsFavorite = (
|
||||
params: DocsFavoriteParams,
|
||||
queryConfig?: UseInfiniteDocsOptions,
|
||||
) => {
|
||||
return useAPIInfiniteQuery(
|
||||
KEY_LIST_FAVORITE_DOC,
|
||||
getDocsFavorite,
|
||||
params,
|
||||
queryConfig,
|
||||
);
|
||||
};
|
||||
@@ -6,6 +6,7 @@ import { DropdownMenu, DropdownMenuOption, Icon } from '@/components';
|
||||
import {
|
||||
Doc,
|
||||
KEY_LIST_DOC,
|
||||
KEY_LIST_FAVORITE_DOC,
|
||||
ModalRemoveDoc,
|
||||
useCreateFavoriteDoc,
|
||||
useDeleteFavoriteDoc,
|
||||
@@ -27,10 +28,10 @@ export const DocsGridActions = ({
|
||||
const { mutate: duplicateDoc } = useDuplicateDoc();
|
||||
|
||||
const removeFavoriteDoc = useDeleteFavoriteDoc({
|
||||
listInvalidQueries: [KEY_LIST_DOC],
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_LIST_FAVORITE_DOC],
|
||||
});
|
||||
const makeFavoriteDoc = useCreateFavoriteDoc({
|
||||
listInvalidQueries: [KEY_LIST_DOC],
|
||||
listInvalidQueries: [KEY_LIST_DOC, KEY_LIST_FAVORITE_DOC],
|
||||
});
|
||||
|
||||
const options: DropdownMenuOption[] = [
|
||||
|
||||
@@ -2,7 +2,7 @@ import { useTranslation } from 'react-i18next';
|
||||
|
||||
import { Box, HorizontalSeparator, InfiniteScroll, Text } from '@/components';
|
||||
import { useCunninghamTheme } from '@/cunningham';
|
||||
import { useInfiniteDocs } from '@/docs/doc-management';
|
||||
import { useInfiniteDocsFavorite } from '@/docs/doc-management';
|
||||
|
||||
import { LeftPanelFavoriteItem } from './LeftPanelFavoriteItem';
|
||||
|
||||
@@ -11,9 +11,8 @@ export const LeftPanelFavorites = () => {
|
||||
|
||||
const { spacingsTokens } = useCunninghamTheme();
|
||||
|
||||
const docs = useInfiniteDocs({
|
||||
const docs = useInfiniteDocsFavorite({
|
||||
page: 1,
|
||||
is_favorite: true,
|
||||
});
|
||||
|
||||
const favoriteDocs = docs.data?.pages.flatMap((page) => page.results) || [];
|
||||
|
||||
Reference in New Issue
Block a user