Merge pull request #106 from ibs0d/claude/add-fit-to-screen-mode-XvHoV

Fix fit-to-screen drag reset: use primitive deps in fitLayoutOverride…
This commit is contained in:
ibs0d 2026-03-22 17:52:42 +11:00 committed by GitHub
commit 4f7d3f41b5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -471,7 +471,12 @@ export default function DraggableGridLayout({
useEffect(() => { useEffect(() => {
setFitLayoutOverride(undefined); setFitLayoutOverride(undefined);
}, [fitGridParams, cameras, includeBirdseye]); }, [
fitGridParams?.gridUnitsPerCam,
fitGridParams?.colsPerRow,
cameras,
includeBirdseye,
]);
const handleFitDragStop = useCallback( const handleFitDragStop = useCallback(
( (
@ -481,10 +486,7 @@ export default function DraggableGridLayout({
_placeholder: LayoutItem | null, _placeholder: LayoutItem | null,
_event: Event, _event: Event,
) => { ) => {
if (!fitToScreen || !fitGridParams || !newItem) { if (!fitToScreen || !fitGridParams || !newItem) return;
console.log("[FitDrag] SKIP: early return", { fitToScreen, fitGridParams: !!fitGridParams, newItem: !!newItem });
return;
}
const w = fitGridParams.gridUnitsPerCam; const w = fitGridParams.gridUnitsPerCam;
const colsPerRow = fitGridParams.colsPerRow; const colsPerRow = fitGridParams.colsPerRow;
@ -512,22 +514,6 @@ export default function DraggableGridLayout({
const sourceIndex = orderedNames.indexOf(draggedId); const sourceIndex = orderedNames.indexOf(draggedId);
console.log("[FitDrag] CALC:", {
draggedId,
sourceIndex,
targetIndex,
targetCol,
targetRow,
clampedRow,
totalRows,
"newItem.x": newItem.x,
"newItem.y": newItem.y,
w,
colsPerRow,
orderedNames,
willSwap: sourceIndex !== -1 && sourceIndex !== targetIndex,
});
const snapBack = orderedNames.map((name, index) => ({ const snapBack = orderedNames.map((name, index) => ({
i: name, i: name,
x: (index % colsPerRow) * w, x: (index % colsPerRow) * w,
@ -537,7 +523,6 @@ export default function DraggableGridLayout({
})); }));
if (sourceIndex === -1 || sourceIndex === targetIndex) { if (sourceIndex === -1 || sourceIndex === targetIndex) {
console.log("[FitDrag] SNAP BACK (no swap)");
setFitLayoutOverride(snapBack); setFitLayoutOverride(snapBack);
return; return;
} }
@ -556,13 +541,6 @@ export default function DraggableGridLayout({
h: w, h: w,
})); }));
console.log("[FitDrag] SWAP:", {
from: orderedNames[sourceIndex],
to: orderedNames[targetIndex],
newOrder,
normalized: normalized.map(n => `${n.i}(${n.x},${n.y})`),
});
setFitLayoutOverride(normalized); setFitLayoutOverride(normalized);
}, },
[fitToScreen, fitGridParams, fitLayoutOverride, fitLayout], [fitToScreen, fitGridParams, fitLayoutOverride, fitLayout],
@ -570,13 +548,7 @@ export default function DraggableGridLayout({
const activeGridLayout = useMemo(() => { const activeGridLayout = useMemo(() => {
if (fitToScreen) { if (fitToScreen) {
const result = fitLayoutOverride ?? fitLayout ?? currentGridLayout; return fitLayoutOverride ?? fitLayout ?? currentGridLayout;
console.log("[FitDrag] activeGridLayout:", {
usingOverride: !!fitLayoutOverride,
usingFitLayout: !fitLayoutOverride && !!fitLayout,
layout: result?.map(n => `${n.i}(${n.x},${n.y})`),
});
return result;
} }
return currentGridLayout; return currentGridLayout;
}, [fitToScreen, fitLayoutOverride, fitLayout, currentGridLayout]); }, [fitToScreen, fitLayoutOverride, fitLayout, currentGridLayout]);