New fields for complex

2026-04-09 16:18:58 -03:00
parent ae90562d88
commit 3cba2fa485
15 changed files with 603 additions and 7 deletions
--- a/apps/frontend/src/features/complex/components/complex-courts-section.tsx
+++ b/apps/frontend/src/features/complex/components/complex-courts-section.tsx
@@ -0,0 +1,73 @@
+import { useState } from 'react'
+import { useQuery } from '@tanstack/react-query'
+import { type Court, type CreateCourtInput } from '@repo/api-contract'
+import { MapPin } from 'lucide-react'
+import { apiClient } from '@/lib/api-client'
+import { CourtFormSection } from './court-form-section'
+import { CourtListSection } from './court-list-section'
+import { Separator } from '@/components/ui/separator'
+
+type ComplexCourtsSectionProps = {
+  complexId: string | null
+}
+
+export function ComplexCourtsSection({
+  complexId,
+}: ComplexCourtsSectionProps) {
+  const [editingCourt, setEditingCourt] = useState<Court | null>(null)
+  const [initialDraft, setInitialDraft] = useState<CreateCourtInput | null>(null)
+
+  const courtsQuery = useQuery({
+    queryKey: ['courts', complexId],
+    enabled: Boolean(complexId),
+    queryFn: () => apiClient.courts.listByComplex(complexId as string),
+  })
+
+  return (
+    <section className="mt-6 rounded-xl border bg-card p-5">
+      <div className="flex items-center gap-2">
+        <MapPin className="size-5 text-muted-foreground" />
+        <h3 className="text-lg font-medium">Canchas</h3>
+      </div>
+      <Separator className="my-4" />
+      <p className="mb-4 text-sm text-muted-foreground">
+        Alta y edición de canchas del complejo.
+      </p>
+
+      <CourtFormSection
+        complexId={complexId}
+        editingCourt={editingCourt}
+        initialDraft={initialDraft}
+        onCancelEdit={() => {
+          setEditingCourt(null)
+        }}
+      />
+
+      <CourtListSection
+        courts={courtsQuery.data ?? []}
+        isLoading={courtsQuery.isLoading}
+        isError={courtsQuery.isError}
+        onDuplicateCourt={(court) => {
+          setEditingCourt(null)
+          setInitialDraft({
+            name: `${court.name} - Copy`,
+            sportId: court.sportId,
+            slotDurationMinutes: court.slotDurationMinutes,
+            basePrice: court.basePrice,
+            availability: court.availability.map((slot) => ({
+              dayOfWeek: slot.dayOfWeek,
+              startTime: slot.startTime,
+              endTime: slot.endTime,
+            })),
+          })
+          window.scrollTo({ top: 0, behavior: 'smooth' })
+        }}
+        onEditCourt={(court) => {
+          setInitialDraft(null)
+          setEditingCourt(court)
+          window.scrollTo({ top: 0, behavior: 'smooth' })
+        }}
+      />
+    </section>
+  )
+}