feat: Implement button loading states

src/components/admin/RideForm.tsx

@@ -158,6 +158,7 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
   const { isModerator } = useUserRole();
   const { preferences } = useUnitPreferences();
   const measurementSystem = preferences.measurement_system;
+  const [isSubmitting, setIsSubmitting] = useState(false);
 
   // Validate that onSubmit uses submission helpers (dev mode only)
   useEffect(() => {
@@ -262,7 +263,8 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
   const selectedCategory = watch('category');
 
 
-  const handleFormSubmit = async (data: RideFormData) => {    
+  const handleFormSubmit = async (data: RideFormData) => {
+    setIsSubmitting(true);
     try {
       // CRITICAL: Block new photo uploads on edits
       if (isEditing && data.images?.uploaded) {
@@ -355,6 +357,8 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
       
       // Re-throw so parent can handle modal closing
       throw error;
+    } finally {
+      setIsSubmitting(false);
     }
   };
 
@@ -1355,13 +1359,15 @@ export function RideForm({ onSubmit, onCancel, initialData, isEditing = false }:
             <Button 
               type="submit"
               className="flex-1"
+              loading={isSubmitting}
+              loadingText="Saving..."
             >
               <Save className="w-4 h-4 mr-2" />
               {isEditing ? 'Update Ride' : 'Create Ride'}
             </Button>
             
             {onCancel && (
-              <Button type="button" variant="outline" onClick={onCancel}>
+              <Button type="button" variant="outline" onClick={onCancel} disabled={isSubmitting}>
                 <X className="w-4 h-4 mr-2" />
                 Cancel
               </Button>