Skip to content

Commit 3dcdc07

Browse files
niemyjskiniemyjski
committed
next: filter improvements
1 parent 63cb4c1 commit 3dcdc07

File tree

5 files changed

+47
-29
lines changed

5 files changed

+47
-29
lines changed

‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/organization-defaults-faceted-filter-builder.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@
9595
<FacetedFilter.ProjectBuilder />
9696
<FacetedFilter.ReferenceBuilder />
9797
<FacetedFilter.SessionBuilder />
98-
<FacetedFilter.StatusBuilder />
98+
<FacetedFilter.StatusBuilder priority={50} />
9999

100100
{#each eventsStringFilters as { priority, term, title }}
101101
<FacetedFilter.StringBuilder {priority} {term} {title} />

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/faceted-filter/faceted-filter-builder.svelte

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,10 @@
6868
}
6969
7070
function filterChanged(filter: IFilter) {
71+
if (lastOpenFilterId === filter.id) {
72+
lastOpenFilterId = undefined;
73+
}
74+
7175
changed(filter);
7276
}
7377
@@ -127,5 +131,8 @@
127131

128132
{#each facets as facet (facet.filter.id)}
129133
{@const Facet = facet.component}
130-
<Facet filter={facet.filter} {filterChanged} {filterRemoved} open={facet.open} title={facet.title} />
134+
<Facet filter={facet.filter} {filterChanged} {filterRemoved} bind:open={() => facet.open, (isOpen) => {
135+
lastOpenFilterId = isOpen ? facet.filter.id : undefined;
136+
facet.open = isOpen;
137+
}} title={facet.title} />
131138
{/each}

‎src/Exceptionless.Web/ClientApp/src/routes/(app)/+page.svelte

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
<script lang="ts">
2-
import type { DateFilter } from '$features/events/components/filters';
32
import type { EventSummaryModel, SummaryTemplateKeys } from '$features/events/components/summary/index';
43
54
import AutomaticRefreshIndicatorButton from '$comp/automatic-refresh-indicator-button.svelte';
@@ -9,6 +8,7 @@
98
import * as Card from '$comp/ui/card';
109
import * as Sheet from '$comp/ui/sheet';
1110
import EventsDrawer from '$features/events/components/events-drawer.svelte';
11+
import { type DateFilter, StatusFilter } from '$features/events/components/filters';
1212
import {
1313
applyDefaultDateFilter,
1414
clearFilterCache,
@@ -24,6 +24,7 @@
2424
import EventsDataTable from '$features/events/components/table/events-data-table.svelte';
2525
import { getTableContext } from '$features/events/components/table/options.svelte';
2626
import { organization } from '$features/organizations/context.svelte';
27+
import { StackStatus } from '$features/stacks/models';
2728
import { ChangeType, type WebSocketMessageValue } from '$features/websockets/models';
2829
import { DEFAULT_LIMIT, useFetchClientStatus } from '$shared/api/api.svelte';
2930
import { isTableEmpty, removeTableData, removeTableSelection } from '$shared/table';
@@ -39,12 +40,16 @@
3940
selectedEventId = row.id;
4041
}
4142
43+
const DEFAULT_FILTERS = [new StatusFilter([StackStatus.Open, StackStatus.Regressed])];
44+
const DEFAULT_PARAMS = {
45+
filter: '(status:open OR status:regressed)',
46+
limit: DEFAULT_LIMIT,
47+
time: 'last week'
48+
};
49+
50+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
4251
const params = queryParamsState({
43-
default: {
44-
filter: '',
45-
limit: DEFAULT_LIMIT,
46-
time: 'last week'
47-
},
52+
default: DEFAULT_PARAMS,
4853
pushHistory: true,
4954
schema: {
5055
filter: 'string',
@@ -55,10 +60,9 @@
5560
5661
function onSwitchOrganization() {
5762
clearFilterCache();
63+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
5864
//params.$reset(); // Work around for https://github.com/beynar/kit-query-params/issues/7
59-
params.filter = '';
60-
params.limit = DEFAULT_LIMIT;
61-
params.time = 'last week';
65+
Object.assign(params, DEFAULT_PARAMS);
6266
}
6367
6468
let filters = $state(applyDefaultDateFilter(getFiltersFromCache(params.filter), params.time));
@@ -81,7 +85,6 @@
8185
8286
function updateFilters(updatedFilters: FacetedFilter.IFilter[]): void {
8387
const filter = toFilter(updatedFilters.filter((f) => f.type !== 'date'));
84-
8588
updateFilterCache(filter, updatedFilters);
8689
filters = updatedFilters;
8790
params.time = (updatedFilters.find((f) => f.type === 'date') as DateFilter)?.value as string;

‎src/Exceptionless.Web/ClientApp/src/routes/(app)/issues/+page.svelte

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
import * as Sheet from '$comp/ui/sheet';
1010
import { getStackEventsQuery } from '$features/events/api.svelte';
1111
import EventsDrawer from '$features/events/components/events-drawer.svelte';
12-
import { type DateFilter, TypeFilter } from '$features/events/components/filters';
12+
import { type DateFilter, StatusFilter, TypeFilter } from '$features/events/components/filters';
1313
import {
1414
applyDefaultDateFilter,
1515
clearFilterCache,
@@ -25,6 +25,7 @@
2525
import { getTableContext } from '$features/events/components/table/options.svelte';
2626
import { organization } from '$features/organizations/context.svelte';
2727
import TableStacksBulkActionsDropdownMenu from '$features/stacks/components/stacks-bulk-actions-dropdown-menu.svelte';
28+
import { StackStatus } from '$features/stacks/models';
2829
import { ChangeType, type WebSocketMessageValue } from '$features/websockets/models';
2930
import { DEFAULT_LIMIT, useFetchClientStatus } from '$shared/api/api.svelte';
3031
import { isTableEmpty, removeTableData, removeTableSelection } from '$shared/table';
@@ -54,13 +55,16 @@
5455
});
5556
const eventId = $derived(eventsResponse?.data?.[0]?.id);
5657
57-
updateFilterCache('(type:404 OR type:error)', [new TypeFilter(['404', 'error'])]);
58+
const DEFAULT_FILTERS = [new TypeFilter(['404', 'error']), new StatusFilter([StackStatus.Open, StackStatus.Regressed])];
59+
const DEFAULT_PARAMS = {
60+
filter: '(type:404 OR type:error) (status:open OR status:regressed)',
61+
limit: DEFAULT_LIMIT,
62+
time: 'last week'
63+
};
64+
65+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
5866
const params = queryParamsState({
59-
default: {
60-
filter: '(type:404 OR type:error)',
61-
limit: DEFAULT_LIMIT,
62-
time: 'last week'
63-
},
67+
default: DEFAULT_PARAMS,
6468
pushHistory: true,
6569
schema: {
6670
filter: 'string',
@@ -71,11 +75,9 @@
7175
7276
function onSwitchOrganization() {
7377
clearFilterCache();
74-
updateFilterCache('(type:404 OR type:error)', [new TypeFilter(['404', 'error'])]);
78+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
7579
//params.$reset(); // Work around for https://github.com/beynar/kit-query-params/issues/7
76-
params.filter = '(type:404 OR type:error)';
77-
params.limit = DEFAULT_LIMIT;
78-
params.time = 'last week';
80+
Object.assign(params, DEFAULT_PARAMS);
7981
}
8082
8183
let filters = $state(applyDefaultDateFilter(getFiltersFromCache(params.filter), params.time));

‎src/Exceptionless.Web/ClientApp/src/routes/(app)/stream/+page.svelte

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
import * as Card from '$comp/ui/card';
1010
import * as Sheet from '$comp/ui/sheet';
1111
import EventsDrawer from '$features/events/components/events-drawer.svelte';
12+
import { StatusFilter } from '$features/events/components/filters';
1213
import {
1314
clearFilterCache,
1415
filterChanged,
@@ -21,6 +22,7 @@
2122
import OrganizationDefaultsFacetedFilterBuilder from '$features/events/components/filters/organization-defaults-faceted-filter-builder.svelte';
2223
import { getTableContext } from '$features/events/components/table/options.svelte';
2324
import { organization } from '$features/organizations/context.svelte';
25+
import { StackStatus } from '$features/stacks/models';
2426
import { ChangeType, type WebSocketMessageValue } from '$features/websockets/models';
2527
import { DEFAULT_LIMIT, useFetchClientStatus } from '$shared/api/api.svelte';
2628
import { isTableEmpty, removeTableData } from '$shared/table';
@@ -36,11 +38,15 @@
3638
selectedEventId = row.id;
3739
}
3840
41+
const DEFAULT_FILTERS = [new StatusFilter([StackStatus.Open, StackStatus.Regressed])];
42+
const DEFAULT_PARAMS = {
43+
filter: '(status:open OR status:regressed)',
44+
limit: DEFAULT_LIMIT
45+
};
46+
47+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
3948
const params = queryParamsState({
40-
default: {
41-
filter: '',
42-
limit: DEFAULT_LIMIT
43-
},
49+
default: DEFAULT_PARAMS,
4450
pushHistory: true,
4551
schema: {
4652
filter: 'string',
@@ -50,9 +56,9 @@
5056
5157
function onSwitchOrganization() {
5258
clearFilterCache();
59+
updateFilterCache(DEFAULT_PARAMS.filter, DEFAULT_FILTERS);
5360
//params.$reset(); // Work around for https://github.com/beynar/kit-query-params/issues/7
54-
params.filter = '';
55-
params.limit = DEFAULT_LIMIT;
61+
Object.assign(params, DEFAULT_PARAMS);
5662
}
5763
5864
let filters = $state(getFiltersFromCache(params.filter));

0 commit comments

Comments
 (0)