feat: Implement form, moderation, and testing phases

src/components/admin/OperatorForm.tsx

@@ -1,8 +1,10 @@
-import { useState } from 'react';
+import { useState, useReducer } from 'react';
 import { useForm } from 'react-hook-form';
 import { zodResolver } from '@hookform/resolvers/zod';
 import * as z from 'zod';
 import { entitySchemas } from '@/lib/entityValidationSchemas';
+import { submissionReducer, canSubmit } from '@/lib/submissionStateMachine';
+import { getErrorMessage } from '@/lib/errorHandler';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Textarea } from '@/components/ui/textarea';
@@ -60,7 +62,10 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
   const { headquarters } = useCompanyHeadquarters();
   const { user } = useAuth();
   const navigate = useNavigate();
-  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [submissionState, dispatch] = useReducer(submissionReducer, { 
+    status: 'draft' as const, 
+    data: initialData || {} 
+  });
   
   const {
     register,
@@ -99,8 +104,16 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
             return;
           }
           
-          setIsSubmitting(true);
+          if (!canSubmit(submissionState)) {
+            toast.error('Cannot submit in current state');
+            return;
+          }
+          
+          dispatch({ type: 'VALIDATE', payload: data });
+          
           try {
+            dispatch({ type: 'SUBMIT', payload: { submissionId: crypto.randomUUID() } });
+            
             const formData = {
               ...data,
               company_type: 'operator' as const,
@@ -109,18 +122,24 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
             
             await onSubmit(formData);
             
+            dispatch({ type: 'SUBMISSION_COMPLETE' });
+            
             // Only show success toast and close if not editing through moderation queue
             if (!initialData?.id) {
               toast.success('Operator submitted for review');
               onCancel();
             }
           } catch (error: unknown) {
+            const errorMessage = getErrorMessage(error);
+            if (errorMessage.includes('validation')) {
+              dispatch({ type: 'VALIDATION_ERROR', payload: [{ field: 'general', message: errorMessage }] });
+            } else {
+              dispatch({ type: 'RESET' });
+            }
             handleError(error, {
               action: initialData?.id ? 'Update Operator' : 'Create Operator',
               metadata: { companyName: data.name }
             });
-          } finally {
-            setIsSubmitting(false);
           }
         })} className="space-y-6">
           {/* Basic Information */}
@@ -240,13 +259,21 @@ export function OperatorForm({ onSubmit, onCancel, initialData }: OperatorFormPr
 
           {/* Actions */}
           <div className="flex gap-3 justify-end">
-            <Button type="button" variant="outline" onClick={onCancel} disabled={isSubmitting}>
+            <Button 
+              type="button" 
+              variant="outline" 
+              onClick={onCancel} 
+              disabled={submissionState.status === 'validating' || submissionState.status === 'submitting'}
+            >
               <X className="w-4 h-4 mr-2" />
               Cancel
             </Button>
-            <Button type="submit" disabled={isSubmitting}>
+            <Button 
+              type="submit" 
+              disabled={submissionState.status === 'validating' || submissionState.status === 'submitting' || !canSubmit(submissionState)}
+            >
               <Save className="w-4 h-4 mr-2" />
-              {isSubmitting ? 'Submitting...' : 'Save Operator'}
+              {(submissionState.status === 'validating' || submissionState.status === 'submitting') ? 'Submitting...' : 'Save Operator'}
             </Button>
           </div>
         </form>