feat: smart assign person dialog with conflict details and assignable-persons endpoint

Add GET /events/{event}/shifts/{shift}/assignable-persons endpoint that
returns approved persons with availability status, conflict details, and
already-assigned flags. Improve ShiftAssignmentService conflict errors to
include section name, time slot, and time range. Replace both assign
dialogs with a new AssignPersonDialog featuring search, crowd type
filtering, availability toggle, and inline conflict warnings.

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

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

@@ -0,0 +1,161 @@
+import { useMutation, useQuery, useQueryClient } from '@tanstack/vue-query'
+import type { MaybeRef, Ref } from 'vue'
+import { unref } from 'vue'
+import { apiClient } from '@/lib/axios'
+import type { AssignablePerson, ShiftAssignment } from '@/types/shiftAssignment'
+
+interface ApiResponse<T> {
+  success: boolean
+  data: T
+  message?: string
+}
+
+interface PaginatedResponse<T> {
+  data: T[]
+  links: Record<string, string | null>
+  meta: {
+    current_page: number
+    per_page: number
+    total: number
+    last_page: number
+  }
+}
+
+export interface ShiftAssignmentFilters {
+  shift_id?: string
+  person_id?: string
+  section_id?: string
+  status?: string
+}
+
+export function useShiftAssignmentList(
+  eventId: Ref<string>,
+  filters?: Ref<ShiftAssignmentFilters>,
+) {
+  return useQuery({
+    queryKey: ['shift-assignments', eventId, filters],
+    queryFn: async () => {
+      const params: Record<string, string> = {}
+      if (filters?.value?.shift_id) params.shift_id = filters.value.shift_id
+      if (filters?.value?.person_id) params.person_id = filters.value.person_id
+      if (filters?.value?.section_id) params.section_id = filters.value.section_id
+      if (filters?.value?.status) params.status = filters.value.status
+
+      const { data } = await apiClient.get<PaginatedResponse<ShiftAssignment>>(
+        `/events/${eventId.value}/shift-assignments`,
+        { params },
+      )
+
+      return data
+    },
+    enabled: () => !!eventId.value,
+  })
+}
+
+export function useApproveAssignment(eventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async (assignmentId: string) => {
+      const { data } = await apiClient.post<ApiResponse<ShiftAssignment>>(
+        `/events/${eventId.value}/shift-assignments/${assignmentId}/approve`,
+      )
+
+      return data.data
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['shift-assignments', eventId.value] })
+      queryClient.invalidateQueries({ queryKey: ['shifts'] })
+    },
+  })
+}
+
+export function useRejectAssignment(eventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async ({ assignmentId, reason }: { assignmentId: string; reason?: string }) => {
+      const { data } = await apiClient.post<ApiResponse<ShiftAssignment>>(
+        `/events/${eventId.value}/shift-assignments/${assignmentId}/reject`,
+        { reason },
+      )
+
+      return data.data
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['shift-assignments', eventId.value] })
+      queryClient.invalidateQueries({ queryKey: ['shifts'] })
+    },
+  })
+}
+
+export function useCancelAssignment(eventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async (assignmentId: string) => {
+      const { data } = await apiClient.post<ApiResponse<ShiftAssignment>>(
+        `/events/${eventId.value}/shift-assignments/${assignmentId}/cancel`,
+      )
+
+      return data.data
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['shift-assignments', eventId.value] })
+      queryClient.invalidateQueries({ queryKey: ['shifts'] })
+    },
+  })
+}
+
+export function useBulkApproveAssignments(eventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async (assignmentIds: string[]) => {
+      const { data } = await apiClient.post<ApiResponse<unknown>>(
+        `/events/${eventId.value}/shift-assignments/bulk-approve`,
+        { assignment_ids: assignmentIds },
+      )
+
+      return data.data
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['shift-assignments', eventId.value] })
+      queryClient.invalidateQueries({ queryKey: ['shifts'] })
+    },
+  })
+}
+
+export function useAssignPersonToShift(eventId: Ref<string>) {
+  const queryClient = useQueryClient()
+
+  return useMutation({
+    mutationFn: async ({ sectionId, shiftId, personId }: { sectionId: string; shiftId: string; personId: string }) => {
+      const { data } = await apiClient.post<ApiResponse<ShiftAssignment>>(
+        `/events/${eventId.value}/sections/${sectionId}/shifts/${shiftId}/assign`,
+        { person_id: personId },
+      )
+
+      return data.data
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: ['shift-assignments', eventId.value] })
+      queryClient.invalidateQueries({ queryKey: ['shifts'] })
+      queryClient.invalidateQueries({ queryKey: ['persons', eventId.value] })
+    },
+  })
+}
+
+export function useAssignablePersons(eventId: MaybeRef<string>, shiftId: MaybeRef<string>) {
+  return useQuery({
+    queryKey: ['assignable-persons', eventId, shiftId],
+    queryFn: async () => {
+      const { data } = await apiClient.get<{ data: AssignablePerson[] }>(
+        `/events/${unref(eventId)}/shifts/${unref(shiftId)}/assignable-persons`,
+      )
+
+      return data.data
+    },
+    enabled: () => !!unref(eventId) && !!unref(shiftId),
+  })
+}