query key problem
import { ContentType } from "../types/content";
export const contentKeys = {
all: ["contents"] as const,
lists: () => [...contentKeys.all] as const,
list: (filters: string) => [...contentKeys.lists(), { filters }] as const,
details: () => [...contentKeys.all, "detail"] as const,
detail: (slug: string) => [...contentKeys.details(), slug] as const,
info: ({
label,
contentId,
contentType,
}: {
contentId: string;
contentType: ContentType;
label: "attachments" | "industries" | "tags" | "scenarios";
}) => [...contentKeys.all, contentId, contentType, label] as const,
};
export const useFetchContents = (args: { enabled?: boolean } = {}) => {
return useQuery({
queryKey: contentKeys.list(JSON.stringify({ isStandalone: true })),
queryFn: fetchContents,
enabled: args.enabled,
});
};
export const useCreateContent = (
args: {
onSuccess?: (data: Content) => void;
onError?: (error: Error) => void;
} = {},
) => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: createContent,
onSuccess: (data) => {
queryClient.setQueryData<Content[]>(
contentKeys.all,
(currentContentsQueryCache) => {
if (!currentContentsQueryCache) return [data];
return [data, ...currentContentsQueryCache];
},
);
if (args.onSuccess) args.onSuccess(data);
},
onError: args.onError,
});
};
here the problem i am facing is i m fetching content with this key contentKeys.list(JSON.stringify({ isStandalone: true })) and somewhere else with this key contentKeys.all
but i am using the same useCreateContent everywhere here i am facing problem what key to use when setting query data i want useCreateContent to work everywhere and update when i am using setQueryData
export const contentKeys = {
all: ["contents"] as const,
lists: () => [...contentKeys.all] as const,
list: (filters: string) => [...contentKeys.lists(), { filters }] as const,
details: () => [...contentKeys.all, "detail"] as const,
detail: (slug: string) => [...contentKeys.details(), slug] as const,
info: ({
label,
contentId,
contentType,
}: {
contentId: string;
contentType: ContentType;
label: "attachments" | "industries" | "tags" | "scenarios";
}) => [...contentKeys.all, contentId, contentType, label] as const,
};
export const useFetchContents = (args: { enabled?: boolean } = {}) => {
return useQuery({
queryKey: contentKeys.list(JSON.stringify({ isStandalone: true })),
queryFn: fetchContents,
enabled: args.enabled,
});
};
export const useCreateContent = (
args: {
onSuccess?: (data: Content) => void;
onError?: (error: Error) => void;
} = {},
) => {
const queryClient = useQueryClient();
return useMutation({
mutationFn: createContent,
onSuccess: (data) => {
queryClient.setQueryData<Content[]>(
contentKeys.all,
(currentContentsQueryCache) => {
if (!currentContentsQueryCache) return [data];
return [data, ...currentContentsQueryCache];
},
);
if (args.onSuccess) args.onSuccess(data);
},
onError: args.onError,
});
};
here the problem i am facing is i m fetching content with this key contentKeys.list(JSON.stringify({ isStandalone: true })) and somewhere else with this key contentKeys.all
but i am using the same useCreateContent everywhere here i am facing problem what key to use when setting query data i want useCreateContent to work everywhere and update when i am using setQueryData
