Delete coaching sessions

src/components/ui/coaching-session.tsx

@@ -16,19 +16,23 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { MoreHorizontal } from "lucide-react";
 import { CoachingSession as CoachingSessionType } from "@/types/coaching-session";
+import { useAuthStore } from "@/lib/providers/auth-store-provider";
 
 interface CoachingSessionProps {
   coachingSession: CoachingSessionType;
   onUpdate: () => void;
+  onDelete: () => void;
 }
 
 const CoachingSession: React.FC<CoachingSessionProps> = ({
   coachingSession,
   onUpdate,
+  onDelete,
 }) => {
   const { setCurrentCoachingSessionId } = useCoachingSessionStateStore(
     (state) => state
   );
+  const { isCoach } = useAuthStore((state) => state);
 
   return (
     <Card>
@@ -60,9 +64,11 @@ const CoachingSession: React.FC<CoachingSessionProps> = ({
                 <DropdownMenuItem onClick={onUpdate}>
                   Update Session
                 </DropdownMenuItem>
-                <DropdownMenuItem className="text-destructive">
-                  Delete Session
-                </DropdownMenuItem>
+                {isCoach && (
+                  <DropdownMenuItem onClick={onDelete} className="text-destructive">
+                    Delete Session
+                  </DropdownMenuItem>
+                )}
               </DropdownMenuContent>
             </DropdownMenu>
           </div>

src/components/ui/dashboard/coaching-session-list.tsx

@@ -6,9 +6,11 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { ArrowUpDown } from "lucide-react";
 import { useCoachingRelationshipStateStore } from "@/lib/providers/coaching-relationship-state-store-provider";
 import { useCoachingSessionList } from "@/lib/api/coaching-sessions";
+import { useCoachingSessionMutation } from "@/lib/api/coaching-sessions";
 import { CoachingSession as CoachingSessionComponent } from "@/components/ui/coaching-session";
 import { DateTime } from "ts-luxon";
 import type { CoachingSession } from "@/types/coaching-session";
+import { Id } from "@/types/general";
 
 interface CoachingSessionListProps {
   onUpdateSession: (session: CoachingSession) => void;
@@ -27,8 +29,24 @@ export default function CoachingSessionList({ onUpdateSession }: CoachingSession
     coachingSessions,
     isLoading: isLoadingCoachingSessions,
     isError: isErrorCoachingSessions,
+    refresh: refreshCoachingSessions,
   } = useCoachingSessionList(currentCoachingRelationshipId, fromDate, toDate);
 
+  const { delete: deleteCoachingSession } = useCoachingSessionMutation();
+
+  const handleDeleteCoachingSession = async (id: Id) => {
+    if (!confirm("Are you sure you want to delete this session?")) {
+      return;
+    }
+
+    try {
+      await deleteCoachingSession(id).then(() => refreshCoachingSessions());
+    } catch (error) {
+      console.error("Error deleting coaching session:", error);
+      // TODO: Show an error toast here once we start using toasts for showing operation results.
+    }
+  };
+
   const [sortByDate, setSortByDate] = useState(true);
 
   const sortedSessions = coachingSessions
@@ -84,6 +102,7 @@ export default function CoachingSessionList({ onUpdateSession }: CoachingSession
                 key={coachingSession.id}
                 coachingSession={coachingSession}
                 onUpdate={() => onUpdateSession(coachingSession)}
+                onDelete={() => handleDeleteCoachingSession(coachingSession.id)}
               />
             ))}
           </div>