resize delay

This commit is contained in:
Nate Kelley 2025-03-21 22:06:11 -06:00
parent 83e9b0b1b5
commit 9afb0c1006
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
4 changed files with 55 additions and 63 deletions

View File

@ -1,4 +1,3 @@
export * from './interfaces';
export * from './requests';
export * from './queryRequests';
export * from './queryRequestsClient';

View File

@ -15,7 +15,7 @@ import {
updateMetricShare
} from './requests';
import type { GetMetricParams, ListMetricsParams } from './interfaces';
import { upgradeMetricToIMetric } from '@/lib/metrics';
import { prepareMetricUpdateMetric, upgradeMetricToIMetric } from '@/lib/metrics';
import { metricsQueryKeys } from '@/api/query_keys/metric';
import { collectionQueryKeys } from '@/api/query_keys/collection';
import { useMemo } from 'react';
@ -327,3 +327,56 @@ export const useUpdateMetricShare = () => {
}
});
};
export const useUpdateMetric = () => {
const queryClient = useQueryClient();
const { mutateAsync: saveMetric } = useSaveMetric();
const { run: saveMetricDebounced } = useDebounceFn(
(newMetric: IBusterMetric, prevMetric: IBusterMetric) => {
const changedValues = prepareMetricUpdateMetric(newMetric, prevMetric);
if (changedValues) {
saveMetric(changedValues);
}
},
{ wait: 650 }
);
const combineAndSaveMetric = useMemoizedFn(
async (newMetricPartial: Partial<IBusterMetric> & { id: string }) => {
const metricId = newMetricPartial.id;
const options = metricsQueryKeys.metricsGetMetric(metricId);
const prevMetric = queryClient.getQueryData(options.queryKey);
const newMetric = create(prevMetric, (draft) => {
Object.assign(draft || {}, newMetricPartial);
});
if (prevMetric && newMetric) {
queryClient.setQueryData(options.queryKey, newMetric);
}
return { newMetric, prevMetric };
}
);
const mutationFn = useMemoizedFn(
async (newMetricPartial: Partial<IBusterMetric> & { id: string }) => {
const { newMetric, prevMetric } = await combineAndSaveMetric(newMetricPartial);
if (newMetric && prevMetric) {
saveMetricDebounced(newMetric, prevMetric);
}
return Promise.resolve(newMetric!);
}
);
const mutationRes = useMutation({
mutationFn: mutationFn,
onSuccess: (data) => {
if (data) {
queryClient.setQueryData(metricsQueryKeys.metricsGetMetric(data.id).queryKey, data);
}
}
});
return mutationRes;
};

View File

@ -1,60 +0,0 @@
import { IBusterMetric } from '@/api/asset_interfaces';
import { queryKeys } from '@/api/query_keys';
import { useMemoizedFn, useDebounceFn } from '@/hooks';
import { prepareMetricUpdateMetric } from '@/lib/metrics';
import { useQueryClient, useMutation } from '@tanstack/react-query';
import { useSaveMetric } from './queryRequests';
import { create } from 'mutative';
/**
* This is a mutation that updates a metric.
* It will create a new metric with the new values combined with the old values and save it to the server.
* It will also strip out any values that are not changed from the DEFAULT_CHART_CONFIG.
* It will also update the draft_session_id if it exists.
*/
export const useUpdateMetric = () => {
const queryClient = useQueryClient();
const { mutateAsync: saveMetric } = useSaveMetric();
const { run: saveMetricDebounced } = useDebounceFn(
(newMetric: IBusterMetric, prevMetric: IBusterMetric) => {
const changedValues = prepareMetricUpdateMetric(newMetric, prevMetric);
if (changedValues) {
saveMetric(changedValues);
}
},
{ wait: 650 }
);
const combineAndSaveMetric = useMemoizedFn(
async (newMetricPartial: Partial<IBusterMetric> & { id: string }) => {
const metricId = newMetricPartial.id;
const options = queryKeys.metricsGetMetric(metricId);
const prevMetric = queryClient.getQueryData(options.queryKey);
const newMetric = create(prevMetric, (draft) => {
Object.assign(draft || {}, newMetricPartial);
});
if (prevMetric && newMetric) {
queryClient.setQueryData(options.queryKey, newMetric);
}
return { newMetric, prevMetric };
}
);
const mutationFn = useMemoizedFn(
async (newMetricPartial: Partial<IBusterMetric> & { id: string }) => {
const { newMetric, prevMetric } = await combineAndSaveMetric(newMetricPartial);
if (newMetric && prevMetric) {
saveMetricDebounced(newMetric, prevMetric);
}
return Promise.resolve(newMetric!);
}
);
const mutationRes = useMutation({
mutationFn: mutationFn
});
return mutationRes;
};

View File

@ -69,7 +69,7 @@ ChartJS.register(
);
ChartJS.defaults.responsive = true;
ChartJS.defaults.resizeDelay = 50;
ChartJS.defaults.resizeDelay = 5;
ChartJS.defaults.maintainAspectRatio = false;
ChartJS.defaults.color = color;
ChartJS.defaults.backgroundColor = DEFAULT_CHART_THEME;