Add ability to trigger a save from the ui which whill make the trainer save on the next step

ui/src/app/api/jobs/[jobID]/save_now/route.ts

@@ -0,0 +1,19 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { PrismaClient } from '@prisma/client';
+
+const prisma = new PrismaClient();
+
+export async function GET(request: NextRequest, { params }: { params: { jobID: string } }) {
+  const { jobID } = await params;
+
+  const job = await prisma.job.update({
+    where: { id: jobID },
+    data: {
+      save_now: true,
+    },
+  });
+
+  console.log(`Job ${jobID} marked to save on next step`);
+
+  return NextResponse.json(job);
+}

ui/src/components/JobActionBar.tsx

@@ -1,9 +1,9 @@
 import Link from 'next/link';
-import { Eye, Trash2, Pen, Play, Pause, Cog, X } from 'lucide-react';
+import { Eye, Trash2, Pen, Play, Pause, Cog, X, Copy, Save, OctagonX } from 'lucide-react';
 import { Button } from '@headlessui/react';
 import { openConfirm } from '@/components/ConfirmModal';
 import { Job } from '@prisma/client';
-import { startJob, stopJob, deleteJob, getAvaliableJobActions, markJobAsStopped } from '@/utils/jobs';
+import { startJob, stopJob, deleteJob, getAvaliableJobActions, markJobAsStopped, saveJobNow } from '@/utils/jobs';
 import { startQueue } from '@/utils/queue';
 import { Menu, MenuButton, MenuItem, MenuItems } from '@headlessui/react';
 import { redirect } from 'next/navigation';
@@ -140,20 +140,35 @@ export default function JobActionBar({
         <MenuButton className={'ml-1 sm:ml-2'}>
           <Cog className={iconSizeClass} />
         </MenuButton>
-        <MenuItems anchor="bottom" className="bg-gray-900 border border-gray-700 rounded shadow-lg w-48 px-2 py-2 mt-4">
+        <MenuItems anchor="bottom" className="bg-gray-900 border border-gray-700 rounded shadow-lg w-52 px-2 py-2 mt-4">
           {job.job_type === 'train' && (
             <MenuItem>
               <Link
                 href={`/jobs/new?cloneId=${job.id}`}
-                className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded block"
+                className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded flex items-center gap-2"
               >
+                <Copy className="w-4 h-4" />
                 Clone Job
               </Link>
             </MenuItem>
           )}
+          {canStop && (
+            <MenuItem>
+              <div
+                className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded flex items-center gap-2"
+                onClick={async () => {
+                  await saveJobNow(job.id);
+                  if (onRefresh) onRefresh();
+                }}
+              >
+                <Save className="w-4 h-4" />
+                Save Next Step
+              </div>
+            </MenuItem>
+          )}
           <MenuItem>
             <div
-              className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded"
+              className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded flex items-center gap-2"
               onClick={() => {
                 let message = `Are you sure you want to mark this job as stopped? This will set the job status to 'stopped' if the status is hung. Only do this if you are 100% sure the job is stopped. This will NOT stop the job.`;
                 openConfirm({
@@ -168,6 +183,7 @@ export default function JobActionBar({
                 });
               }}
             >
+              <OctagonX className="w-4 h-4" />
               Mark as Stopped
             </div>
           </MenuItem>

ui/src/utils/jobs.ts

@@ -50,6 +50,22 @@ export const deleteJob = (jobID: string) => {
   });
 };
 
+export const saveJobNow = (jobID: string) => {
+  return new Promise<void>((resolve, reject) => {
+    apiClient
+      .get(`/api/jobs/${jobID}/save_now`)
+      .then(res => res.data)
+      .then(data => {
+        console.log('Job set to save on next step:', data);
+        resolve();
+      })
+      .catch(error => {
+        console.error('Error setting job to save on next step:', error);
+        reject(error);
+      });
+  });
+};
+
 export const markJobAsStopped = (jobID: string) => {
   return new Promise<void>((resolve, reject) => {
     apiClient