Refactor: Move start design server action to separate file

Extracted the server action logic from the component into a dedicated
actions.ts file for better code organization.

.claude/settings.local.json

@@ -83,7 +83,8 @@
       "Bash(git commit -m 'Fix: Import revalidatePath from correct module *)",
       "Bash(git commit -m 'Fix: Route photo requests to design canvas instead of approval upload *)",
       "Bash(git commit -m 'Fix: Pass photo request ID instead of data URL *)",
-      "Bash(git commit -m 'Feature: Add product selection when starting design from photo request *)"
+      "Bash(git commit -m 'Feature: Add product selection when starting design from photo request *)",
+      "Bash(git commit -m 'Refactor: Move start design server action to separate file *)"
     ]
   }
 }

src/app/admin/custom-requests/[id]/start-design/actions.ts

@@ -0,0 +1,14 @@
+'use server';
+
+import { redirect } from 'next/navigation';
+import { prisma } from '@/lib/prisma';
+
+export async function startDesignWithProduct(formData: FormData, customRequestId: string) {
+  const productId = String(formData.get('productId') ?? '');
+  if (!productId) return;
+
+  const product = await prisma.product.findUnique({ where: { id: productId } });
+  if (product) {
+    redirect(`/made-to-order/${product.slug}?customRequestId=${customRequestId}`);
+  }
+}

src/app/admin/custom-requests/[id]/start-design/page.tsx

@@ -1,6 +1,7 @@
-import { notFound, redirect } from 'next/navigation';
+import { notFound } from 'next/navigation';
 import { prisma } from '@/lib/prisma';
 import AdminNav from '@/components/AdminNav';
+import { startDesignWithProduct } from './actions';
 
 export default async function StartDesignPage({ params }: { params: { id: string } }) {
   const request = await prisma.customRequest.findUnique({
@@ -14,15 +15,6 @@ export default async function StartDesignPage({ params }: { params: { id: string
     orderBy: { name: 'asc' },
   });
 
-  const handleSubmit = async (formData: FormData) => {
-    'use server';
-    const productId = String(formData.get('productId') ?? '');
-    const product = await prisma.product.findUnique({ where: { id: productId } });
-    if (product) {
-      redirect(`/made-to-order/${product.slug}?customRequestId=${request.id}`);
-    }
-  };
-
   return (
     <div className="mx-auto max-w-2xl px-6 py-12">
       <AdminNav />
@@ -39,7 +31,10 @@ export default async function StartDesignPage({ params }: { params: { id: string
         <p className="text-sm"><span className="font-medium">Originally requested for:</span> {request.product.name}</p>
       </div>
 
-      <form action={handleSubmit} className="mt-6 space-y-4 border border-line bg-surface p-6">
+      <form action={async (formData) => {
+        'use server';
+        await startDesignWithProduct(formData, request.id);
+      }} className="mt-6 space-y-4 border border-line bg-surface p-6">
         <div>
           <label htmlFor="productId" className="tag-label mb-2 block">
             Which product to design on?