From dd5ad11a6e726ab13a19fc29d89c5032d8bbfbfd Mon Sep 17 00:00:00 2001
From: 0x464e <36742501+0x464e@users.noreply.github.com>
Date: Fri, 20 Mar 2026 21:19:00 +0200
Subject: [PATCH] Fixes based off PR review comments

---
 .../overlay/ShareTimestampDialog.tsx          | 21 ++++++++++++-------
 web/src/utils/recordingReviewUrl.ts           | 15 +++++++------
 web/src/views/recording/RecordingView.tsx     |  1 -
 3 files changed, 23 insertions(+), 14 deletions(-)

diff --git a/web/src/components/overlay/ShareTimestampDialog.tsx b/web/src/components/overlay/ShareTimestampDialog.tsx
index 9f8e6813c..846d84377 100644
--- a/web/src/components/overlay/ShareTimestampDialog.tsx
+++ b/web/src/components/overlay/ShareTimestampDialog.tsx
@@ -17,6 +17,7 @@ import {
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { Separator } from "@/components/ui/separator";
 import { useFormattedTimestamp } from "@/hooks/use-date-utils";
+import { cn } from "@/lib/utils";
 import { FrigateConfig } from "@/types/frigateConfig";
 import { getUTCOffset } from "@/utils/dateUtil";
 import { useCallback, useMemo, useState } from "react";
@@ -204,19 +205,22 @@ export function ShareTimestampContent({
       {isDesktop && <Separator className="my-4 bg-secondary" />}
 
       <DialogFooter
-        className={isDesktop ? "mt-4" : "mt-4 flex flex-col-reverse gap-4"}
+        className={cn("mt-4", !isDesktop && "flex flex-col-reverse gap-4")}
       >
         {onCancel && (
-          <button
+          <Button
             type="button"
-            className={`cursor-pointer p-2 text-center ${isDesktop ? "" : "w-full"}`}
+            className={cn(
+              "cursor-pointer p-2 text-center",
+              !isDesktop && "w-full",
+            )}
             onClick={onCancel}
           >
             {t("button.cancel", { ns: "common" })}
-          </button>
+          </Button>
         )}
         <Button
-          className={isDesktop ? "" : "w-full"}
+          className={cn(!isDesktop && "w-full")}
           variant="select"
           size="sm"
           onClick={() => onShareTimestamp(Math.floor(selectedTimestamp))}
@@ -298,7 +302,10 @@ function CustomTimestampSelector({
 
   return (
     <div
-      className={`flex items-center rounded-lg bg-secondary text-secondary-foreground ${isDesktop ? "gap-2 px-2" : "pl-2"}`}
+      className={cn(
+        "flex items-center rounded-lg bg-secondary text-secondary-foreground",
+        isDesktop ? "gap-2 px-2" : "pl-2",
+      )}
     >
       <FaCalendarAlt />
       <div className="flex flex-wrap items-center">
@@ -312,7 +319,7 @@ function CustomTimestampSelector({
         >
           <PopoverTrigger asChild>
             <Button
-              className={`text-primary ${isDesktop ? "" : "text-xs"}`}
+              className={cn("text-primary", !isDesktop && "text-xs")}
               aria-label={label}
               variant={selectorOpen ? "select" : "default"}
               size="sm"
diff --git a/web/src/utils/recordingReviewUrl.ts b/web/src/utils/recordingReviewUrl.ts
index fbd67974b..0bc8960d0 100644
--- a/web/src/utils/recordingReviewUrl.ts
+++ b/web/src/utils/recordingReviewUrl.ts
@@ -1,3 +1,5 @@
+import { baseUrl } from "@/api/baseUrl.ts";
+
 export const RECORDING_REVIEW_LINK_PARAM = "timestamp";
 
 export type RecordingReviewLinkState = {
@@ -43,11 +45,12 @@ export function createRecordingReviewUrl(
   pathname: string,
   state: RecordingReviewLinkState,
 ): string {
-  const url = new URL(globalThis.location.href);
-  const normalizedPathname = pathname.startsWith("/")
-    ? pathname
-    : `/${pathname}`;
-  const reviewLink = `${state.camera}_${Math.floor(state.timestamp)}`;
+  const url = new URL(baseUrl);
+  url.pathname = pathname.startsWith("/") ? pathname : `/${pathname}`;
+  url.searchParams.set(
+    RECORDING_REVIEW_LINK_PARAM,
+    `${state.camera}_${Math.floor(state.timestamp)}`,
+  );
 
-  return `${url.origin}${normalizedPathname}?${RECORDING_REVIEW_LINK_PARAM}=${reviewLink}`;
+  return url.toString();
 }
diff --git a/web/src/views/recording/RecordingView.tsx b/web/src/views/recording/RecordingView.tsx
index 7b1b2aa48..b4e237184 100644
--- a/web/src/views/recording/RecordingView.tsx
+++ b/web/src/views/recording/RecordingView.tsx
@@ -691,7 +691,6 @@ export function RecordingView({
             )}
             {isDesktop && (
               <ShareTimestampDialog
-                key={shareTimestampAtOpen}
                 currentTime={shareTimestampAtOpen}
                 open={shareTimestampOpen}
                 onOpenChange={setShareTimestampOpen}