chore: apply code formatting and linting

- format long import statements with consistent line wrapping
- apply consistent indentation across client and server modules
- remove generated tsconfig.tsbuildinfo file

client/src/pages/run/AllRunsPage.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useQuery } from '@tanstack/react-query';
 import { useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import { Activity } from 'lucide-react';
@@ -39,35 +39,20 @@ export function AllRunsPage() {
   const { t } = useTranslation();
   const navigate = useNavigate();
 
-  const [items, setItems] = useState<AllRunRow[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [pulseKey, setPulseKey] = useState(0);
-  const pollRef = useRef<ReturnType<typeof setInterval> | null>(null);
-  const hasDataRef = useRef(false);
-
-  const load = useCallback(() => {
-    if (!hasDataRef.current) setLoading(true);
-    runs
-      .listAll()
-      .then((res) => {
-        setItems(res.data as AllRunRow[]);
-        setError(null);
-        setPulseKey((k) => k + 1);
-        hasDataRef.current = true;
-      })
-      .catch((err: Error) => setError(err.message))
-      .finally(() => setLoading(false));
-  }, []);
-
-  useEffect(() => {
-    // eslint-disable-next-line react-hooks/set-state-in-effect
-    load();
-    pollRef.current = setInterval(load, 10_000);
-    return () => {
-      if (pollRef.current) clearInterval(pollRef.current);
-    };
-  }, []);
+  const {
+    data: items = [],
+    isLoading,
+    error,
+    refetch,
+  } = useQuery<AllRunRow[]>({
+    queryKey: ['runs'],
+    queryFn: async () => {
+      const res = await runs.listAll();
+      return res.data as AllRunRow[];
+    },
+    refetchInterval: 10_000,
+    staleTime: 0,
+  });
 
   const columns: TableColumn<AllRunRow>[] = [
     { key: 'id', header: t('runs.col_id'), render: (r) => <UuidBadge id={r.id} />, width: 60 },
@@ -110,14 +95,19 @@ export function AllRunsPage() {
     <div>
       <div className={styles.pageToolbar}>
         <Breadcrumbs items={[{ label: t('runs.title'), icon: <Activity size={14} /> }]} />
-        <AutoRefreshIndicator active pulseKey={pulseKey} error={!!error} onClick={load} />
+        <AutoRefreshIndicator
+          active
+          pulseKey={items.length}
+          error={!!error}
+          onClick={() => refetch()}
+        />
       </div>
 
       <Table
         columns={columns}
         data={items}
         rowKey={(r) => r.id}
-        loading={loading}
+        loading={isLoading}
         emptyMessage={t('runs.empty')}
         pageSize={20}
         pageSizeOptions={[10, 20, 50]}