Files
Neon-Desk/components/charts/hooks/use-chart-zoom.ts

45 lines
1.0 KiB
TypeScript

import { useState, useCallback } from 'react';
import type { ChartZoomState } from '@/lib/types';
export function useChartZoom(dataLength: number) {
const [zoomState, setZoomState] = useState<ChartZoomState>({
startIndex: 0,
endIndex: Math.max(0, dataLength - 1),
isZoomed: false
});
const handleZoomChange = useCallback(
(brushData: { startIndex?: number; endIndex?: number }) => {
if (
brushData.startIndex === undefined ||
brushData.endIndex === undefined
) {
return;
}
setZoomState({
startIndex: brushData.startIndex,
endIndex: brushData.endIndex,
isZoomed:
brushData.startIndex !== 0 ||
brushData.endIndex !== dataLength - 1
});
},
[dataLength]
);
const resetZoom = useCallback(() => {
setZoomState({
startIndex: 0,
endIndex: Math.max(0, dataLength - 1),
isZoomed: false
});
}, [dataLength]);
return {
zoomState,
handleZoomChange,
resetZoom
};
}