results table width

cdreetz · Aug 20, 2024 · c992d34 · c992d34
1 parent 4efd562
commit c992d34
Showing 1 changed file with 5 additions and 3 deletions.
diff --git a/components/ResultsTable.tsx b/components/ResultsTable.tsx
@@ -20,23 +20,25 @@ export default function ResultsTable({ results, selectedModels, isLoading, isIni
     return null
   }
 
+  const modelColumnWidth = selectedModels.length > 0 ? `${85 / selectedModels.length}%` : 'auto'
+
   return (
     <div className="space-y-4">
       <h2 className="text-xl font-semibold">Evaluation Results</h2>
       <Table>
         <TableCaption>A comparison of LLM outputs for given prompts.</TableCaption>
         <TableHeader>
           <TableRow>
-            <TableHead className="w-[100px]">Prompt</TableHead>
+            <TableHead style={{ width: '15%' }}>Prompt</TableHead>
             {selectedModels.map((model) => (
-              <TableHead key={model.id}>{model.name}</TableHead>
+              <TableHead key={model.id} style={{ width: modelColumnWidth }}>{model.name}</TableHead>
             ))}
           </TableRow>
         </TableHeader>
         <TableBody>
           {isInitial ? (
               <TableRow>
-                <TableCell>
+                <TableCell colSpan={selectedModels.length + 1}>
                   <Skeleton className="h-4 w-full" />
                 </TableCell>
               </TableRow>