fix: expose map layer reset

frontend/src/components/maps/LocationMapBottomSheet.jsx

@@ -97,6 +97,7 @@ export default function LocationMapBottomSheet({
   const maxHeight = Math.max(40, Math.round(mapSize?.height || selectedHeight));
   const saveDraftLabel = savingAction === "save" ? "Saving..." : "Save Draft";
   const publishLabel = savingAction === "publish" ? "Publishing..." : "Publish";
+  const resetLayerFilters = () => setFilters({ ...DEFAULT_MAP_FILTERS });
   const showSelectedZoneItems = () => {
     setFilters((current) => ({
       ...current,
@@ -162,6 +163,17 @@ export default function LocationMapBottomSheet({
             <span>{sheetDescription}</span>
           ) : null}
         </div>
+        <div className="location-map-layer-actions">
+          {changedLayerCount ? (
+            <button
+              type="button"
+              className="location-map-layer-reset"
+              onClick={resetLayerFilters}
+              aria-label="Reset layer filters"
+            >
+              Reset
+            </button>
+          ) : null}
           <button
             type="button"
             className={`location-map-layer-toggle ${layersOpen ? "active" : ""}`}
@@ -175,18 +187,10 @@ export default function LocationMapBottomSheet({
             ) : null}
           </button>
         </div>
+      </div>
 
       {layersOpen ? (
         <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}>

frontend/src/styles/pages/LocationMapManager.css

@@ -412,6 +412,13 @@
   text-align: center;
 }
 
+.location-map-layer-actions {
+  flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+}
+
 .location-map-layer-toggle {
   min-height: 40px;
   display: inline-flex;
@@ -452,8 +459,6 @@
 
 .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;

frontend/tests/location-map-manager.spec.ts

@@ -1403,8 +1403,11 @@ test("viewer wraps long zone labels and keeps item counts visible", async ({ pag
   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 page.getByRole("button", { name: "Layers, 1 changed" }).click();
+  await expect(page.getByRole("button", { name: "Reset layer filters" })).toBeVisible();
+  await page.getByRole("button", { name: "Reset layer filters" }).click();
   await expect(page.getByRole("button", { name: "Layers" })).toBeVisible();
+  await expect(page.getByRole("button", { name: "Reset layer filters" })).toHaveCount(0);
   await expect(produceArea.locator(".location-map-label tspan")).toHaveCount(2);
   await expect(produceArea.locator(".location-map-count")).toHaveAttribute("y", "116");
 });