From 992a854d3654c567daff33b54560e103b0aacff2 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Wed, 21 Feb 2024 06:16:34 -0700
Subject: [PATCH] Show icons for sub labels

---
 .../player/PreviewThumbnailPlayer.tsx         |  5 ++++-
 web/src/types/review.ts                       |  2 +-
 web/src/utils/iconUtil.tsx                    | 20 ++++++++++++++++++-
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/web/src/components/player/PreviewThumbnailPlayer.tsx b/web/src/components/player/PreviewThumbnailPlayer.tsx
index 28e4acce8..844abd366 100644
--- a/web/src/components/player/PreviewThumbnailPlayer.tsx
+++ b/web/src/components/player/PreviewThumbnailPlayer.tsx
@@ -6,7 +6,7 @@ import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
 import { isSafari } from "@/utils/browserUtil";
 import { ReviewSegment } from "@/types/review";
 import { Slider } from "../ui/slider";
-import { getIconForLabel } from "@/utils/iconUtil";
+import { getIconForLabel, getIconForSubLabel } from "@/utils/iconUtil";
 import TimeAgo from "../dynamic/TimeAgo";
 import useSWR from "swr";
 import { FrigateConfig } from "@/types/frigateConfig";
@@ -157,6 +157,9 @@ export default function PreviewThumbnailPlayer({
             {review.data.audio.map((audio) => {
               return getIconForLabel(audio, "w-3 h-3 text-white");
             })}
+            {review.data.sub_labels?.map((sub) => {
+              return getIconForSubLabel(sub, "w-3 h-3 text-white");
+            })}
           </div>
         )}
       {!hover && (
diff --git a/web/src/types/review.ts b/web/src/types/review.ts
index bb094f240..55a08a819 100644
--- a/web/src/types/review.ts
+++ b/web/src/types/review.ts
@@ -15,7 +15,7 @@ export type ReviewData = {
   audio: string[];
   detections: string[];
   objects: string[];
-  sub_labels?: [string, number][];
+  sub_labels?: string[];
   significant_motion_areas: number[];
   zones: string[];
 };
diff --git a/web/src/utils/iconUtil.tsx b/web/src/utils/iconUtil.tsx
index 83d1ba2db..8517f519c 100644
--- a/web/src/utils/iconUtil.tsx
+++ b/web/src/utils/iconUtil.tsx
@@ -1,5 +1,12 @@
 import { BsPersonWalking } from "react-icons/bs";
-import { FaCarSide, FaCat, FaDog } from "react-icons/fa";
+import {
+  FaAmazon,
+  FaCarSide,
+  FaCat,
+  FaDog,
+  FaFedex,
+  FaUps,
+} from "react-icons/fa";
 import { LuBox, LuLassoSelect } from "react-icons/lu";
 
 export function getIconForLabel(label: string, className?: string) {
@@ -18,3 +25,14 @@ export function getIconForLabel(label: string, className?: string) {
       return <LuLassoSelect key={label} className={className} />;
   }
 }
+
+export function getIconForSubLabel(label: string, className?: string) {
+  switch (label) {
+    case "amazon":
+      return <FaAmazon key={label} className={className} />;
+    case "fedex":
+      return <FaFedex key={label} className={className} />;
+    case "ups":
+      return <FaUps key={label} className={className} />;
+  }
+}