Miscellaneous fixes (#22924)

* apply annotation offset to frigate+ submission frame time

* fix broken docs links with hash fragments that resolve wrong on reload

* undo

* use recording snapshot for frigate+ frame submission from VideoControls

rather than a canvas grab/paint, which may not always align with an ffmpeg snapshot due to keyframes

* add more docs links

- display docs link for main sections on collapsible fields

* dialog button consistency

web/src/components/config-form/theme/templates/ObjectFieldTemplate.tsx

@@ -9,11 +9,13 @@ import {
 import { Children, useState, useEffect, useRef } from "react";
 import type { ReactNode } from "react";
 import RestartRequiredIndicator from "@/components/indicators/RestartRequiredIndicator";
-import { LuChevronDown, LuChevronRight } from "react-icons/lu";
+import { LuChevronDown, LuChevronRight, LuExternalLink } from "react-icons/lu";
 import { useTranslation } from "react-i18next";
+import { Link } from "react-router-dom";
 import { cn } from "@/lib/utils";
 import { getTranslatedLabel } from "@/utils/i18n";
 import { requiresRestartForFieldPath } from "@/utils/configUtil";
+import { useDocDomain } from "@/hooks/use-doc-domain";
 import { ConfigFormContext } from "@/types/configForm";
 import {
   buildTranslationPath,
@@ -178,6 +180,7 @@ export function ObjectFieldTemplate(props: ObjectFieldTemplateProps) {
     "views/settings",
     "common",
   ]);
+  const { getLocaleDocUrl } = useDocDomain();
   const objectRequiresRestart = requiresRestartForFieldPath(
     fieldPath,
     restartRequired,
@@ -300,6 +303,17 @@ export function ObjectFieldTemplate(props: ObjectFieldTemplateProps) {
     schemaDescription;
   inferredDescription = inferredDescription ?? fallbackDescription;
 
+  const pathStringSegments =
+    path?.filter((segment): segment is string => typeof segment === "string") ??
+    [];
+  const fieldDocsKey = translationPath || pathStringSegments.join(".");
+  const fieldDocsPath = fieldDocsKey
+    ? formContext?.fieldDocs?.[fieldDocsKey]
+    : undefined;
+  const fieldDocsUrl = fieldDocsPath
+    ? getLocaleDocUrl(fieldDocsPath)
+    : undefined;
+
   const renderGroupedFields = (items: (typeof properties)[number][]) => {
     if (!items.length) {
       return null;
@@ -466,6 +480,20 @@ export function ObjectFieldTemplate(props: ObjectFieldTemplateProps) {
                     {inferredDescription}
                   </p>
                 )}
+                {fieldDocsUrl && (
+                  <div className="mt-1 flex items-center text-xs text-primary-variant">
+                    <Link
+                      to={fieldDocsUrl}
+                      target="_blank"
+                      rel="noopener noreferrer"
+                      className="inline"
+                      onClick={(e) => e.stopPropagation()}
+                    >
+                      {t("readTheDocumentation", { ns: "common" })}
+                      <LuExternalLink className="ml-2 inline-flex size-3" />
+                    </Link>
+                  </div>
+                )}
               </div>
               {isOpen ? (
                 <LuChevronDown className="h-4 w-4 shrink-0" />