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

Add store location map manager #20

Open
nalalangan wants to merge 206 commits from feature/location-map-manager into feature/store-selector-modal
pull from: feature/location-map-manager
merge into: nalalangan:feature/store-selector-modal
Conversation 0 Commits 206 Files Changed 47 +48 -14
3 changed files with 48 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 24a6405a1a - Show all commits

11
frontend/src/components/maps/LocationMapBottomSheet.jsx
View File

@ -135,6 +135,16 @@ export default function LocationMapBottomSheet({
</div> </div>
{layersOpen ? ( {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"> <div className="location-map-display-controls">
{DISPLAY_CONTROLS.map(([key, label]) => ( {DISPLAY_CONTROLS.map(([key, label]) => (
<label key={key}> <label key={key}>
@ -149,6 +159,7 @@ export default function LocationMapBottomSheet({
</label> </label>
))} ))}
</div> </div>
</div>
) : null} ) : null}
{showSelectedObjectForm ? null : editorActions} {showSelectedObjectForm ? null : editorActions}

20
frontend/src/styles/pages/LocationMapManager.css
View File

@ -408,11 +408,29 @@
background: rgba(59, 130, 246, 0.22); 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 { .location-map-display-controls {
display: grid; display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.4rem; gap: 0.4rem;
margin-bottom: 0.7rem;
} }
.location-map-display-controls label { .location-map-display-controls label {

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

@ -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-label")).toHaveCount(0);
await expect(produceArea.locator(".location-map-count")).toHaveText("2 items"); await expect(produceArea.locator(".location-map-count")).toHaveText("2 items");
await expect(produceArea.locator(".location-map-count")).toHaveAttribute("y", "92"); 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 }) => { test("viewer explains when selected zone items are hidden by filters", async ({ page }) => {