feat: festival/series model with sub-events, cross-event sections, tab navigation, SectionsShiftsPanel extraction

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

apps/app/src/composables/api/useEvents.ts

@@ -81,7 +81,7 @@ export function useCreateEvent(orgId: Ref<string>) {
   })
 }
 
-export function useCreateSubEvent(orgId: Ref<string>) {
+export function useCreateSubEvent(orgId: Ref<string>, parentEventId: Ref<string>) {
   const queryClient = useQueryClient()
 
   return useMutation({
@@ -94,6 +94,21 @@ export function useCreateSubEvent(orgId: Ref<string>) {
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['events', orgId.value] })
+      queryClient.invalidateQueries({ queryKey: ['event-children', parentEventId.value] })
+    },
+  })
+}
+
+export function useDeleteEvent(orgId: Ref<string>, parentEventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async (eventId: string) => {
+      await apiClient.delete(`/organisations/${orgId.value}/events/${eventId}`)
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['events', orgId.value] })
+      queryClient.invalidateQueries({ queryKey: ['event-children', parentEventId.value] })
     },
   })
 }

apps/app/src/composables/api/useSections.ts

@@ -13,6 +13,20 @@ interface PaginatedResponse<T> {
   data: T[]
 }
 
+export function useSectionCategories(orgId: Ref<string>) {
+  return useQuery({
+    queryKey: ['section-categories', orgId],
+    queryFn: async () => {
+      const { data } = await apiClient.get<{ data: string[] }>(
+        `/organisations/${orgId.value}/section-categories`,
+      )
+
+      return data.data
+    },
+    enabled: () => !!orgId.value,
+  })
+}
+
 export function useSectionList(eventId: Ref<string>) {
   return useQuery({
     queryKey: ['sections', eventId],
@@ -27,17 +41,27 @@ export function useSectionList(eventId: Ref<string>) {
   })
 }
 
+export interface CreateSectionResult {
+  section: FestivalSection
+  redirectedToParent: boolean
+  parentEventName?: string
+}
+
 export function useCreateSection(eventId: Ref<string>) {
   const queryClient = useQueryClient()
 
   return useMutation({
-    mutationFn: async (payload: CreateSectionPayload) => {
-      const { data } = await apiClient.post<ApiResponse<FestivalSection>>(
+    mutationFn: async (payload: CreateSectionPayload): Promise<CreateSectionResult> => {
+      const { data } = await apiClient.post<ApiResponse<FestivalSection> & { meta?: { redirected_to_parent?: boolean; parent_event_name?: string } }>(
         `/events/${eventId.value}/sections`,
         payload,
       )
 
-      return data.data
+      return {
+        section: data.data,
+        redirectedToParent: data.meta?.redirected_to_parent ?? false,
+        parentEventName: data.meta?.parent_event_name,
+      }
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['sections', eventId.value] })
@@ -58,7 +82,8 @@ export function useUpdateSection(eventId: Ref<string>) {
       return data.data
     },
     onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ['sections', eventId.value] })
+      // Invalidate all section lists — a cross_event section update affects multiple events
+      queryClient.invalidateQueries({ queryKey: ['sections'] })
     },
   })
 }
@@ -78,15 +103,32 @@ export function useDeleteSection(eventId: Ref<string>) {
 
 export function useReorderSections(eventId: Ref<string>) {
   const queryClient = useQueryClient()
+  let previousSections: FestivalSection[] | undefined
 
   return useMutation({
     mutationFn: async (orderedIds: string[]) => {
       await apiClient.post(`/events/${eventId.value}/sections/reorder`, {
-        ordered_ids: orderedIds,
+        sections: orderedIds,
       })
     },
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ['sections', eventId.value] })
+    onMutate: async (orderedIds) => {
+      await queryClient.cancelQueries({ queryKey: ['sections', eventId.value] })
+      previousSections = queryClient.getQueryData<FestivalSection[]>(['sections', eventId.value])
+
+      // Optimistically update query cache so watch doesn't snap back
+      if (previousSections) {
+        const byId = new Map(previousSections.map(s => [s.id, s]))
+        const reordered = orderedIds
+          .map(id => byId.get(id))
+          .filter((s): s is FestivalSection => !!s)
+        queryClient.setQueryData(['sections', eventId.value], reordered)
+      }
     },
+    onError: () => {
+      if (previousSections) {
+        queryClient.setQueryData(['sections', eventId.value], previousSections)
+      }
+    },
+    // No onSuccess invalidation — query cache and v-model are already in sync
   })
 }