mirror of https://github.com/buster-so/buster.git
resize delay
This commit is contained in:
parent
83e9b0b1b5
commit
9afb0c1006
|
@ -1,4 +1,3 @@
|
||||||
export * from './interfaces';
|
export * from './interfaces';
|
||||||
export * from './requests';
|
export * from './requests';
|
||||||
export * from './queryRequests';
|
export * from './queryRequests';
|
||||||
export * from './queryRequestsClient';
|
|
||||||
|
|
|
@ -15,7 +15,7 @@ import {
|
||||||
updateMetricShare
|
updateMetricShare
|
||||||
} from './requests';
|
} from './requests';
|
||||||
import type { GetMetricParams, ListMetricsParams } from './interfaces';
|
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 { metricsQueryKeys } from '@/api/query_keys/metric';
|
||||||
import { collectionQueryKeys } from '@/api/query_keys/collection';
|
import { collectionQueryKeys } from '@/api/query_keys/collection';
|
||||||
import { useMemo } from 'react';
|
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;
|
||||||
|
};
|
||||||
|
|
|
@ -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;
|
|
||||||
};
|
|
|
@ -69,7 +69,7 @@ ChartJS.register(
|
||||||
);
|
);
|
||||||
|
|
||||||
ChartJS.defaults.responsive = true;
|
ChartJS.defaults.responsive = true;
|
||||||
ChartJS.defaults.resizeDelay = 50;
|
ChartJS.defaults.resizeDelay = 5;
|
||||||
ChartJS.defaults.maintainAspectRatio = false;
|
ChartJS.defaults.maintainAspectRatio = false;
|
||||||
ChartJS.defaults.color = color;
|
ChartJS.defaults.color = color;
|
||||||
ChartJS.defaults.backgroundColor = DEFAULT_CHART_THEME;
|
ChartJS.defaults.backgroundColor = DEFAULT_CHART_THEME;
|
||||||
|
|
Loading…
Reference in New Issue