From 24a6405a1ac75beb91935bf7962b32defae01e6d Mon Sep 17 00:00:00 2001
From: Nico <Nico>
Date: Wed, 3 Jun 2026 15:50:56 -0700
Subject: [PATCH] fix: reset map layer filters

---
 .../maps/LocationMapBottomSheet.jsx           | 37 ++++++++++++-------
 .../src/styles/pages/LocationMapManager.css   | 20 +++++++++-
 frontend/tests/location-map-manager.spec.ts   |  5 +++
 3 files changed, 48 insertions(+), 14 deletions(-)

diff --git a/frontend/src/components/maps/LocationMapBottomSheet.jsx b/frontend/src/components/maps/LocationMapBottomSheet.jsx
index 646dad2..1fe49c2 100644
--- a/frontend/src/components/maps/LocationMapBottomSheet.jsx
+++ b/frontend/src/components/maps/LocationMapBottomSheet.jsx
@@ -135,19 +135,30 @@ export default function LocationMapBottomSheet({
       </div>
 
       {layersOpen ? (
-        <div className="location-map-display-controls">
-          {DISPLAY_CONTROLS.map(([key, label]) => (
-            <label key={key}>
-              <input
-                type="checkbox"
-                checked={filters[key]}
-                onChange={(event) =>
-                  setFilters((current) => ({ ...current, [key]: event.target.checked }))
-                }
-              />
-              {label}
-            </label>
-          ))}
+        <div className="location-map-display-panel">
+          {changedLayerCount ? (
+            <button
+              type="button"
+              className="location-map-layer-reset"
+              onClick={() => setFilters({ ...DEFAULT_MAP_FILTERS })}
+            >
+              Reset
+            </button>
+          ) : null}
+          <div className="location-map-display-controls">
+            {DISPLAY_CONTROLS.map(([key, label]) => (
+              <label key={key}>
+                <input
+                  type="checkbox"
+                  checked={filters[key]}
+                  onChange={(event) =>
+                    setFilters((current) => ({ ...current, [key]: event.target.checked }))
+                  }
+                />
+                {label}
+              </label>
+            ))}
+          </div>
         </div>
       ) : null}
 
diff --git a/frontend/src/styles/pages/LocationMapManager.css b/frontend/src/styles/pages/LocationMapManager.css
index 9136ce3..3e57f3b 100644
--- a/frontend/src/styles/pages/LocationMapManager.css
+++ b/frontend/src/styles/pages/LocationMapManager.css
@@ -408,11 +408,29 @@
   background: rgba(59, 130, 246, 0.22);
 }
 
+.location-map-display-panel {
+  display: grid;
+  gap: 0.45rem;
+  margin-bottom: 0.7rem;
+}
+
+.location-map-layer-reset {
+  min-height: 36px;
+  width: fit-content;
+  justify-self: end;
+  padding: 0.35rem 0.65rem;
+  border: 1px solid var(--color-border-light);
+  border-radius: 999px;
+  background: rgba(15, 23, 34, 0.72);
+  color: #dbeafe;
+  font-weight: 800;
+  cursor: pointer;
+}
+
 .location-map-display-controls {
   display: grid;
   grid-template-columns: repeat(4, minmax(0, 1fr));
   gap: 0.4rem;
-  margin-bottom: 0.7rem;
 }
 
 .location-map-display-controls label {
diff --git a/frontend/tests/location-map-manager.spec.ts b/frontend/tests/location-map-manager.spec.ts
index a064ef1..ba4cc29 100644
--- a/frontend/tests/location-map-manager.spec.ts
+++ b/frontend/tests/location-map-manager.spec.ts
@@ -725,6 +725,11 @@ test("viewer wraps long zone labels and keeps item counts visible", async ({ pag
   await expect(produceArea.locator(".location-map-label")).toHaveCount(0);
   await expect(produceArea.locator(".location-map-count")).toHaveText("2 items");
   await expect(produceArea.locator(".location-map-count")).toHaveAttribute("y", "92");
+
+  await page.getByRole("button", { name: "Reset" }).click();
+  await expect(page.getByRole("button", { name: "Layers" })).toBeVisible();
+  await expect(produceArea.locator(".location-map-label tspan")).toHaveCount(2);
+  await expect(produceArea.locator(".location-map-count")).toHaveAttribute("y", "116");
 });
 
 test("viewer explains when selected zone items are hidden by filters", async ({ page }) => {