[BUG] Category Filter not working in v0.12.0

[wardwygaerts]

🐞 Bug Description

When I want to filter Locations based on the Category, nothing happens when I select one or more categories. I always see them all. This worked in v0.11.0

🔄 Steps to Reproduce

Click on Locations
Expand Category Filter
Select a Category

✅ Expected Behavior

Locations are filtered based on Category

📸 Screenshots / Logs

/

🐳 Environment Details

• Platform: Docker
• Install Method: Docker Compose,
• AdventureLog Version: v0.12.0
• Reverse Proxy: (e.g., Nginx, Traefik, Caddy, etc. or None)

using ghcr.io/seanmorley15/adventurelog-frontend:latest & ghcr.io/seanmorley15/adventurelog-backend:latest

[madmp87]

Hey @seanmorley15! 👋

Fixed the category filter regression in v0.12.0:

Root Cause: Svelte's reactive statement ($:) was resetting typeString
to empty before the user could submit filters, causing the category filter
to appear broken.

Fix:

1. Replaced $: reactive block with afterNavigate() for URL sync
2. Replaced DaisyUI collapse with Svelte-controlled toggle (fixes click interception)
3. Added auto-apply filter on checkbox change (better UX)
4. Fixed form submission to use Svelte binding instead of hidden input

Technical changes:

• CategoryFilterDropdown.svelte: Complete rewrite with proper event dispatch
• locations/+page.svelte: Centralized filter logic with doApplyFilters()
• Added onCategoryChange() for immediate filter application

Status:

• ✅ Implemented and tested locally
• ✅ Category filter now works reliably
• 🔄 Will be included in upcoming PR bundle

Thanks!

[madmp87]

Fix submitted in PR #1009

Root Cause

The $: reactive block in locations/+page.svelte was re-executing whenever typeString changed (since Svelte tracks it as a dependency), which reset it to '' before the filter could be applied. Additionally, the DaisyUI <details> collapse was intercepting click events from the category checkboxes.

Changes

• locations/+page.svelte: Replace $: reactive block with afterNavigate() to sync typeString from URL params only during actual navigation events; extract doApplyFilters() helper; add onCategoryChange() handler that awaits tick() before applying filters
• CategoryFilterDropdown.svelte: Replace DaisyUI <details> collapse with Svelte-controlled {#if} toggle to prevent click interception; emit change event on checkbox toggle for immediate filter application
• locations/+page.svelte: Convert <form method="get"> to <form on:submit|preventDefault> so filters route through goto() instead of native form submission

Testing

• Select/deselect category filters → filters apply immediately
• Navigate away and back → filter state is preserved
• Browser back/forward → correct filter state restored

[madmp87]

Update: PR #1009 has been rebased onto origin/development to resolve merge conflicts. The branch is now clean and both CI tests (Backend + Frontend) pass.

Fixed in PR #1009 — Category filter now works correctly in v0.12.0. The $: reactive block was replaced with afterNavigate and auto-apply on checkbox change was added for better UX.