Invalidate queries

This commit adds the functionality of query invalidation
- when a config is created
- when the calendar options are changed

It also makes it so the calendar doesn't update if the widget is currently being edited
This commit is contained in:
ajnart
2023-05-15 16:20:48 +09:00
parent 92e8d79c5a
commit 3efe18d06f
2 changed files with 12 additions and 3 deletions

View File

@@ -4,6 +4,7 @@ import { useMutation } from '@tanstack/react-query';
import { useTranslation } from 'next-i18next';
import { useConfigContext } from '../../../config/provider';
import { ConfigType } from '../../../types/config';
import { queryClient } from '../../server/configurations/tanstack/queryClient.tool';
export const useCopyConfigMutation = (configName: string) => {
const { config } = useConfigContext();
@@ -14,13 +15,15 @@ export const useCopyConfigMutation = (configName: string) => {
mutationFn: () => fetchCopy(configName, config),
onSuccess() {
showNotification({
title: t('modal.events.configCopied.title'),
title: t('modal.copy.events.configCopied.title'),
icon: <IconCheck />,
color: 'green',
autoClose: 1500,
radius: 'md',
message: t('modal.events.configCopied.message', { configName }),
message: t('modal.copy.events.configCopied.message', { configName }),
});
// Invalidate a query to fetch new config
queryClient.invalidateQueries(['config/get-all']);
},
onError() {
showNotification({

View File

@@ -10,6 +10,7 @@ import { IWidget } from '../widgets';
import { CalendarDay } from './CalendarDay';
import { getBgColorByDateAndTheme } from './bg-calculator';
import { MediasType } from './type';
import { useEditModeStore } from '../../components/Dashboard/Views/useEditModeStore';
const definition = defineWidget({
id: 'calendar',
@@ -52,10 +53,15 @@ function CalendarTile({ widget }: CalendarTileProps) {
const { colorScheme } = useMantineTheme();
const { name: configName } = useConfigContext();
const [month, setMonth] = useState(new Date());
const isEditMode = useEditModeStore((x) => x.enabled);
const { data: medias } = useQuery({
queryKey: ['calendar/medias', { month: month.getMonth(), year: month.getFullYear() }],
queryKey: [
'calendar/medias',
{ month: month.getMonth(), year: month.getFullYear(), v4: widget.properties.useSonarrv4 },
],
staleTime: 1000 * 60 * 60 * 5,
enabled: isEditMode === false,
queryFn: async () =>
(await (
await fetch(