nalalangan/grocery-app
1
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases Wiki Activity

fix: close selected map area with escape

Browse Source
This commit is contained in:
Nico 2026-06-16 00:03:49 -07:00
parent 11bace3c1b
commit 662fdbb6c5
2 changed files with 37 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/pages/LocationMapManager.jsx
View File

@ -24,6 +24,10 @@ import useUnsavedMapLeaveGuard from "../hooks/useUnsavedMapLeaveGuard";
import { getMapStatus } from "../lib/locationMapUtils"; import { getMapStatus } from "../lib/locationMapUtils";
import "../styles/pages/LocationMapManager.css"; import "../styles/pages/LocationMapManager.css";
function isTextEditingTarget(target) {
return Boolean(target?.closest?.("input, textarea, select, [contenteditable]"));
}
export default function LocationMapManager() { export default function LocationMapManager() {
const { storeId, locationId } = useParams(); const { storeId, locationId } = useParams();
const navigate = useNavigate(); const navigate = useNavigate();
@ -228,6 +232,28 @@ export default function LocationMapManager() {
performBackNavigation, performBackNavigation,
}); });
useEffect(() => {
const hasOpenModal = Boolean(buyModalItem || pendingDeleteObject || pendingLeaveTarget);
if (!selectedObjectKey || layersOpen || hasOpenModal || typeof window === "undefined") {
return undefined;
}
const handleKeyDown = (event) => {
if (
event.defaultPrevented ||
event.key !== "Escape" ||
isTextEditingTarget(event.target)
) {
return;
}
setSelectedObjectKey(null);
};
window.addEventListener("keydown", handleKeyDown);
return () => window.removeEventListener("keydown", handleKeyDown);
}, [buyModalItem, layersOpen, pendingDeleteObject, pendingLeaveTarget, selectedObjectKey, setSelectedObjectKey]);
if (!hasLoaded || householdLoading || loading) { if (!hasLoaded || householdLoading || loading) {
return ( return (
<LocationMapMessageState <LocationMapMessageState

11
frontend/tests/location-map-manager.spec.ts
View File

@ -2437,6 +2437,17 @@ test("admin selected map area uses compact editable fields", async ({ page }) =>
await expect(page.getByRole("spinbutton", { name: "Y" })).toHaveCount(0); await expect(page.getByRole("spinbutton", { name: "Y" })).toHaveCount(0);
await expect(page.getByRole("spinbutton", { name: "W" })).toHaveCount(0); await expect(page.getByRole("spinbutton", { name: "W" })).toHaveCount(0);
await expect(page.getByRole("spinbutton", { name: "H" })).toHaveCount(0); await expect(page.getByRole("spinbutton", { name: "H" })).toHaveCount(0);
await page.getByRole("textbox", { name: "Label" }).focus();
await page.keyboard.press("Escape");
await expect(page.getByRole("textbox", { name: "Label" })).toBeVisible();
await expect(page.locator(".location-map-object.is-selected")).toHaveCount(1);
await page.getByRole("button", { name: "Visible" }).focus();
await page.keyboard.press("Escape");
await expect(page.getByRole("textbox", { name: "Label" })).toHaveCount(0);
await expect(page.locator(".location-map-object.is-selected")).toHaveCount(0);
await expect(page.locator(".location-map-sheet-header strong")).toHaveText("Edit Areas");
}); });
test("admin save progress locks draft controls", async ({ page }) => { test("admin save progress locks draft controls", async ({ page }) => {