From e894676d3b0f354006e76de5d37704473d4c8219 Mon Sep 17 00:00:00 2001
From: "santasri.pachhal" <santasri.pachhal@sentientgeeks.com>
Date: Wed, 29 Jul 2026 19:07:22 +0530
Subject: [PATCH] fix(ticket): gate AI detection summary behind assign
 permission

---
 .../components/TicketOverviewCard.tsx         | 145 +++++++++---------
 1 file changed, 75 insertions(+), 70 deletions(-)

diff --git a/src/app/(modules)/ticket/[ticketId]/components/TicketOverviewCard.tsx b/src/app/(modules)/ticket/[ticketId]/components/TicketOverviewCard.tsx
index 09703a3..750b7e1 100644
--- a/src/app/(modules)/ticket/[ticketId]/components/TicketOverviewCard.tsx
+++ b/src/app/(modules)/ticket/[ticketId]/components/TicketOverviewCard.tsx
@@ -8,7 +8,7 @@ import {
   MapPin,
   Monitor,
   UserRound,
-  Play
+  Play,
 } from 'lucide-react';
 import { useState } from 'react';
 
@@ -172,79 +172,84 @@ export function TicketOverviewCard({
         </Card>
       ) : null}
 
-      <Card>
-        <CardHeader>
-          <CardTitle className="flex items-center gap-2">
-            <Activity className="size-5 text-primary" />
-            AI Detection Summary
-          </CardTitle>
-          {analysisVideoId ? (
-            <CardAction>
-              <PermissionGuard permissions={PERMISSIONS.TICKET.ASSIGN}>
-                <Button
-                  variant="secondary"
-                  onClick={() => setIsAnalysisOpen(true)}
-                >
-                  <Play className="mr-2 size-4" />
-                  View Video
-                </Button>
-              </PermissionGuard>
-            </CardAction>
-          ) : null}
-        </CardHeader>
-        <CardContent className="space-y-4">
-          <div className="grid grid-cols-2 gap-3 lg:grid-cols-3 xl:grid-cols-6">
-            <SummaryCard
-              label="Total Detections"
-              value={ticket.ai_result.detection_count}
-              colorClassName="text-violet-600"
-              cardClassName="bg-violet-500/8"
-            />
-            {ticket.ai_result.detections_by_class.map((item) => {
-              const visual = getDefectVisual(item.class_name);
-              return (
+      <PermissionGuard permissions={PERMISSIONS.TICKET.ASSIGN}>
+        <>
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <Activity className="size-5 text-primary" />
+                AI Detection Summary
+              </CardTitle>
+              {analysisVideoId ? (
+                <CardAction>
+                  <Button
+                    variant="secondary"
+                    onClick={() => setIsAnalysisOpen(true)}
+                  >
+                    <Play className="mr-2 size-4" />
+                    View Video
+                  </Button>
+                </CardAction>
+              ) : null}
+            </CardHeader>
+            <CardContent className="space-y-4">
+              <div className="grid grid-cols-2 gap-3 lg:grid-cols-3 xl:grid-cols-6">
                 <SummaryCard
-                  key={item.class_name}
-                  label={item.display_name}
-                  value={item.count}
-                  colorClassName={visual.colorClassName}
-                  cardClassName={visual.cardClassName}
+                  label="Total Detections"
+                  value={ticket.ai_result.detection_count}
+                  colorClassName="text-violet-600"
+                  cardClassName="bg-violet-500/8"
                 />
-              );
-            })}
-          </div>
-          {hasVideoMetrics ? (
-            <div className="grid gap-3 rounded-lg bg-muted/35 px-4 py-3 text-sm sm:grid-cols-3">
-              {videoMetadata?.fps ? (
-                <VideoMetric icon={Gauge} label={`${videoMetadata.fps} FPS`} />
+                {ticket.ai_result.detections_by_class.map((item) => {
+                  const visual = getDefectVisual(item.class_name);
+                  return (
+                    <SummaryCard
+                      key={item.class_name}
+                      label={item.display_name}
+                      value={item.count}
+                      colorClassName={visual.colorClassName}
+                      cardClassName={visual.cardClassName}
+                    />
+                  );
+                })}
+              </div>
+              {hasVideoMetrics ? (
+                <div className="grid gap-3 rounded-lg bg-muted/35 px-4 py-3 text-sm sm:grid-cols-3">
+                  {videoMetadata?.fps ? (
+                    <VideoMetric
+                      icon={Gauge}
+                      label={`${videoMetadata.fps} FPS`}
+                    />
+                  ) : null}
+                  {duration ? (
+                    <VideoMetric icon={Clock3} label={`${duration} Duration`} />
+                  ) : null}
+                  {videoMetadata?.resolution?.label ? (
+                    <VideoMetric
+                      icon={Monitor}
+                      label={`${videoMetadata.resolution.label} Resolution`}
+                    />
+                  ) : null}
+                </div>
               ) : null}
-              {duration ? (
-                <VideoMetric icon={Clock3} label={`${duration} Duration`} />
-              ) : null}
-              {videoMetadata?.resolution?.label ? (
-                <VideoMetric
-                  icon={Monitor}
-                  label={`${videoMetadata.resolution.label} Resolution`}
-                />
-              ) : null}
-            </div>
-          ) : null}
-        </CardContent>
-      </Card>
+            </CardContent>
+          </Card>
 
-      <Dialog open={isAnalysisOpen} onOpenChange={setIsAnalysisOpen}>
-        <DialogContent className="sm:max-w-5xl">
-          <DialogHeader>
-            <DialogTitle>{analysisTitle}</DialogTitle>
-            <DialogDescription>
-              Video analysis with annotation overlay
-            </DialogDescription>
-          </DialogHeader>
-          <DialogBody>
-            <TicketInlineAnalysisVideo ticket={ticket} />
-          </DialogBody>
-        </DialogContent>
-      </Dialog>
+          <Dialog open={isAnalysisOpen} onOpenChange={setIsAnalysisOpen}>
+            <DialogContent className="sm:max-w-5xl">
+              <DialogHeader>
+                <DialogTitle>{analysisTitle}</DialogTitle>
+                <DialogDescription>
+                  Video analysis with annotation overlay
+                </DialogDescription>
+              </DialogHeader>
+              <DialogBody>
+                <TicketInlineAnalysisVideo ticket={ticket} />
+              </DialogBody>
+            </DialogContent>
+          </Dialog>
+        </>
+      </PermissionGuard>
     </div>
   );
 }