From 6b21a6fadddce8733d164294994665049bdb28b5 Mon Sep 17 00:00:00 2001
From: Felipe Cardoso <felipe.cardoso@hotmail.it>
Date: Tue, 6 Jan 2026 11:56:16 +0100
Subject: [PATCH] debug(agents): add comprehensive logging to form submission
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds console.log statements throughout the form submission flow:
- Form submit triggered
- Current form values
- Form state (isDirty, isValid, isSubmitting, errors)
- Validation pass/fail
- onSubmit call and completion

This will help diagnose why the save button appears to do nothing.
Check browser console for '[AgentTypeForm]' logs.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../src/components/agents/AgentTypeForm.tsx   | 37 ++++++++++++++++++-
 1 file changed, 35 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/agents/AgentTypeForm.tsx b/frontend/src/components/agents/AgentTypeForm.tsx
index cc6ce0b..962949e 100644
--- a/frontend/src/components/agents/AgentTypeForm.tsx
+++ b/frontend/src/components/agents/AgentTypeForm.tsx
@@ -40,7 +40,7 @@ import type { AgentTypeResponse } from '@/lib/api/types/agentTypes';
 
 interface AgentTypeFormProps {
   agentType?: AgentTypeResponse;
-  onSubmit: (data: AgentTypeCreateFormValues) => void;
+  onSubmit: (data: AgentTypeCreateFormValues) => void | Promise<void>;
   onCancel: () => void;
   isSubmitting?: boolean;
   className?: string;
@@ -203,8 +203,41 @@ export function AgentTypeForm({
     }
   };
 
+  // Wrap the form submission with logging
+  const onFormSubmit = useCallback(
+    async (e: React.FormEvent<HTMLFormElement>) => {
+      console.log('[AgentTypeForm] Form submit triggered');
+      console.log('[AgentTypeForm] Current form values:', form.getValues());
+      console.log('[AgentTypeForm] Form state:', {
+        isDirty: form.formState.isDirty,
+        isValid: form.formState.isValid,
+        isSubmitting: form.formState.isSubmitting,
+        errors: form.formState.errors,
+      });
+
+      // Let react-hook-form handle the actual submission
+      return handleSubmit(
+        async (data) => {
+          console.log('[AgentTypeForm] Validation passed, calling onSubmit with:', data);
+          try {
+            await onSubmit(data);
+            console.log('[AgentTypeForm] onSubmit completed successfully');
+          } catch (error) {
+            console.error('[AgentTypeForm] onSubmit threw error:', error);
+            throw error;
+          }
+        },
+        (errors) => {
+          console.error('[AgentTypeForm] Validation failed:', errors);
+          handleFormError(errors);
+        }
+      )(e);
+    },
+    [form, handleSubmit, onSubmit, handleFormError]
+  );
+
   return (
-    <form onSubmit={handleSubmit(onSubmit, handleFormError)} className={className}>
+    <form onSubmit={onFormSubmit} className={className}>
       {/* Header */}
       <div className="mb-6 flex items-center gap-4">
         <Button type="button" variant="ghost" size="icon" onClick={onCancel}>