diff --git a/web/src/components/card/SearchThumbnail.tsx b/web/src/components/card/SearchThumbnail.tsx
index b41533f7b..f53756be0 100644
--- a/web/src/components/card/SearchThumbnail.tsx
+++ b/web/src/components/card/SearchThumbnail.tsx
@@ -56,6 +56,11 @@ export default function SearchThumbnail({
return `${searchResult.label}-verified`;
}, [config, searchResult]);
+ const hasRecognizedPlate = useMemo(
+ () => (searchResult.data.recognized_license_plate?.length || 0) > 0,
+ [searchResult],
+ );
+
return (
onClick(searchResult, false, true)}
>
- {getIconForLabel(objectLabel, "size-3 text-white")}
+ {getIconForLabel(
+ `${objectLabel}${hasRecognizedPlate ? "-plate" : ""}`,
+ "size-3 text-white",
+ )}
{Math.round(
(searchResult.data.score ??
searchResult.data.top_score ??
diff --git a/web/src/utils/iconUtil.tsx b/web/src/utils/iconUtil.tsx
index e4356c290..8cca78ab5 100644
--- a/web/src/utils/iconUtil.tsx
+++ b/web/src/utils/iconUtil.tsx
@@ -32,7 +32,7 @@ import {
GiRaccoonHead,
GiSailboat,
} from "react-icons/gi";
-import { LuBox, LuLassoSelect } from "react-icons/lu";
+import { LuBox, LuLassoSelect, LuScanBarcode } from "react-icons/lu";
import * as LuIcons from "react-icons/lu";
import { MdRecordVoiceOver } from "react-icons/md";
import { PiBirdFill } from "react-icons/pi";
@@ -57,6 +57,8 @@ export function isValidIconName(value: string): value is IconName {
export function getIconForLabel(label: string, className?: string) {
if (label.endsWith("-verified")) {
return getVerifiedIcon(label, className);
+ } else if (label.endsWith("-plate")) {
+ return getRecognizedPlateIcon(label, className);
}
switch (label) {
@@ -153,3 +155,14 @@ function getVerifiedIcon(label: string, className?: string) {
);
}
+
+function getRecognizedPlateIcon(label: string, className?: string) {
+ const simpleLabel = label.substring(0, label.lastIndexOf("-"));
+
+ return (
+
+ {getIconForLabel(simpleLabel, className)}
+
+
+ );
+}