From 2f78f63c5129c123bd7eddddd5b3553063a9630f Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Tue, 9 Apr 2024 13:46:19 -0500
Subject: [PATCH] change secondary button variant to be default button

---
 web/src/components/dynamic/NewReviewData.tsx             | 1 -
 web/src/components/filter/LogLevelFilter.tsx             | 2 +-
 web/src/components/filter/ReviewActionGroup.tsx          | 3 ---
 web/src/components/filter/ReviewFilterGroup.tsx          | 9 +--------
 web/src/components/overlay/ExportDialog.tsx              | 5 ++---
 web/src/components/overlay/MobileCameraDrawer.tsx        | 2 +-
 .../components/overlay/MobileReviewSettingsDrawer.tsx    | 5 -----
 web/src/components/overlay/MobileTimelineDrawer.tsx      | 2 +-
 web/src/components/overlay/SaveExportOverlay.tsx         | 1 -
 web/src/components/overlay/VainfoDialog.tsx              | 4 +---
 web/src/components/ui/button.tsx                         | 5 ++---
 web/src/pages/Logs.tsx                                   | 2 --
 web/src/pages/SubmitPlus.tsx                             | 4 ++--
 web/src/views/events/RecordingView.tsx                   | 1 -
 web/src/views/live/LiveCameraView.tsx                    | 2 --
 web/src/views/system/GeneralMetrics.tsx                  | 1 -
 16 files changed, 11 insertions(+), 38 deletions(-)

diff --git a/web/src/components/dynamic/NewReviewData.tsx b/web/src/components/dynamic/NewReviewData.tsx
index f690b9101..09a547c1b 100644
--- a/web/src/components/dynamic/NewReviewData.tsx
+++ b/web/src/components/dynamic/NewReviewData.tsx
@@ -34,7 +34,6 @@ export default function NewReviewData({
               ? "animate-in slide-in-from-top duration-500"
               : "invisible"
           }  text-center mt-5 mx-auto bg-gray-400 text-white`}
-          variant="secondary"
           onClick={() => {
             pullLatestData();
             if (contentRef.current) {
diff --git a/web/src/components/filter/LogLevelFilter.tsx b/web/src/components/filter/LogLevelFilter.tsx
index 59613132b..a9e58e463 100644
--- a/web/src/components/filter/LogLevelFilter.tsx
+++ b/web/src/components/filter/LogLevelFilter.tsx
@@ -17,7 +17,7 @@ export function LogLevelFilterButton({
   updateLabelFilter,
 }: LogLevelFilterButtonProps) {
   const trigger = (
-    <Button size="sm" className="flex items-center gap-2" variant="secondary">
+    <Button size="sm" className="flex items-center gap-2">
       <FaFilter className="text-secondary-foreground" />
       <div className="hidden md:block text-primary">Filter</div>
     </Button>
diff --git a/web/src/components/filter/ReviewActionGroup.tsx b/web/src/components/filter/ReviewActionGroup.tsx
index c794167d2..cd31112af 100644
--- a/web/src/components/filter/ReviewActionGroup.tsx
+++ b/web/src/components/filter/ReviewActionGroup.tsx
@@ -50,7 +50,6 @@ export default function ReviewActionGroup({
         {selectedReviews.length == 1 && (
           <Button
             className="p-2 flex items-center gap-2"
-            variant="secondary"
             size="sm"
             onClick={() => {
               onExport(selectedReviews[0]);
@@ -63,7 +62,6 @@ export default function ReviewActionGroup({
         )}
         <Button
           className="p-2 flex items-center gap-2"
-          variant="secondary"
           size="sm"
           onClick={onMarkAsReviewed}
         >
@@ -72,7 +70,6 @@ export default function ReviewActionGroup({
         </Button>
         <Button
           className="p-2 flex items-center gap-1"
-          variant="secondary"
           size="sm"
           onClick={onDelete}
         >
diff --git a/web/src/components/filter/ReviewFilterGroup.tsx b/web/src/components/filter/ReviewFilterGroup.tsx
index 04bd5b9be..8d7952948 100644
--- a/web/src/components/filter/ReviewFilterGroup.tsx
+++ b/web/src/components/filter/ReviewFilterGroup.tsx
@@ -223,7 +223,6 @@ function CamerasFilterButton({
   const trigger = (
     <Button
       className={`flex items-center gap-2 capitalize ${selectedCameras?.length ? "bg-selected hover:bg-selected" : ""}`}
-      variant="secondary"
       size="sm"
     >
       <FaVideo
@@ -314,7 +313,6 @@ function CamerasFilterButton({
           Apply
         </Button>
         <Button
-          variant="secondary"
           onClick={() => {
             setCurrentCameras(undefined);
             updateCameraFilter(undefined);
@@ -393,7 +391,6 @@ function ShowReviewFilter({
       <Button
         className={`block md:hidden duration-0 ${showReviewedSwitch == 1 ? "bg-selected hover:bg-selected" : "bg-secondary hover:bg-secondary/80"}`}
         size="sm"
-        variant="secondary"
         onClick={() => setShowReviewedSwitch(showReviewedSwitch == 0 ? 1 : 0)}
       >
         <FaCheckCircle
@@ -423,7 +420,6 @@ function CalendarFilterButton({
     <Button
       size="sm"
       className={`flex items-center gap-2 ${day == undefined ? "bg-secondary hover:bg-secondary/80" : "bg-selected hover:bg-selected"}`}
-      variant="secondary"
     >
       <FaCalendarAlt
         className={`${day == undefined ? "text-secondary-foreground" : "text-primary"}`}
@@ -443,7 +439,6 @@ function CalendarFilterButton({
       <DropdownMenuSeparator />
       <div className="p-2 flex justify-center items-center">
         <Button
-          variant="secondary"
           onClick={() => {
             updateSelectedDay(undefined);
           }}
@@ -487,7 +482,7 @@ function GeneralFilterButton({
   );
 
   const trigger = (
-    <Button size="sm" className="flex items-center gap-2" variant="secondary">
+    <Button size="sm" className="flex items-center gap-2">
       <FaFilter className="text-secondary-foreground" />
       <div className="hidden md:block text-primary">Filter</div>
     </Button>
@@ -632,7 +627,6 @@ export function GeneralFilterContent({
           Apply
         </Button>
         <Button
-          variant="secondary"
           onClick={() => {
             setCurrentLabels(undefined);
             updateLabelFilter(undefined);
@@ -678,7 +672,6 @@ function ShowMotionOnlyButton({
       <div className="block md:hidden">
         <Button
           size="sm"
-          variant="secondary"
           className={`duration-0 ${motionOnlyButton ? "bg-selected hover:bg-selected" : "bg-secondary hover:bg-secondary/80"}`}
           onClick={() => setMotionOnlyButton(!motionOnlyButton)}
         >
diff --git a/web/src/components/overlay/ExportDialog.tsx b/web/src/components/overlay/ExportDialog.tsx
index b4357791f..a608528bb 100644
--- a/web/src/components/overlay/ExportDialog.tsx
+++ b/web/src/components/overlay/ExportDialog.tsx
@@ -119,7 +119,6 @@ export default function ExportDialog({
         <Trigger asChild>
           <Button
             className="flex items-center gap-2"
-            variant="secondary"
             size="sm"
             onClick={() => {
               setMode("select");
@@ -388,7 +387,7 @@ function CustomTimeSelector({
         <PopoverTrigger asChild>
           <Button
             className={`text-primary ${isDesktop ? "" : "text-xs"}`}
-            variant={startOpen ? "select" : "secondary"}
+            variant={startOpen ? "select" : "default"}
             size="sm"
             onClick={() => {
               setStartOpen(true);
@@ -450,7 +449,7 @@ function CustomTimeSelector({
         <PopoverTrigger asChild>
           <Button
             className={`text-primary ${isDesktop ? "" : "text-xs"}`}
-            variant={endOpen ? "select" : "secondary"}
+            variant={endOpen ? "select" : "default"}
             size="sm"
             onClick={() => {
               setEndOpen(true);
diff --git a/web/src/components/overlay/MobileCameraDrawer.tsx b/web/src/components/overlay/MobileCameraDrawer.tsx
index e11a49eb3..1a132f5d6 100644
--- a/web/src/components/overlay/MobileCameraDrawer.tsx
+++ b/web/src/components/overlay/MobileCameraDrawer.tsx
@@ -23,7 +23,7 @@ export default function MobileCameraDrawer({
   return (
     <Drawer open={cameraDrawer} onOpenChange={setCameraDrawer}>
       <DrawerTrigger asChild>
-        <Button className="rounded-lg capitalize" size="sm" variant="secondary">
+        <Button className="rounded-lg capitalize" size="sm">
           <FaVideo className="text-secondary-foreground" />
         </Button>
       </DrawerTrigger>
diff --git a/web/src/components/overlay/MobileReviewSettingsDrawer.tsx b/web/src/components/overlay/MobileReviewSettingsDrawer.tsx
index 39d2e67a7..02b06253f 100644
--- a/web/src/components/overlay/MobileReviewSettingsDrawer.tsx
+++ b/web/src/components/overlay/MobileReviewSettingsDrawer.tsx
@@ -138,7 +138,6 @@ export default function MobileReviewSettingsDrawer({
         {features.includes("export") && (
           <Button
             className="w-full flex justify-center items-center gap-2"
-            variant="secondary"
             onClick={() => setDrawerMode("export")}
           >
             <FaArrowDown className="p-1 fill-secondary bg-secondary-foreground rounded-md" />
@@ -148,7 +147,6 @@ export default function MobileReviewSettingsDrawer({
         {features.includes("calendar") && (
           <Button
             className="w-full flex justify-center items-center gap-2"
-            variant="secondary"
             onClick={() => setDrawerMode("calendar")}
           >
             <FaCalendarAlt className="fill-secondary-foreground" />
@@ -158,7 +156,6 @@ export default function MobileReviewSettingsDrawer({
         {features.includes("filter") && (
           <Button
             className="w-full flex justify-center items-center gap-2"
-            variant="secondary"
             onClick={() => setDrawerMode("filter")}
           >
             <FaFilter className="fill-secondary-foreground" />
@@ -223,7 +220,6 @@ export default function MobileReviewSettingsDrawer({
         <SelectSeparator />
         <div className="p-2 flex justify-center items-center">
           <Button
-            variant="secondary"
             onClick={() => {
               onUpdateFilter({
                 ...filter,
@@ -285,7 +281,6 @@ export default function MobileReviewSettingsDrawer({
           <Button
             className="rounded-lg capitalize"
             size="sm"
-            variant="secondary"
             onClick={() => setDrawerMode("select")}
           >
             <FaCog className="text-secondary-foreground" />
diff --git a/web/src/components/overlay/MobileTimelineDrawer.tsx b/web/src/components/overlay/MobileTimelineDrawer.tsx
index 806651f1a..f0f7349aa 100644
--- a/web/src/components/overlay/MobileTimelineDrawer.tsx
+++ b/web/src/components/overlay/MobileTimelineDrawer.tsx
@@ -22,7 +22,7 @@ export default function MobileTimelineDrawer({
   return (
     <Drawer open={drawer} onOpenChange={setDrawer}>
       <DrawerTrigger asChild>
-        <Button className="rounded-lg capitalize" size="sm" variant="secondary">
+        <Button className="rounded-lg capitalize" size="sm">
           <FaFlag className="text-secondary-foreground" />
         </Button>
       </DrawerTrigger>
diff --git a/web/src/components/overlay/SaveExportOverlay.tsx b/web/src/components/overlay/SaveExportOverlay.tsx
index ec83c2a77..340430dee 100644
--- a/web/src/components/overlay/SaveExportOverlay.tsx
+++ b/web/src/components/overlay/SaveExportOverlay.tsx
@@ -33,7 +33,6 @@ export default function SaveExportOverlay({
         <Button
           className="flex items-center gap-1 text-primary"
           size="sm"
-          variant="secondary"
           onClick={onCancel}
         >
           <LuX />
diff --git a/web/src/components/overlay/VainfoDialog.tsx b/web/src/components/overlay/VainfoDialog.tsx
index 51cd78f33..b2ede5ae8 100644
--- a/web/src/components/overlay/VainfoDialog.tsx
+++ b/web/src/components/overlay/VainfoDialog.tsx
@@ -44,9 +44,7 @@ export default function VainfoDialog({
           <ActivityIndicator />
         )}
         <DialogFooter>
-          <Button variant="secondary" onClick={() => setShowVainfo(false)}>
-            Close
-          </Button>
+          <Button onClick={() => setShowVainfo(false)}>Close</Button>
           <Button variant="select" onClick={() => onCopyVainfo()}>
             Copy
           </Button>
diff --git a/web/src/components/ui/button.tsx b/web/src/components/ui/button.tsx
index 2f4b1a3a7..b3b0e451f 100644
--- a/web/src/components/ui/button.tsx
+++ b/web/src/components/ui/button.tsx
@@ -9,14 +9,13 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        default: "bg-secondary text-primary hover:bg-secondary/80",
         select: "bg-selected text-white hover:bg-opacity-90",
         destructive:
           "bg-destructive text-destructive-foreground hover:bg-destructive/90",
         outline:
           "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
-        secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        secondary: "bg-primary text-primary-foreground hover:bg-primary/90",
         ghost:
           "text-muted-foreground hover:bg-accent hover:text-accent-foreground",
         link: "text-primary underline-offset-4 hover:underline",
diff --git a/web/src/pages/Logs.tsx b/web/src/pages/Logs.tsx
index f4240b49a..97e1f7c55 100644
--- a/web/src/pages/Logs.tsx
+++ b/web/src/pages/Logs.tsx
@@ -356,7 +356,6 @@ function Logs() {
           <Button
             className="flex justify-between items-center gap-2"
             size="sm"
-            variant="secondary"
             onClick={handleCopyLogs}
           >
             <FaCopy />
@@ -374,7 +373,6 @@ function Logs() {
       {initialScroll && !endVisible && (
         <Button
           className="absolute bottom-8 left-[50%] -translate-x-[50%] rounded-md text-primary bg-secondary-foreground z-20 p-2"
-          variant="secondary"
           onClick={() =>
             contentRef.current?.scrollTo({
               top: contentRef.current?.scrollHeight,
diff --git a/web/src/pages/SubmitPlus.tsx b/web/src/pages/SubmitPlus.tsx
index 138c4fd9f..d1d6fc9c0 100644
--- a/web/src/pages/SubmitPlus.tsx
+++ b/web/src/pages/SubmitPlus.tsx
@@ -237,7 +237,7 @@ function PlusFilterGroup({
         }}
       >
         <Trigger asChild>
-          <Button size="sm" className="mx-1 capitalize" variant="secondary">
+          <Button size="sm" className="mx-1 capitalize">
             <FaVideo className="md:mr-[10px] text-secondary-foreground" />
             <div className="hidden md:block text-primary">
               {selectedCameras == undefined
@@ -314,7 +314,7 @@ function PlusFilterGroup({
         }}
       >
         <Trigger asChild>
-          <Button size="sm" className="mx-1 capitalize" variant="secondary">
+          <Button size="sm" className="mx-1 capitalize">
             <FaList className="md:mr-[10px] text-secondary-foreground" />
             <div className="hidden md:block text-primary">
               {selectedLabels == undefined
diff --git a/web/src/views/events/RecordingView.tsx b/web/src/views/events/RecordingView.tsx
index 90b87fee7..11169a95a 100644
--- a/web/src/views/events/RecordingView.tsx
+++ b/web/src/views/events/RecordingView.tsx
@@ -254,7 +254,6 @@ export function RecordingView({
         <Button
           className="flex items-center gap-2 rounded-lg"
           size="sm"
-          variant="secondary"
           onClick={() => navigate(-1)}
         >
           <IoMdArrowRoundBack className="size-5" size="small" />
diff --git a/web/src/views/live/LiveCameraView.tsx b/web/src/views/live/LiveCameraView.tsx
index 2da2f7141..d0e3509c0 100644
--- a/web/src/views/live/LiveCameraView.tsx
+++ b/web/src/views/live/LiveCameraView.tsx
@@ -226,7 +226,6 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
               <Button
                 className={`flex items-center gap-2.5 rounded-lg`}
                 size="sm"
-                variant="secondary"
                 onClick={() => navigate(-1)}
               >
                 <IoMdArrowRoundBack className="size-5" />
@@ -235,7 +234,6 @@ export default function LiveCameraView({ camera }: LiveCameraViewProps) {
               <Button
                 className="flex items-center gap-2.5 rounded-lg"
                 size="sm"
-                variant="secondary"
                 onClick={() => {
                   navigate("events", {
                     state: {
diff --git a/web/src/views/system/GeneralMetrics.tsx b/web/src/views/system/GeneralMetrics.tsx
index dede52c60..274753ae7 100644
--- a/web/src/views/system/GeneralMetrics.tsx
+++ b/web/src/views/system/GeneralMetrics.tsx
@@ -349,7 +349,6 @@ export default function GeneralMetrics({
               {canGetGpuInfo && (
                 <Button
                   className="cursor-pointer"
-                  variant="secondary"
                   size="sm"
                   onClick={() => setShowVainfo(true)}
                 >