From dfdbf6cac1fe3719dc71e130129d28e04ba4e225 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Fri, 1 Dec 2023 13:26:44 +0100 Subject: refactor(pages): refine Thematic pages * add a table of contents (however posts heading are not included) * rename posts list section title * add a useThematic hook to refresh thematic contents * add a useThematicLists hook to refresh thematics list * add a `notIn` filter in thematics list fetcher to directly remove unwanted thematics * add Cypress tests --- .../hooks/use-thematics-list/use-thematics-list.ts | 50 ++++++++++++++++++++++ 1 file changed, 50 insertions(+) create mode 100644 src/utils/hooks/use-thematics-list/use-thematics-list.ts (limited to 'src/utils/hooks/use-thematics-list/use-thematics-list.ts') diff --git a/src/utils/hooks/use-thematics-list/use-thematics-list.ts b/src/utils/hooks/use-thematics-list/use-thematics-list.ts new file mode 100644 index 0000000..f63815a --- /dev/null +++ b/src/utils/hooks/use-thematics-list/use-thematics-list.ts @@ -0,0 +1,50 @@ +import useSWR from 'swr'; +import { + type FetchThematicsListInput, + fetchThematicsList, +} from '../../../services/graphql'; +import type { + GraphQLConnection, + Maybe, + WPThematicPreview, +} from '../../../types'; + +export type UseThematicsListReturn< + T extends Maybe>, +> = { + isError: boolean; + isLoading: boolean; + isValidating: boolean; + thematics: T extends undefined + ? Maybe> + : GraphQLConnection; +}; + +export type UseThematicsListConfig< + T extends Maybe>, +> = { + input?: FetchThematicsListInput; + fallback?: T; +}; + +export const useThematicsList = < + T extends Maybe>, +>( + config?: UseThematicsListConfig +): UseThematicsListReturn => { + const { fallback, input } = config ?? {}; + const { data, error, isLoading, isValidating } = useSWR( + input ?? {}, + fetchThematicsList, + { fallbackData: fallback } + ); + + if (error) console.error(error); + + return { + isError: !!error, + isLoading, + isValidating, + thematics: data, + } as UseThematicsListReturn; +}; -- cgit v1.2.3