add a job color to the eval task

src/renderer/components/Experiment/Eval/EvalJobsTable.tsx

@@ -15,6 +15,7 @@ import ViewOutputModalStreaming from './ViewOutputModalStreaming';
 
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
+import { jobChipColor } from 'renderer/lib/utils';
 dayjs.extend(relativeTime);
 var duration = require('dayjs/plugin/duration');
 dayjs.extend(duration);
@@ -65,7 +66,14 @@ const EvalJobsTable = () => {
                   {job?.job_data?.evaluator}
                 </td>
                 <td>
-                  <Chip>{job.status}</Chip>
+                  <Chip
+                    sx={{
+                      backgroundColor: jobChipColor(job.status),
+                      color: 'var(--joy-palette-neutral-800)',
+                    }}
+                  >
+                    {job.status}
+                  </Chip>
                   <br />
                   Progress: {job?.progress}
                 </td>

src/renderer/components/Experiment/Train/TrainLoRA.tsx

@@ -49,6 +49,7 @@ import relativeTime from 'dayjs/plugin/relativeTime';
 import ViewOutputModalStreaming from './ViewOutputModalStreaming';
 import CurrentDownloadBox from 'renderer/components/currentDownloadBox';
 import DownloadProgressBox from 'renderer/components/Shared/DownloadProgressBox';
+import { jobChipColor } from 'renderer/lib/utils';
 dayjs.extend(relativeTime);
 var duration = require('dayjs/plugin/duration');
 dayjs.extend(duration);
@@ -71,16 +72,6 @@ function formatTemplateConfig(config): ReactElement {
   return r;
 }
 
-function jobChipColor(status: string): string {
-  if (status === 'COMPLETE') return 'var(--joy-palette-success-200)';
-  if (status === 'QUEUED') return 'var(--joy-palette-warning-200)';
-  if (status === 'FAILED') return 'var(--joy-palette-danger-200)';
-  if (status == 'STOPPED') return 'var(--joy-palette-warning-200)';
-  if (status == 'RUNNING') return 'rgb(225,237,233)';
-
-  return 'var(--joy-palette-neutral-200)';
-}
-
 function formatJobConfig(c): ReactElement {
   const r = (
     <>

src/renderer/lib/utils.ts

@@ -201,3 +201,13 @@ export function useTraceUpdate(props) {
     prev.current = props;
   });
 }
+
+export function jobChipColor(status: string): string {
+  if (status === 'COMPLETE') return 'var(--joy-palette-success-200)';
+  if (status === 'QUEUED') return 'var(--joy-palette-warning-200)';
+  if (status === 'FAILED') return 'var(--joy-palette-danger-200)';
+  if (status == 'STOPPED') return 'var(--joy-palette-warning-200)';
+  if (status == 'RUNNING') return 'rgb(225,237,233)';
+
+  return 'var(--joy-palette-neutral-200)';
+}