feat: Add button loading states

src/components/admin/DesignerForm.tsx

@@ -1,3 +1,4 @@
+import { useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { zodResolver } from '@hookform/resolvers/zod';
 import * as z from 'zod';
@@ -35,6 +36,7 @@ interface DesignerFormProps {
 export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormProps): React.JSX.Element {
   const { isModerator } = useUserRole();
   const { user } = useAuth();
+  const [isSubmitting, setIsSubmitting] = useState(false);
   
   const {
     register,
@@ -75,6 +77,7 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
             return;
           }
           
+          setIsSubmitting(true);
           try {            
             const formData = {
               ...data,
@@ -97,6 +100,8 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
             
             // Re-throw so parent can handle modal closing
             throw error;
+          } finally {
+            setIsSubmitting(false);
           }
         })} className="space-y-6">
           {/* Basic Information */}
@@ -274,12 +279,15 @@ export function DesignerForm({ onSubmit, onCancel, initialData }: DesignerFormPr
               type="button" 
               variant="outline" 
               onClick={onCancel}
+              disabled={isSubmitting}
             >
               <X className="w-4 h-4 mr-2" />
               Cancel
             </Button>
             <Button 
               type="submit"
+              loading={isSubmitting}
+              loadingText="Saving..."
             >
               <Save className="w-4 h-4 mr-2" />
               Save Designer