From d2f88491b14c27249190e0c8e74a7ace50db6abf Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Tue, 9 Jul 2024 14:36:55 -0500
Subject: [PATCH] Various UI tweaks and changes (#12364)

---
 web/src/components/navigation/Sidebar.tsx    | 6 +++++-
 web/src/components/player/HlsVideoPlayer.tsx | 2 +-
 web/src/pages/SubmitPlus.tsx                 | 2 +-
 web/src/views/live/LiveBirdseyeView.tsx      | 2 +-
 web/src/views/live/LiveCameraView.tsx        | 2 +-
 5 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/web/src/components/navigation/Sidebar.tsx b/web/src/components/navigation/Sidebar.tsx
index 35a02d7dca..27ea9805c5 100644
--- a/web/src/components/navigation/Sidebar.tsx
+++ b/web/src/components/navigation/Sidebar.tsx
@@ -5,9 +5,12 @@ import { useLocation } from "react-router-dom";
 import GeneralSettings from "../menu/GeneralSettings";
 import AccountSettings from "../menu/AccountSettings";
 import useNavigation from "@/hooks/use-navigation";
+import { baseUrl } from "@/api/baseUrl";
+import { useMemo } from "react";
 
 function Sidebar() {
   const location = useLocation();
+  const basePath = useMemo(() => new URL(baseUrl).pathname, []);
 
   const navbarLinks = useNavigation();
 
@@ -18,7 +21,8 @@ function Sidebar() {
         <Logo className="mb-6 h-8 w-8" />
         {navbarLinks.map((item) => {
           const showCameraGroups =
-            item.id == 1 && item.url == location.pathname;
+            item.id == 1 &&
+            (location.pathname === "/" || location.pathname === basePath);
 
           return (
             <div key={item.id}>
diff --git a/web/src/components/player/HlsVideoPlayer.tsx b/web/src/components/player/HlsVideoPlayer.tsx
index 5562303b2a..d66ed4b53b 100644
--- a/web/src/components/player/HlsVideoPlayer.tsx
+++ b/web/src/components/player/HlsVideoPlayer.tsx
@@ -161,7 +161,7 @@ export default function HlsVideoPlayer({
   }, [videoRef, controlsOpen]);
 
   return (
-    <TransformWrapper minScale={1.0}>
+    <TransformWrapper minScale={1.0} wheel={{ smoothStep: 0.005 }}>
       <VideoControls
         className={cn(
           "absolute left-1/2 z-50 -translate-x-1/2",
diff --git a/web/src/pages/SubmitPlus.tsx b/web/src/pages/SubmitPlus.tsx
index b4c9f2d6fd..0fa092437b 100644
--- a/web/src/pages/SubmitPlus.tsx
+++ b/web/src/pages/SubmitPlus.tsx
@@ -456,7 +456,7 @@ function PlusFilterGroup({
             <div className="hidden text-primary md:block">
               {selectedScoreRange == undefined
                 ? "Score Range"
-                : `${selectedScoreRange[0] * 100}% - ${selectedScoreRange[1] * 100}%`}
+                : `${Math.round(selectedScoreRange[0] * 100)}% - ${Math.round(selectedScoreRange[1] * 100)}%`}
             </div>
           </Button>
         </Trigger>
diff --git a/web/src/views/live/LiveBirdseyeView.tsx b/web/src/views/live/LiveBirdseyeView.tsx
index 8f7ebda771..01146f643b 100644
--- a/web/src/views/live/LiveBirdseyeView.tsx
+++ b/web/src/views/live/LiveBirdseyeView.tsx
@@ -111,7 +111,7 @@ export default function LiveBirdseyeView({
   }
 
   return (
-    <TransformWrapper minScale={1.0}>
+    <TransformWrapper minScale={1.0} wheel={{ smoothStep: 0.005 }}>
       <div
         ref={mainRef}
         className={
diff --git a/web/src/views/live/LiveCameraView.tsx b/web/src/views/live/LiveCameraView.tsx
index f148f01ee5..61cf7d42f0 100644
--- a/web/src/views/live/LiveCameraView.tsx
+++ b/web/src/views/live/LiveCameraView.tsx
@@ -295,7 +295,7 @@ export default function LiveCameraView({
   }, []);
 
   return (
-    <TransformWrapper minScale={1.0}>
+    <TransformWrapper minScale={1.0} wheel={{ smoothStep: 0.005 }}>
       <div
         ref={mainRef}
         className={