add docs link to media sync settings

This commit is contained in:
Josh Hawkins 2026-04-28 22:36:44 -05:00
parent 24b7653ea8
commit a92215480e

View File

@ -10,13 +10,16 @@ import axios from "axios";
import { toast } from "sonner"; import { toast } from "sonner";
import { useJobStatus } from "@/api/ws"; import { useJobStatus } from "@/api/ws";
import { Switch } from "@/components/ui/switch"; import { Switch } from "@/components/ui/switch";
import { LuCheck, LuX } from "react-icons/lu"; import { LuCheck, LuExternalLink, LuX } from "react-icons/lu";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { formatUnixTimestampToDateTime } from "@/utils/dateUtil"; import { formatUnixTimestampToDateTime } from "@/utils/dateUtil";
import { MediaSyncResults, MediaSyncStats } from "@/types/ws"; import { MediaSyncResults, MediaSyncStats } from "@/types/ws";
import { useDocDomain } from "@/hooks/use-doc-domain";
import { Link } from "react-router-dom";
export default function MediaSyncSettingsView() { export default function MediaSyncSettingsView() {
const { t } = useTranslation("views/settings"); const { t } = useTranslation("views/settings");
const { getLocaleDocUrl } = useDocDomain();
const [selectedMediaTypes, setSelectedMediaTypes] = useState<string[]>([ const [selectedMediaTypes, setSelectedMediaTypes] = useState<string[]>([
"all", "all",
]); ]);
@ -109,13 +112,25 @@ export default function MediaSyncSettingsView() {
<Heading as="h4" className="mb-2 hidden md:block"> <Heading as="h4" className="mb-2 hidden md:block">
{t("maintenance.sync.title")} {t("maintenance.sync.title")}
</Heading> </Heading>
<div className="max-w-6xl"> <div className="max-w-6xl">
<div className="mb-5 mt-2 flex max-w-5xl flex-col gap-2 text-sm text-muted-foreground"> <div className="mb-5 mt-2 flex max-w-5xl flex-col gap-2 text-sm text-primary-variant">
<p>{t("maintenance.sync.desc")}</p> <p>{t("maintenance.sync.desc")}</p>
<div className="flex items-center text-primary">
<Link
to={getLocaleDocUrl(
"configuration/record#syncing-media-files-with-disk",
)}
target="_blank"
rel="noopener noreferrer"
className="inline"
>
{t("readTheDocumentation", { ns: "common" })}
<LuExternalLink className="ml-2 inline-flex size-3" />
</Link>
</div>
</div> </div>
</div> </div>
<div className="space-y-6"> <div className="space-y-6">
{/* Media Types Selection */} {/* Media Types Selection */}
<div> <div>