Added ability to navigate to the first page

src/Exceptionless.Web/ClientApp/src/lib/components/events/EventsTable.svelte

@@ -30,7 +30,7 @@
 	import ErrorMessage from '$comp/ErrorMessage.svelte';
 	import Table from '$comp/table/Table.svelte';
 	import { createEventDispatcher, onMount } from 'svelte';
-	import { DEFAULT_LIMIT, hasNextPage, hasPreviousPage } from '$lib/helpers/api';
+	import { DEFAULT_LIMIT, hasNextPage, hasPreviousPage, canNavigateToFirstPage } from '$lib/helpers/api';
 	import { type FetchClientResponse, FetchClient } from '$api/FetchClient';
 
 	export let mode: GetEventsMode = 'summary';
@@ -203,6 +203,15 @@
 		}
 	}
 
+	function onNavigateToFirstPage() {
+		page = 0;
+		parameters.update((params) => ({
+			...params,
+			before: undefined,
+			after: undefined
+		}));
+	}
+
 	function onPreviousPage() {
 		page = Math.max(page - 1, 0);
 		parameters.update((params) => ({
@@ -248,6 +257,8 @@
 
 		<div class="py-2">
 			<Pager
+                canNavigateToFirstPage={canNavigateToFirstPage(page)}
+				on:navigatetofirstpage={() => onNavigateToFirstPage()}
 				hasPrevious={hasPreviousPage(page)}
 				on:previous={() => onPreviousPage()}
 				hasNext={hasNextPage(

src/Exceptionless.Web/ClientApp/src/lib/components/table/Pager.svelte

@@ -1,21 +1,31 @@
 <script lang="ts">
+	import FirstPageIcon from '~icons/mdi/first-page';
+	import NavigateBeforeIcon from '~icons/mdi/navigate-before';
+	import NavigateNextIcon from '~icons/mdi/navigate-next';
 	import { createEventDispatcher } from 'svelte';
 
+	export let canNavigateToFirstPage: boolean;
 	export let hasPrevious: boolean;
 	export let hasNext: boolean;
 
 	const dispatch = createEventDispatcher();
 </script>
 
 <div class="join">
+    {#if canNavigateToFirstPage}
+	<button
+		class="btn btn-square btn-outline join-item btn-sm"
+		on:click|preventDefault={() => dispatch('navigatetofirstpage')}><FirstPageIcon /></button
+	>
+    {/if}
 	<button
 		class="btn btn-square btn-outline join-item btn-sm"
 		disabled={!hasPrevious}
-		on:click|preventDefault={() => dispatch('previous')}>&lt;</button
+		on:click|preventDefault={() => dispatch('previous')}><NavigateBeforeIcon /></button
 	>
 	<button
 		class="btn btn-square btn-outline join-item btn-sm"
 		disabled={!hasNext}
-		on:click|preventDefault={() => dispatch('next')}>&gt;</button
+		on:click|preventDefault={() => dispatch('next')}><NavigateNextIcon /></button
 	>
 </div>

src/Exceptionless.Web/ClientApp/src/lib/helpers/api.ts

@@ -8,6 +8,10 @@ export function getPageEnd(page: number, pageTotal: number, limit: number): numb
 	return getPageStart(page, limit) + pageTotal - 1;
 }
 
+export function canNavigateToFirstPage(page: number): boolean {
+    return page > 1;
+}
+
 export function hasPreviousPage(page: number): boolean {
 	return page > 0;
 }