debug(agents): add comprehensive logging to form submission
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>
This commit is contained in:
@@ -40,7 +40,7 @@ import type { AgentTypeResponse } from '@/lib/api/types/agentTypes';
|
|||||||
|
|
||||||
interface AgentTypeFormProps {
|
interface AgentTypeFormProps {
|
||||||
agentType?: AgentTypeResponse;
|
agentType?: AgentTypeResponse;
|
||||||
onSubmit: (data: AgentTypeCreateFormValues) => void;
|
onSubmit: (data: AgentTypeCreateFormValues) => void | Promise<void>;
|
||||||
onCancel: () => void;
|
onCancel: () => void;
|
||||||
isSubmitting?: boolean;
|
isSubmitting?: boolean;
|
||||||
className?: string;
|
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 (
|
return (
|
||||||
<form onSubmit={handleSubmit(onSubmit, handleFormError)} className={className}>
|
<form onSubmit={onFormSubmit} className={className}>
|
||||||
{/* Header */}
|
{/* Header */}
|
||||||
<div className="mb-6 flex items-center gap-4">
|
<div className="mb-6 flex items-center gap-4">
|
||||||
<Button type="button" variant="ghost" size="icon" onClick={onCancel}>
|
<Button type="button" variant="ghost" size="icon" onClick={onCancel}>
|
||||||
|
|||||||
Reference in New Issue
Block a user