From 5e5b6f9cbd02a2f4d57fc99331deb2d0fd5609ea Mon Sep 17 00:00:00 2001
From: Nico <Nico>
Date: Thu, 4 Jun 2026 13:49:25 -0700
Subject: [PATCH] fix: reset map layers on location load

---
 .../src/hooks/useLocationMapDraftState.js     |  2 +
 frontend/tests/location-map-manager.spec.ts   | 82 +++++++++++++++++++
 2 files changed, 84 insertions(+)

diff --git a/frontend/src/hooks/useLocationMapDraftState.js b/frontend/src/hooks/useLocationMapDraftState.js
index 5021b31..8e9db4c 100644
--- a/frontend/src/hooks/useLocationMapDraftState.js
+++ b/frontend/src/hooks/useLocationMapDraftState.js
@@ -88,6 +88,8 @@ export default function useLocationMapDraftState({
 
     setLoading(true);
     setLoadError(null);
+    setFilters({ ...DEFAULT_MAP_FILTERS });
+    setLayersOpen(false);
     try {
       const response = await getLocationMap(activeHousehold.id, locationId);
       if (loadRequestRef.current !== requestId) return;
diff --git a/frontend/tests/location-map-manager.spec.ts b/frontend/tests/location-map-manager.spec.ts
index 155dd41..aada160 100644
--- a/frontend/tests/location-map-manager.spec.ts
+++ b/frontend/tests/location-map-manager.spec.ts
@@ -591,6 +591,88 @@ test("ignores stale map responses after switching locations", async ({ page }) =
   await expect(page.locator(".location-map-title span")).toHaveText("Ontario");
 });
 
+test("resets map layer filters after switching locations", async ({ page }) => {
+  await mockMapShell(page, adminHousehold, [storeLocation, secondStoreLocation]);
+
+  const firstLocationState = publishedMapState([
+    {
+      id: 481,
+      location_map_id: 901,
+      zone_id: 501,
+      zone_name: "Bakery",
+      type: "zone",
+      label: "Eastvale Bakery",
+      x: 40,
+      y: 40,
+      width: 260,
+      height: 160,
+      rotation: 0,
+      locked: false,
+      visible: true,
+      sort_order: 1,
+    },
+  ], true);
+  const nextLocationBaseState = publishedMapState([
+    {
+      id: 482,
+      location_map_id: 902,
+      zone_id: 502,
+      zone_name: "Produce",
+      type: "zone",
+      label: "Ontario Produce",
+      x: 80,
+      y: 80,
+      width: 280,
+      height: 160,
+      rotation: 0,
+      locked: false,
+      visible: true,
+      sort_order: 1,
+    },
+  ], true);
+  const nextPublishedMap = {
+    ...nextLocationBaseState.published_map,
+    id: 902,
+    store_location_id: secondStoreLocation.id,
+  };
+  const nextLocationState = {
+    ...nextLocationBaseState,
+    location: secondStoreLocation,
+    map: nextPublishedMap,
+    published_map: nextPublishedMap,
+  };
+
+  await page.route("**/households/1/locations/10/map", async (route) => {
+    await route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify(firstLocationState),
+    });
+  });
+  await page.route("**/households/1/locations/11/map", async (route) => {
+    await route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify(nextLocationState),
+    });
+  });
+
+  await page.goto("/stores/100/locations/10/map");
+  await expect(page.getByRole("button", { name: "Map area Eastvale Bakery" })).toBeVisible();
+  await page.getByRole("button", { name: "Layers" }).click();
+  await page.getByRole("button", { name: "Zones" }).click();
+  await expect(page.getByText("Zones hidden in Layers")).toBeVisible();
+  await expect(page.getByRole("button", { name: "Map area Eastvale Bakery" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "Layers, 1 changed" })).toBeVisible();
+
+  await page.goto("/stores/100/locations/11/map");
+
+  await expect(page.getByRole("button", { name: "Map area Ontario Produce" })).toBeVisible();
+  await expect(page.getByText("Zones hidden in Layers")).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "Layers" })).toBeVisible();
+  await expect(page.getByRole("button", { name: "Layers, 1 changed" })).toHaveCount(0);
+});
+
 test("admin can add the first area from a blank map canvas", async ({ page }) => {
   await mockMapShell(page);