Skip to content

Commit 1b8f0b4

Browse files
authored
Added the next event detail page. (#1845)
* WIP - Added event details page * Added ability to resolve dynamic app routes and use it to update document title. * Updated navigation on event page. * Fixed dependencies * Fixed linting
1 parent be5e875 commit 1b8f0b4

File tree

14 files changed

+343
-426
lines changed

14 files changed

+343
-426
lines changed

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

Lines changed: 206 additions & 352 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/Exceptionless.Web/ClientApp/package.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
"@chromatic-com/storybook": "^3.2.5",
2929
"@eslint/compat": "^1.2.7",
3030
"@eslint/js": "^9.21.0",
31-
"@iconify-json/lucide": "^1.2.27",
31+
"@iconify-json/lucide": "^1.2.28",
3232
"@playwright/test": "^1.50.1",
3333
"@storybook/addon-a11y": "^8.6.3",
3434
"@storybook/addon-essentials": "^8.6.3",
@@ -39,30 +39,30 @@
3939
"@storybook/sveltekit": "^8.6.3",
4040
"@storybook/test": "^8.6.3",
4141
"@sveltejs/adapter-static": "^3.0.8",
42-
"@sveltejs/kit": "^2.17.3",
42+
"@sveltejs/kit": "^2.18.0",
4343
"@sveltejs/vite-plugin-svelte": "^5.0.3",
4444
"@tailwindcss/vite": "^4.0.9",
4545
"@testing-library/jest-dom": "^6.6.3",
4646
"@testing-library/svelte": "^5.2.7",
4747
"@types/eslint": "^9.6.1",
48-
"@types/node": "^22.13.8",
48+
"@types/node": "^22.13.9",
4949
"@types/throttle-debounce": "^5.0.2",
5050
"cross-env": "^7.0.3",
5151
"eslint": "^9.21.0",
5252
"eslint-config-prettier": "^10.0.2",
5353
"eslint-plugin-perfectionist": "^4.9.0",
5454
"eslint-plugin-svelte": "^3.0.2",
5555
"jsdom": "^26.0.0",
56-
"prettier": "^3.5.2",
56+
"prettier": "^3.5.3",
5757
"prettier-plugin-svelte": "^3.3.3",
5858
"prettier-plugin-tailwindcss": "^0.6.11",
5959
"storybook": "^8.6.3",
60-
"svelte": "^5.20.5",
60+
"svelte": "^5.22.2",
6161
"svelte-check": "^4.1.4",
6262
"swagger-typescript-api": "^13.0.23",
6363
"tslib": "^2.8.1",
6464
"typescript": "^5.8.2",
65-
"typescript-eslint": "^8.25.0",
65+
"typescript-eslint": "^8.26.0",
6666
"vite": "^6.2.0",
6767
"vitest": "3.0.7"
6868
},

src/Exceptionless.Web/ClientApp/src/lib/features/events/components/events-drawer.svelte renamed to src/Exceptionless.Web/ClientApp/src/lib/features/events/components/events-overview.svelte

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<script lang="ts">
22
import type { IFilter } from '$comp/faceted-filter';
33
import type { ViewProject } from '$features/projects/models';
4+
import type { ProblemDetails } from '@exceptionless/fetchclient';
45
56
import DateTime from '$comp/formatters/date-time.svelte';
67
import TimeAgo from '$comp/formatters/time-ago.svelte';
@@ -24,12 +25,12 @@
2425
import TraceLog from './views/trace-log.svelte';
2526
2627
interface Props {
27-
changed: (filter: IFilter) => void;
28-
close: () => void;
28+
filterChanged: (filter: IFilter) => void;
29+
handleError: (problem: ProblemDetails) => void;
2930
id: string;
3031
}
3132
32-
let { changed, close, id }: Props = $props();
33+
let { filterChanged, handleError, id }: Props = $props();
3334
3435
function getTabs(event?: null | PersistentEvent, project?: ViewProject): TabType[] {
3536
if (!event) {
@@ -106,12 +107,12 @@
106107
107108
$effect(() => {
108109
if (eventResponse.isError) {
109-
close();
110+
handleError(eventResponse.error);
110111
}
111112
});
112113
</script>
113114

114-
<StackCard {changed} id={eventResponse.data?.stack_id}></StackCard>
115+
<StackCard {filterChanged} id={eventResponse.data?.stack_id}></StackCard>
115116

116117
<Table.Root class="mt-4">
117118
<Table.Body>
@@ -131,7 +132,7 @@
131132
{#if projectResponse.isSuccess}
132133
<Table.Head class="w-40 font-semibold whitespace-nowrap">Project</Table.Head>
133134
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
134-
><EventsFacetedFilter.ProjectTrigger {changed} class="mr-0" value={[projectResponse.data.id!]} /></Table.Cell
135+
><EventsFacetedFilter.ProjectTrigger changed={filterChanged} class="mr-0" value={[projectResponse.data.id!]} /></Table.Cell
135136
>
136137
<Table.Cell>{projectResponse.data.name}</Table.Cell>
137138
{:else}
@@ -154,13 +155,13 @@
154155
{#each tabs as tab (tab)}
155156
<Tabs.Content value={tab}>
156157
{#if tab === 'Overview'}
157-
<Overview {changed} event={eventResponse.data}></Overview>
158+
<Overview {filterChanged} event={eventResponse.data}></Overview>
158159
{:else if tab === 'Exception'}
159-
<Error {changed} event={eventResponse.data}></Error>
160+
<Error {filterChanged} event={eventResponse.data}></Error>
160161
{:else if tab === 'Environment'}
161-
<Environment {changed} event={eventResponse.data}></Environment>
162+
<Environment {filterChanged} event={eventResponse.data}></Environment>
162163
{:else if tab === 'Request'}
163-
<Request {changed} event={eventResponse.data}></Request>
164+
<Request {filterChanged} event={eventResponse.data}></Request>
164165
{:else if tab === 'Trace Log'}
165166
<TraceLog logs={eventResponse.data.data?.['@trace']}></TraceLog>
166167
{:else if tab === 'Extended Data'}

src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/environment.svelte

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@
1111
import ExtendedDataItem from '../extended-data-item.svelte';
1212
1313
interface Props {
14-
changed: (filter: IFilter) => void;
1514
event: PersistentEvent;
15+
filterChanged: (filter: IFilter) => void;
1616
}
1717
18-
let { changed, event }: Props = $props();
18+
let { event, filterChanged }: Props = $props();
1919
let environment = $derived(event.data?.['@environment'] ?? {});
2020
</script>
2121

@@ -25,7 +25,7 @@
2525
<Table.Row class="group">
2626
<Table.Head class="w-40 font-semibold whitespace-nowrap">Machine Name</Table.Head>
2727
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
28-
><EventsFacetedFilter.StringTrigger {changed} term="machine" value={environment.machine_name} /></Table.Cell
28+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="machine" value={environment.machine_name} /></Table.Cell
2929
>
3030
<Table.Cell class="flex items-center">{environment.machine_name}</Table.Cell>
3131
</Table.Row>
@@ -34,7 +34,7 @@
3434
<Table.Row class="group">
3535
<Table.Head class="w-40 font-semibold whitespace-nowrap">IP Address</Table.Head>
3636
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
37-
><EventsFacetedFilter.StringTrigger {changed} term="ip" value={environment.ip_address} /></Table.Cell
37+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="ip" value={environment.ip_address} /></Table.Cell
3838
>
3939
<Table.Cell>{environment.ip_address}</Table.Cell>
4040
</Table.Row>
@@ -71,7 +71,7 @@
7171
<Table.Row class="group">
7272
<Table.Head class="w-40 font-semibold whitespace-nowrap">OS Name</Table.Head>
7373
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
74-
><EventsFacetedFilter.StringTrigger {changed} term="os" value={environment.o_s_name} /></Table.Cell
74+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="os" value={environment.o_s_name} /></Table.Cell
7575
>
7676
<Table.Cell>{environment.o_s_name}</Table.Cell>
7777
</Table.Row>
@@ -80,7 +80,7 @@
8080
<Table.Row class="group">
8181
<Table.Head class="w-40 font-semibold whitespace-nowrap">OS Version</Table.Head>
8282
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
83-
><EventsFacetedFilter.StringTrigger {changed} term="os.version" value={environment.o_s_version} /></Table.Cell
83+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="os.version" value={environment.o_s_version} /></Table.Cell
8484
>
8585
<Table.Cell class="flex items-center">{environment.o_s_version}</Table.Cell>
8686
</Table.Row>
@@ -89,7 +89,7 @@
8989
<Table.Row class="group">
9090
<Table.Head class="w-40 font-semibold whitespace-nowrap">Architecture</Table.Head>
9191
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
92-
><EventsFacetedFilter.StringTrigger {changed} term="architecture" value={environment.architecture} /></Table.Cell
92+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="architecture" value={environment.architecture} /></Table.Cell
9393
>
9494
<Table.Cell class="flex items-center">{environment.architecture}</Table.Cell>
9595
</Table.Row>

src/Exceptionless.Web/ClientApp/src/lib/features/events/components/views/error.svelte

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@
1414
import StackTrace from '../stack-trace/stack-trace.svelte';
1515
1616
interface Props {
17-
changed: (filter: IFilter) => void;
1817
event: PersistentEvent;
18+
filterChanged: (filter: IFilter) => void;
1919
}
2020
21-
let { changed, event }: Props = $props();
21+
let { event, filterChanged }: Props = $props();
2222
2323
let errorData = $derived(getErrorData(event));
2424
let errorType = $derived(getErrorType(event));
@@ -35,15 +35,15 @@
3535
<Table.Row class="group">
3636
<Table.Head class="w-40 font-semibold whitespace-nowrap">Error Type</Table.Head>
3737
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
38-
><EventsFacetedFilter.StringTrigger {changed} term="error.type" value={errorType} /></Table.Cell
38+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="error.type" value={errorType} /></Table.Cell
3939
>
4040
<Table.Cell>{errorType}</Table.Cell>
4141
</Table.Row>
4242
{#if message}
4343
<Table.Row class="group">
4444
<Table.Head class="w-40 font-semibold whitespace-nowrap">Message</Table.Head>
4545
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
46-
><EventsFacetedFilter.StringTrigger {changed} term="error.message" value={message} /></Table.Cell
46+
><EventsFacetedFilter.StringTrigger changed={filterChanged} term="error.message" value={message} /></Table.Cell
4747
>
4848
<Table.Cell>{message}</Table.Cell>
4949
</Table.Row>
@@ -52,7 +52,7 @@
5252
<Table.Row class="group">
5353
<Table.Head class="w-40 font-semibold whitespace-nowrap">Code</Table.Head>
5454
<Table.Cell class="w-4 pr-0 opacity-0 group-hover:opacity-100"
55-
><EventsFacetedFilter.VersionTrigger {changed} term="error.code" value={code} /></Table.Cell
55+
><EventsFacetedFilter.VersionTrigger changed={filterChanged} term="error.code" value={code} /></Table.Cell
5656
>
5757
<Table.Cell>{code}</Table.Cell>
5858
</Table.Row>

0 commit comments

Comments
 (0)