Extract getClientPos helper outside LiveCameraView component

Pure function that normalizes mouse/touch event positions doesn't
depend on component state, so move it outside to avoid recreation
on every render.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ryan Gregg 2026-03-14 05:41:32 +00:00
parent 72abc27488
commit 276075bf39

View File

@ -130,6 +130,19 @@ type LiveCameraViewProps = {
fullscreen: boolean;
toggleFullscreen: () => void;
};
function getClientPos(
e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>,
): { x: number; y: number } | null {
if ("TouchEvent" in window && e.nativeEvent instanceof TouchEvent) {
const touch = e.nativeEvent.touches[0] || e.nativeEvent.changedTouches[0];
if (touch) return { x: touch.clientX, y: touch.clientY };
} else if (e.nativeEvent instanceof MouseEvent) {
return { x: e.nativeEvent.clientX, y: e.nativeEvent.clientY };
}
return null;
}
export default function LiveCameraView({
config,
camera,
@ -230,18 +243,6 @@ export default function LiveCameraView({
} | null>(null);
const isDragging = dragStart !== null && dragCurrent !== null;
const getClientPos = (
e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>,
): { x: number; y: number } | null => {
if ("TouchEvent" in window && e.nativeEvent instanceof TouchEvent) {
const touch = e.nativeEvent.touches[0] || e.nativeEvent.changedTouches[0];
if (touch) return { x: touch.clientX, y: touch.clientY };
} else if (e.nativeEvent instanceof MouseEvent) {
return { x: e.nativeEvent.clientX, y: e.nativeEvent.clientY };
}
return null;
};
const handleOverlayMouseDown = useCallback(
(
e: React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>,