From 6376fbe8cbeeb8dc2e4c56dfb0a1be2d6d0e4eb4 Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Fri, 9 May 2025 11:00:37 -0500
Subject: [PATCH] add link to speed estimation docs in zone edit pane

---
 web/public/locales/en/views/settings.json    |  3 ++-
 web/src/components/settings/ZoneEditPane.tsx | 13 +++++++++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/web/public/locales/en/views/settings.json b/web/public/locales/en/views/settings.json
index 62ad98f35..d5f9e140d 100644
--- a/web/public/locales/en/views/settings.json
+++ b/web/public/locales/en/views/settings.json
@@ -268,7 +268,8 @@
       "allObjects": "All Objects",
       "speedEstimation": {
         "title": "Speed Estimation",
-        "desc": "Enable speed estimation for objects in this zone. The zone must have exactly 4 points."
+        "desc": "Enable speed estimation for objects in this zone. The zone must have exactly 4 points.",
+        "docs": "Read the documentation"
       },
       "speedThreshold": {
         "title": "Speed Threshold ({{unit}})",
diff --git a/web/src/components/settings/ZoneEditPane.tsx b/web/src/components/settings/ZoneEditPane.tsx
index 5e8681732..2df97c29e 100644
--- a/web/src/components/settings/ZoneEditPane.tsx
+++ b/web/src/components/settings/ZoneEditPane.tsx
@@ -30,6 +30,8 @@ import { flattenPoints, interpolatePoints } from "@/utils/canvasUtil";
 import ActivityIndicator from "../indicators/activity-indicator";
 import { getAttributeLabels } from "@/utils/iconUtil";
 import { Trans, useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
+import { LuExternalLink } from "react-icons/lu";
 
 type ZoneEditPaneProps = {
   polygons?: Polygon[];
@@ -669,6 +671,17 @@ export default function ZoneEditPane({
                 </div>
                 <FormDescription>
                   {t("masksAndZones.zones.speedEstimation.desc")}
+                  <div className="mt-2 flex items-center text-primary">
+                    <Link
+                      to="https://docs.frigate.video/configuration/zones#speed-estimation"
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      className="inline"
+                    >
+                      {t("masksAndZones.zones.speedEstimation.docs")}
+                      <LuExternalLink className="ml-2 inline-flex size-3" />
+                    </Link>
+                  </div>
                 </FormDescription>
                 <FormMessage />
               </FormItem>