watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2025-12-06 01:18:00 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

fix: skip realtime chart animation when data unchanged

Browse source
This commit is contained in:
Arthur Sepiol 2025-11-28 02:17:16 +03:00
parent a19b92a5cb
commit f5b5f159ec
1 changed files with 11 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/metrics/RealtimeChart.tsx
View file

@ -16,6 +16,7 @@ export function RealtimeChart({ data, unit, ...props }: RealtimeChartProps) {
const endDate = startOfMinute(new Date());
const startDate = subMinutes(endDate, REALTIME_RANGE);
const prevEndDate = useRef(endDate);
const prevData = useRef<string | null>(null);
const chartData = useMemo(() => {
if (!data) {
@ -28,14 +29,22 @@ export function RealtimeChart({ data, unit, ...props }: RealtimeChartProps) {
};
}, [data, startDate, endDate, unit]);
// Don't animate the bars shifting over because it looks weird
const animationDuration = useMemo(() => {
// Don't animate the bars shifting over because it looks weird
if (isBefore(prevEndDate.current, endDate)) {
prevEndDate.current = endDate;
return 0;
}
// Don't animate when data hasn't changed
const serialized = JSON.stringify(chartData);
if (prevData.current === serialized) {
return 0;
}
prevData.current = serialized;
return DEFAULT_ANIMATION_DURATION;
}, [endDate]);
}, [endDate, chartData]);
return (
<PageviewsChart