feat(tickets): add detection discard workflow

src/app/(modules)/ticket/[ticketId]/components/TicketClassDetectionPreview.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useMemo, useState } from 'react';
-import { AlertTriangle, ChevronLeft, ChevronRight } from 'lucide-react';
+import { AlertTriangle, ChevronLeft, ChevronRight, Trash2 } from 'lucide-react';
 
 import DetectionLocationMap from '@/components/map/detectionLocationMap';
 import { Badge } from '@/components/ui/badge';
@@ -11,9 +11,14 @@ import AnnotatedDetectionImage from '@/components/video/annotatedDetectionImage'
 import { getDefectVisual } from '@/constants/defectVisualConfig';
 import { cn } from '@/lib/utils';
 
-import { useTicketClassDetectionsQuery } from '../../hooks/useTicketQueries';
+import {
+  useDiscardDetectionMutation,
+  useTicketClassDetectionsQuery,
+} from '../../hooks/useTicketQueries';
+import { DetectionDiscardDialog } from './DetectionDiscardDialog';
 
 interface TicketClassDetectionPreviewProps {
+  ticketId: string;
   videoId?: string | null;
   defectClassName: string;
   displayName: string;
@@ -89,12 +94,14 @@ function TicketClassDetectionPreviewSkeleton() {
 }
 
 export function TicketClassDetectionPreview({
+  ticketId,
   videoId,
   defectClassName,
   displayName,
   totalCount,
 }: TicketClassDetectionPreviewProps) {
   const [currentIndex, setCurrentIndex] = useState(0);
+  const [isDiscardDialogOpen, setIsDiscardDialogOpen] = useState(false);
   const visual = getDefectVisual(defectClassName);
   const IssueIcon = visual.icon;
 
@@ -116,6 +123,11 @@ export function TicketClassDetectionPreview({
     videoId ?? undefined,
     queryParams,
   );
+  const discardMutation = useDiscardDetectionMutation(
+    ticketId,
+    videoId ?? undefined,
+    defectClassName,
+  );
   const detectionResult = detectionsQuery.data;
   const activeDetection = detectionResult?.items[0];
   const detectionCount = detectionResult?.total ?? totalCount ?? 0;
@@ -274,6 +286,31 @@ export function TicketClassDetectionPreview({
               },
             ]}
           />
+
+          <div className="flex justify-end">
+            <Button
+              type="button"
+              variant="destructive"
+              onClick={() => setIsDiscardDialogOpen(true)}
+            >
+              <Trash2 />
+              Discard detection
+            </Button>
+          </div>
+
+          <DetectionDiscardDialog
+            open={isDiscardDialogOpen}
+            detectionLabel={activeDetection.detection.display_name}
+            isPending={discardMutation.isPending}
+            onOpenChange={setIsDiscardDialogOpen}
+            onSubmit={async (payload) => {
+              await discardMutation.mutateAsync({
+                detectionId: activeDetection.detection.id,
+                payload,
+              });
+              setIsDiscardDialogOpen(false);
+            }}
+          />
         </>
       )}
     </div>