Skip to content

Commit 4ed01d6

Browse files
niemyjskiniemyjski
authored
Next: Added New Organization Sidebar and filter selector (#1812)
* Added breadcrumb * Added user and org sidebar * Delete src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Navbar.svelte * Delete src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Footer.svelte * Delete src/Exceptionless.Web/ClientApp/src/routes/(app)/(components)/layouts/Sidebar.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/summary/Summary.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Environment.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Error.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Overview.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/Request.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Bytes.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Duration.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Number.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/formatters/Percentage.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/primitives/Checkbox.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/primitives/Switch.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/A.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/A.ts * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Blockquote.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Code.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H1.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H2.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H3.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/H4.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Large.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Lead.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/List.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Muted.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/P.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/typography/Small.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Live.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Loading.svelte * Delete src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/Logo.svelte * Fixed sidebar * Updated deps * Fixed email address form. * Updated deps * Added documentation * Updated deps * Fixed [svelte] transition_slide_display The `slide` transition does not work correctly for elements with `display: table-row` https://svelte.dev/e/transition_slide_display * next: show org switcher only if more than one org, moved current org into org feature context * migrated to $app/state * WIP: Removed organization filters as it's inferred from current selected organization. * next: fixed linting * upgrade deps * add sveltekit-search-params * updated deps * Updated Deps * WIP - Reworking filters * Updated packages * More cleanup to filters
1 parent a6a5906 commit 4ed01d6

File tree

134 files changed

+1956
-2547
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

134 files changed

+1956
-2547
lines changed

‎src/Exceptionless.Web/ClientApp/components.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
"aliases": {
1010
"components": "$comp",
1111
"utils": "$lib/utils",
12-
"ui": "$lib/features/shared/components/ui",
12+
"ui": "$comp/ui",
1313
"hooks": "$lib/hooks"
1414
},
1515
"typescript": true,

‎src/Exceptionless.Web/ClientApp/package-lock.json

+348-341
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/Exceptionless.Web/ClientApp/package.json

+25-24
Original file line numberDiff line numberDiff line change
@@ -23,56 +23,57 @@
2323
"upgrade": "ncu -i"
2424
},
2525
"devDependencies": {
26-
"@iconify-json/lucide": "^1.2.22",
27-
"@playwright/test": "^1.49.1",
26+
"@iconify-json/lucide": "^1.2.25",
27+
"@playwright/test": "^1.50.0",
2828
"@sveltejs/adapter-static": "^3.0.8",
29-
"@sveltejs/kit": "^2.15.2",
29+
"@sveltejs/kit": "^2.16.1",
3030
"@sveltejs/vite-plugin-svelte": "^5.0.3",
3131
"@types/eslint": "^9.6.1",
32-
"@types/node": "^22.10.5",
32+
"@types/node": "^22.12.0",
3333
"@types/throttle-debounce": "^5.0.2",
3434
"autoprefixer": "^10.4.20",
3535
"cross-env": "^7.0.3",
36-
"eslint": "^9.17.0",
37-
"eslint-config-prettier": "^9.1.0",
38-
"eslint-plugin-perfectionist": "^4.6.0",
36+
"eslint": "^9.19.0",
37+
"eslint-config-prettier": "^10.0.1",
38+
"eslint-plugin-perfectionist": "^4.7.0",
3939
"eslint-plugin-svelte": "^2.46.1",
4040
"npm-run-all": "^4.1.5",
41-
"postcss": "^8.4.49",
41+
"postcss": "^8.5.1",
4242
"prettier": "^3.4.2",
43-
"prettier-plugin-svelte": "^3.3.2",
44-
"prettier-plugin-tailwindcss": "^0.6.9",
45-
"svelte": "^5.17.1",
46-
"svelte-check": "^4.1.3",
43+
"prettier-plugin-svelte": "^3.3.3",
44+
"prettier-plugin-tailwindcss": "^0.6.11",
45+
"svelte": "^5.19.6",
46+
"svelte-check": "^4.1.4",
4747
"swagger-typescript-api": "^13.0.23",
4848
"tslib": "^2.8.1",
4949
"typescript": "^5.7.3",
50-
"typescript-eslint": "^8.19.1",
51-
"vite": "^6.0.7",
52-
"vitest": "2.1.6"
50+
"typescript-eslint": "^8.22.0",
51+
"vite": "^6.0.11",
52+
"vitest": "3.0.4"
5353
},
5454
"dependencies": {
5555
"@exceptionless/browser": "^3.1.0",
56-
"@exceptionless/fetchclient": "^0.36.0",
57-
"@iconify-json/mdi": "^1.2.2",
56+
"@exceptionless/fetchclient": "^0.40.0",
57+
"@iconify-json/mdi": "^1.2.3",
5858
"@tanstack/svelte-query": "https://pkg.pr.new/@tanstack/svelte-query@28f98f9",
5959
"@tanstack/svelte-query-devtools": "https://pkg.pr.new/@tanstack/svelte-query-devtools@28f98f9",
6060
"@tanstack/svelte-table": "^9.0.0-alpha.10",
6161
"@typeschema/class-validator": "^0.3.0",
62-
"bits-ui": "^1.0.0-next.77",
62+
"bits-ui": "^1.0.0-next.78",
6363
"class-validator": "^0.14.1",
6464
"clsx": "^2.1.1",
6565
"formsnap": "^2.0.0",
66-
"lucide-svelte": "^0.471.0",
67-
"mode-watcher": "^0.5.0",
66+
"lucide-svelte": "^0.474.0",
67+
"mode-watcher": "^0.5.1",
6868
"oidc-client-ts": "^3.1.0",
6969
"pretty-ms": "^9.2.0",
70-
"runed": "^0.23.0",
70+
"runed": "^0.23.2",
7171
"svelte-sonner": "^0.3.28",
72-
"svelte-time": "^0.9.0",
73-
"sveltekit-superforms": "^2.22.1",
72+
"svelte-time": "^2.0.0",
73+
"sveltekit-search-params": "^4.0.0-next.0",
74+
"sveltekit-superforms": "^2.23.1",
7475
"tailwind-merge": "^2.6.0",
75-
"tailwind-variants": "^0.3.0",
76+
"tailwind-variants": "^0.3.1",
7677
"tailwindcss": "^3.4.17",
7778
"tailwindcss-animate": "^1.0.7",
7879
"throttle-debounce": "^5.0.2",

‎src/Exceptionless.Web/ClientApp/src/lib/features/auth/index.svelte.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import { goto } from '$app/navigation';
2-
import { page } from '$app/stores';
2+
import { page } from '$app/state';
33
import { env } from '$env/dynamic/public';
44
import { useFetchClient } from '@exceptionless/fetchclient';
55
import { PersistedState } from 'runed';
6-
import { get } from 'svelte/store';
76

87
import type { Login, TokenResult } from './models';
98

@@ -84,7 +83,7 @@ export async function googleLogin(redirectUrl?: string) {
8483
}
8584

8685
export async function gotoLogin() {
87-
const { url } = get(page);
86+
const url = page.url;
8887
const isAuthPath = url.pathname.startsWith('/next/login') || url.pathname.startsWith('/next/logout');
8988
const redirect = url.pathname === '/next/' || isAuthPath ? '/next/login' : `/next/login?redirect=${url.pathname}`;
9089
await goto(redirect, { replaceState: true });

‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/events-drawer.svelte

+3-8
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
<script lang="ts">
2-
import type { IFilter } from '$comp/filters/filters.svelte';
2+
import type { IFilter } from '$comp/faceted-filter';
33
import type { ViewProject } from '$features/projects/models';
44
5-
import ClickableProjectFilter from '$comp/filters/clickable-project-filter.svelte';
65
import DateTime from '$comp/formatters/date-time.svelte';
76
import TimeAgo from '$comp/formatters/time-ago.svelte';
87
import { Skeleton } from '$comp/ui/skeleton';
98
import * as Table from '$comp/ui/table';
109
import * as Tabs from '$comp/ui/tabs';
1110
import { getEventQuery } from '$features/events/api.svelte';
11+
import * as EventsFacetedFilter from '$features/events/components/filters';
1212
import { getExtendedDataItems, hasErrorOrSimpleError } from '$features/events/persistent-event';
1313
import { getProjectQuery } from '$features/projects/api.svelte';
1414
import StackCard from '$features/stacks/components/stack-card.svelte';
@@ -131,12 +131,7 @@
131131
{#if projectResponse.isSuccess}
132132
<Table.Head class="w-40 whitespace-nowrap">Project</Table.Head>
133133
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
134-
><ClickableProjectFilter
135-
{changed}
136-
class="mr-0"
137-
organization={projectResponse.data.organization_id!}
138-
value={[projectResponse.data.id!]}
139-
/></Table.Cell
134+
><EventsFacetedFilter.ProjectTrigger {changed} class="mr-0" value={[projectResponse.data.id!]} /></Table.Cell
140135
>
141136
<Table.Cell>{projectResponse.data.name}</Table.Cell>
142137
{:else}

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

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<script lang="ts">
2+
import { builderContext, type FacetFilterBuilder, type IFilter } from '$comp/faceted-filter';
3+
import { onMount } from 'svelte';
4+
5+
import BooleanFacetedFilter from './boolean-faceted-filter.svelte';
6+
import { BooleanFilter } from './models.svelte';
7+
8+
interface Props {
9+
priority?: number;
10+
term: string;
11+
title?: string;
12+
}
13+
14+
const { priority = 0, term, title = 'Boolean' }: Props = $props();
15+
16+
onMount(() => {
17+
const builder: FacetFilterBuilder<BooleanFilter> = {
18+
component: BooleanFacetedFilter,
19+
create: (filter?: BooleanFilter) => filter ?? new BooleanFilter(term),
20+
priority,
21+
title
22+
};
23+
24+
builderContext.set(`boolean-${term}`, builder as unknown as FacetFilterBuilder<IFilter>);
25+
return () => builderContext.delete('boolean');
26+
});
27+
</script>

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/clickable-boolean-filter.svelte renamed to ‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/boolean-faceted-filter-trigger.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
import { cn } from '$lib/utils';
44
import Filter from 'lucide-svelte/icons/filter';
55
6-
import { BooleanFilter } from './filters.svelte';
6+
import { BooleanFilter } from './models.svelte';
77
88
type Props = AProps & {
99
changed: (filter: BooleanFilter) => void;

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/facets/boolean-faceted-filter.svelte renamed to ‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/boolean-faceted-filter.svelte

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
<script lang="ts">
2-
import { BooleanFilter } from '$comp/filters/filters.svelte';
2+
import type { FacetedFilterProps } from '$comp/faceted-filter';
33
4-
import type { FacetedFilterProps } from '.';
4+
import * as FacetedFilter from '$comp/faceted-filter';
55
6-
import BooleanFacetedFilter from './base/boolean-faceted-filter.svelte';
6+
import type { BooleanFilter } from './models.svelte';
77
88
let { filter, filterChanged, filterRemoved, ...props }: FacetedFilterProps<BooleanFilter> = $props();
99
</script>
1010

11-
<BooleanFacetedFilter
11+
<FacetedFilter.Boolean
1212
changed={(value) => {
1313
filter.value = value;
1414
filterChanged(filter);
@@ -19,4 +19,4 @@
1919
}}
2020
value={filter.value}
2121
{...props}
22-
></BooleanFacetedFilter>
22+
></FacetedFilter.Boolean>

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

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<script lang="ts">
2+
import { builderContext, type FacetFilterBuilder, type IFilter } from '$comp/faceted-filter';
3+
import { onMount } from 'svelte';
4+
5+
import DateFacetedFilter from './date-faceted-filter.svelte';
6+
import { DateFilter } from './models.svelte';
7+
8+
interface Props {
9+
priority?: number;
10+
term: string;
11+
title?: string;
12+
}
13+
14+
const { priority = 0, term, title = 'Date Range' }: Props = $props();
15+
16+
onMount(() => {
17+
const builder: FacetFilterBuilder<DateFilter> = {
18+
component: DateFacetedFilter,
19+
create: (filter?: DateFilter) => filter ?? new DateFilter(term),
20+
priority,
21+
title
22+
};
23+
24+
builderContext.set(`date-${term}`, builder as unknown as FacetFilterBuilder<IFilter>);
25+
return () => builderContext.delete('date');
26+
});
27+
</script>

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/clickable-date-filter.svelte renamed to ‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/date-faceted-filter-trigger.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
import { cn } from '$lib/utils';
44
import Filter from 'lucide-svelte/icons/filter';
55
6-
import { DateFilter } from './filters.svelte';
6+
import { DateFilter } from './models.svelte';
77
88
type Props = AProps & {
99
changed: (filter: DateFilter) => void;

‎src/Exceptionless.Web/ClientApp/src/lib/features/shared/components/filters/facets/date-faceted-filter.svelte renamed to ‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/date-faceted-filter.svelte

+5-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script lang="ts">
2-
import { DateFilter } from '$comp/filters/filters.svelte';
2+
import type { FacetedFilterProps } from '$comp/faceted-filter';
33
4-
import type { FacetedFilterProps } from '.';
4+
import * as FacetedFilter from '$comp/faceted-filter';
55
6-
import DropDownFacetedFilter from './base/drop-down-faceted-filter.svelte';
6+
import { DateFilter } from './models.svelte';
77
88
let { filter, filterChanged, filterRemoved, title = 'Date Range', ...props }: FacetedFilterProps<DateFilter> = $props();
99
@@ -32,7 +32,7 @@
3232
}
3333
</script>
3434

35-
<DropDownFacetedFilter
35+
<FacetedFilter.DropDown
3636
changed={(value) => {
3737
filter.value = value;
3838
filterChanged(filter);
@@ -45,4 +45,4 @@
4545
{title}
4646
value={filter.value as string}
4747
{...props}
48-
></DropDownFacetedFilter>
48+
></FacetedFilter.DropDown>

‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters.ts renamed to ‎src/Exceptionless.Web/ClientApp/src/lib/features/events/components/filters/helpers.ts

+6-5
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
import { getKeywordFilter, getOrganizationFilter, getProjectFilter, getStackFilter, type IFilter } from '$comp/filters/filters.svelte';
1+
import type { IFilter } from '$comp/faceted-filter';
2+
3+
import { organization } from '$features/organizations/context.svelte';
4+
5+
import { getKeywordFilter, getProjectFilter, getStackFilter } from './models.svelte';
26

37
export function shouldRefreshPersistentEventChanged(
48
filters: IFilter[],
@@ -37,10 +41,7 @@ export function shouldRefreshPersistentEventChanged(
3741
}
3842

3943
if (organization_id) {
40-
const organizationFilter = getOrganizationFilter(filters);
41-
if (organizationFilter && !organizationFilter.isEmpty()) {
42-
return organizationFilter.value === organization_id;
43-
}
44+
return organization.current === organization_id;
4445
}
4546

4647
return true;

0 commit comments

Comments
 (0)