diff --git a/frontend/components/Filter.svelte b/frontend/components/Filter.svelte index c16d6d2..d7967cd 100644 --- a/frontend/components/Filter.svelte +++ b/frontend/components/Filter.svelte @@ -3,12 +3,18 @@ import QueryModal from './QueryModal.svelte'; import { parseDSL } from '../dsl'; import { debounce } from '../util'; - import { parsedFilter, stringFilter, filterActive, isAuthenticated } from '../store'; + import { parsedFilter, stringFilter, filterActive, isAuthenticated, activeFilterId } from '../store'; let filter: string = ''; let filterValid: boolean = false; let saveModal: QueryModal; + stringFilter.subscribe((value) => { + filter = value; + applyFilter(); + }); + + function filterChangeHandler(): () => void { return debounce(() => { // TODO: validate queries as user types them. @@ -29,10 +35,11 @@ function applyFilter() { console.log(`Going to parse ${filter}`); - stringFilter.set(filter); if (filter == '') { filterActive.set(false); parsedFilter.set(undefined); + stringFilter.set(''); + activeFilterId.set(undefined); return; } diff --git a/frontend/components/QueryList.svelte b/frontend/components/QueryList.svelte index d9f4050..43b58da 100644 --- a/frontend/components/QueryList.svelte +++ b/frontend/components/QueryList.svelte @@ -1,7 +1,8 @@ @@ -46,7 +41,7 @@ {#if query.description}{query.description}{/if}
- {#if query.active}active{:else}inactive{/if} + {#if query.id == $activeFilterId}active{:else}inactive{/if}
@@ -54,7 +49,7 @@