From b2cf0292aeec1419ddd8562e80fdd2e90d8f0847 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Fri, 11 Oct 2024 14:52:01 -0600
Subject: [PATCH] Add docs link for bounding box colors

---
 web/src/views/settings/ObjectSettingsView.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/web/src/views/settings/ObjectSettingsView.tsx b/web/src/views/settings/ObjectSettingsView.tsx
index eae874821..8b6c99f4f 100644
--- a/web/src/views/settings/ObjectSettingsView.tsx
+++ b/web/src/views/settings/ObjectSettingsView.tsx
@@ -16,6 +16,8 @@ import useDeepMemo from "@/hooks/use-deep-memo";
 import { Card } from "@/components/ui/card";
 import { getIconForLabel } from "@/utils/iconUtil";
 import { capitalizeFirstLetter } from "@/utils/stringUtil";
+import { Link } from "react-router-dom";
+import { LuExternalLink } from "react-icons/lu";
 
 type ObjectSettingsViewProps = {
   selectedCamera?: string;
@@ -134,6 +136,17 @@ export default function ObjectSettingsView({
             statistics. The object list shows a time-delayed summary of detected
             objects.
           </p>
+          <div className="flex items-center text-primary">
+            <Link
+              to="https://docs.frigate.video/frigate/glossary#bounding-box-colors"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="inline"
+            >
+              Read the meaning of bounding box colors
+              <LuExternalLink className="ml-2 inline-flex size-3" />
+            </Link>
+          </div>
         </div>
 
         <Tabs defaultValue="debug" className="w-full">