Implement API improvements Phases 1-4

src/components/profile/RideCreditsManager.tsx

@@ -13,6 +13,7 @@ import { RideCreditFilters } from './RideCreditFilters';
 import { UserRideCredit } from '@/types/database';
 import { useRideCreditFilters } from '@/hooks/useRideCreditFilters';
 import { useIsMobile } from '@/hooks/use-mobile';
+import { useRideCreditsMutation } from '@/hooks/rides/useRideCreditsMutation';
 import {
   DndContext,
   DragEndEvent,
@@ -39,6 +40,7 @@ export function RideCreditsManager({ userId }: RideCreditsManagerProps) {
   const [isAddDialogOpen, setIsAddDialogOpen] = useState(false);
   const [isEditMode, setIsEditMode] = useState(false);
   const isMobile = useIsMobile();
+  const { reorderCredit, isReordering } = useRideCreditsMutation();
 
   // Use the filter hook
   const {
@@ -246,24 +248,16 @@ export function RideCreditsManager({ userId }: RideCreditsManagerProps) {
     }
   };
 
-  const handleReorder = async (creditId: string, newPosition: number) => {
-    try {
-      const { error } = await supabase.rpc('reorder_ride_credit', {
-        p_credit_id: creditId,
-        p_new_position: newPosition
-      });
-      
-      if (error) throw error;
-      
-      // No refetch - optimistic update is already applied
-    } catch (error: unknown) {
-      handleError(error, {
-        action: 'Reorder Ride Credit',
-        userId,
-        metadata: { creditId, newPosition }
-      });
-      throw error;
-    }
+  const handleReorder = (creditId: string, newPosition: number) => {
+    return new Promise<void>((resolve, reject) => {
+      reorderCredit.mutate(
+        { creditId, newPosition },
+        {
+          onSuccess: () => resolve(),
+          onError: (error) => reject(error)
+        }
+      );
+    });
   };
 
   const handleDragEnd = async (event: DragEndEvent) => {