src/components/scans/ScansOverview.svelte

@@ -20,6 +20,7 @@
   import InputElement from "../shared/InputElement.svelte";
   import TableActions from "../shared/TableActions.svelte";
   import { runnerFilter } from "../shared/tablefilters";
+  import CardRunner from "../cards/CardRunner.svelte";
 
   $: selectedScans =
     $table?.getSelectedRowModel().rows.map((row) => row.original) || [];
@@ -73,11 +74,9 @@
       accessorKey: "runner",
       header: () => $_("runner"),
       cell: (info) => {
-        const runner = info.getValue();
-        return `#${runner.id} - ${runner.firstname} ${runner.lastname}`;
+        return renderComponent(CardRunner, { runner: info.getValue() });
       },
       filterFn: `runner`,
-      enableColumnFilter: true,
     },
     {
       accessorKey: "lapTime",