Added sort

src/components/runners/RunnersOverview.svelte

@@ -8,6 +8,7 @@
     getCoreRowModel,
     getFilteredRowModel,
     getPaginationRowModel,
+    getSortedRowModel,
   } from "@tanstack/svelte-table";
 
   const columns = [
@@ -19,22 +20,22 @@
     {
       accessorKey: "firstname",
       header: () => "firstname",
-      filterFn: `includesString`
+      filterFn: `includesString`,
     },
     {
       accessorKey: "lastname",
       header: () => "lastname",
-      filterFn: `includesString`
+      filterFn: `includesString`,
     },
     {
       accessorKey: "group.name",
       header: () => "group",
-      filterFn: `includesString`
+      filterFn: `includesString`,
     },
     {
       accessorKey: "distance",
       header: () => "distance",
-      filterFn: `equals`
+      filterFn: `equals`,
     },
   ];
 
@@ -78,6 +79,7 @@
     getCoreRowModel: getCoreRowModel(),
     getFilteredRowModel: getFilteredRowModel(),
     getPaginationRowModel: getPaginationRowModel(),
+    getSortedRowModel: getSortedRowModel(),
   });
   const table = createSvelteTable(options);
   onMount(() => {
@@ -127,7 +129,7 @@
         {#each $table.getHeaderGroups() as headerGroup}
           <tr>
             {#each headerGroup.headers as header}
-              <th>
+              <th on:click={header.column.getToggleSortingHandler()}>
                 {#if !header.isPlaceholder}
                   <svelte:component
                     this={flexRender(
@@ -135,6 +137,12 @@
                       header.getContext()
                     )}
                   />
+                  {#if header.column.getIsSorted().toString() == "asc"}
+                    🔼
+                  {:else if header.column.getIsSorted().toString() == "desc"}
+                    🔽
+                  {/if}
+                {/if}
                 {#if header.column.getCanFilter()}
                   <div class="relative max-w-xs">
                     <input
@@ -165,7 +173,6 @@
                     </div>
                   </div>
                 {/if}
-                {/if}
               </th>
             {/each}
           </tr>