From cc86d8eb4cda2bc3e844d0eda305aafaac97a425 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Sat, 13 Jul 2024 08:49:00 -0400
Subject: [PATCH] feat: add pointer to setting inputs

---
 src/components/fields/Checkbox.tsx            |  4 +-
 src/components/fields/RadioGroup.tsx          |  4 +-
 .../__snapshots__/Checkbox.test.tsx.snap      |  8 +-
 .../__snapshots__/RadioGroup.test.tsx.snap    | 32 ++++----
 .../__snapshots__/Filters.test.tsx.snap       | 80 +++++++++----------
 .../__snapshots__/Settings.test.tsx.snap      | 68 ++++++++--------
 6 files changed, 98 insertions(+), 98 deletions(-)

diff --git a/src/components/fields/Checkbox.tsx b/src/components/fields/Checkbox.tsx
index ff4d6162e..b01e99491 100644
--- a/src/components/fields/Checkbox.tsx
+++ b/src/components/fields/Checkbox.tsx
@@ -18,7 +18,7 @@ export const Checkbox: FC<ICheckbox> = (props: ICheckbox) => {
         <input
           type="checkbox"
           id={props.name}
-          className="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+          className="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
           checked={props.checked}
           onChange={props.onChange}
           disabled={props.disabled}
@@ -27,7 +27,7 @@ export const Checkbox: FC<ICheckbox> = (props: ICheckbox) => {
         <div className="ml-3">
           <label
             htmlFor={props.name}
-            className="font-medium text-gray-700 dark:text-gray-200"
+            className="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
             style={
               props.disabled ? { textDecoration: 'line-through' } : undefined
             }
diff --git a/src/components/fields/RadioGroup.tsx b/src/components/fields/RadioGroup.tsx
index e373af9b5..0f195f502 100644
--- a/src/components/fields/RadioGroup.tsx
+++ b/src/components/fields/RadioGroup.tsx
@@ -42,7 +42,7 @@ export const RadioGroup: FC<IRadioGroup> = (props: IRadioGroup) => {
               >
                 <input
                   type="radio"
-                  className="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                  className="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                   id={`${props.name}_${item.value.toLowerCase()}`}
                   name={props.name}
                   value={item.value}
@@ -52,7 +52,7 @@ export const RadioGroup: FC<IRadioGroup> = (props: IRadioGroup) => {
                 />
                 <label
                   htmlFor={`${props.name}_${item.value.toLowerCase()}`}
-                  className="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                  className="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 >
                   {item.label}
                 </label>
diff --git a/src/components/fields/__snapshots__/Checkbox.test.tsx.snap b/src/components/fields/__snapshots__/Checkbox.test.tsx.snap
index 037410dce..9ac95aaa5 100644
--- a/src/components/fields/__snapshots__/Checkbox.test.tsx.snap
+++ b/src/components/fields/__snapshots__/Checkbox.test.tsx.snap
@@ -13,7 +13,7 @@ exports[`components/fields/Checkbox.tsx should render 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="appearance"
             type="checkbox"
           />
@@ -21,7 +21,7 @@ exports[`components/fields/Checkbox.tsx should render 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="appearance"
             >
               Appearance
@@ -45,7 +45,7 @@ exports[`components/fields/Checkbox.tsx should render 1`] = `
       >
         <input
           checked=""
-          class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+          class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
           id="appearance"
           type="checkbox"
         />
@@ -53,7 +53,7 @@ exports[`components/fields/Checkbox.tsx should render 1`] = `
           class="ml-3"
         >
           <label
-            class="font-medium text-gray-700 dark:text-gray-200"
+            class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
             for="appearance"
           >
             Appearance
diff --git a/src/components/fields/__snapshots__/RadioGroup.test.tsx.snap b/src/components/fields/__snapshots__/RadioGroup.test.tsx.snap
index d4d77a3cc..0667f6253 100644
--- a/src/components/fields/__snapshots__/RadioGroup.test.tsx.snap
+++ b/src/components/fields/__snapshots__/RadioGroup.test.tsx.snap
@@ -30,14 +30,14 @@ exports[`components/fields/RadioGroup.tsx should render 1`] = `
               class="flex items-center"
             >
               <input
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="appearance_one"
                 name="appearance"
                 type="radio"
                 value="one"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="appearance_one"
               >
                 Value 1
@@ -48,14 +48,14 @@ exports[`components/fields/RadioGroup.tsx should render 1`] = `
             >
               <input
                 checked=""
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="appearance_two"
                 name="appearance"
                 type="radio"
                 value="two"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="appearance_two"
               >
                 Value 2
@@ -97,14 +97,14 @@ exports[`components/fields/RadioGroup.tsx should render 1`] = `
             class="flex items-center"
           >
             <input
-              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
               id="appearance_one"
               name="appearance"
               type="radio"
               value="one"
             />
             <label
-              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
               for="appearance_one"
             >
               Value 1
@@ -115,14 +115,14 @@ exports[`components/fields/RadioGroup.tsx should render 1`] = `
           >
             <input
               checked=""
-              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
               id="appearance_two"
               name="appearance"
               type="radio"
               value="two"
             />
             <label
-              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
               for="appearance_two"
             >
               Value 2
@@ -222,7 +222,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
               class="flex items-center"
             >
               <input
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 disabled=""
                 id="appearance_one"
                 name="appearance"
@@ -230,7 +230,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
                 value="one"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="appearance_one"
               >
                 Value 1
@@ -241,7 +241,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
             >
               <input
                 checked=""
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 disabled=""
                 id="appearance_two"
                 name="appearance"
@@ -249,7 +249,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
                 value="two"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="appearance_two"
               >
                 Value 2
@@ -292,7 +292,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
             class="flex items-center"
           >
             <input
-              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
               disabled=""
               id="appearance_one"
               name="appearance"
@@ -300,7 +300,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
               value="one"
             />
             <label
-              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
               for="appearance_one"
             >
               Value 1
@@ -311,7 +311,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
           >
             <input
               checked=""
-              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+              class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
               disabled=""
               id="appearance_two"
               name="appearance"
@@ -319,7 +319,7 @@ exports[`components/fields/RadioGroup.tsx should render as disabled 1`] = `
               value="two"
             />
             <label
-              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+              class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
               for="appearance_two"
             >
               Value 2
diff --git a/src/routes/__snapshots__/Filters.test.tsx.snap b/src/routes/__snapshots__/Filters.test.tsx.snap
index 66b1f4eee..b8fb88939 100644
--- a/src/routes/__snapshots__/Filters.test.tsx.snap
+++ b/src/routes/__snapshots__/Filters.test.tsx.snap
@@ -87,7 +87,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="hideBots"
             type="checkbox"
           />
@@ -95,7 +95,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="hideBots"
             >
               Hide notifications from Bot accounts
@@ -159,7 +159,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="approval_requested"
             type="checkbox"
           />
@@ -167,7 +167,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="approval_requested"
             >
               Approval Requested
@@ -202,7 +202,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="assign"
             type="checkbox"
           />
@@ -210,7 +210,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="assign"
             >
               Assigned
@@ -245,7 +245,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="author"
             type="checkbox"
           />
@@ -253,7 +253,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="author"
             >
               Authored
@@ -288,7 +288,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="ci_activity"
             type="checkbox"
           />
@@ -296,7 +296,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="ci_activity"
             >
               Workflow Run Completed
@@ -331,7 +331,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="comment"
             type="checkbox"
           />
@@ -339,7 +339,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="comment"
             >
               Commented
@@ -374,7 +374,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="invitation"
             type="checkbox"
           />
@@ -382,7 +382,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="invitation"
             >
               Invitation Received
@@ -417,7 +417,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="manual"
             type="checkbox"
           />
@@ -425,7 +425,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="manual"
             >
               Updated
@@ -460,7 +460,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="member_feature_requested"
             type="checkbox"
           />
@@ -468,7 +468,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="member_feature_requested"
             >
               Member Feature Requested
@@ -503,7 +503,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="mention"
             type="checkbox"
           />
@@ -511,7 +511,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="mention"
             >
               Mentioned
@@ -546,7 +546,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="review_requested"
             type="checkbox"
           />
@@ -554,7 +554,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="review_requested"
             >
               Review Requested
@@ -589,7 +589,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="security_advisory_credit"
             type="checkbox"
           />
@@ -597,7 +597,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="security_advisory_credit"
             >
               Security Advisory Credit Received
@@ -632,7 +632,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="security_alert"
             type="checkbox"
           />
@@ -640,7 +640,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="security_alert"
             >
               Security Alert Received
@@ -675,7 +675,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="state_change"
             type="checkbox"
           />
@@ -683,7 +683,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="state_change"
             >
               State Changed
@@ -718,7 +718,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="subscribed"
             type="checkbox"
           />
@@ -726,7 +726,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="subscribed"
             >
               Updated
@@ -761,7 +761,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="team_mention"
             type="checkbox"
           />
@@ -769,7 +769,7 @@ exports[`routes/Filters.tsx General should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="team_mention"
             >
               Team Mentioned
@@ -839,7 +839,7 @@ exports[`routes/Filters.tsx Reasons section should be able to toggle reason type
     class="flex items-center"
   >
     <input
-      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
       id="mention"
       type="checkbox"
     />
@@ -847,7 +847,7 @@ exports[`routes/Filters.tsx Reasons section should be able to toggle reason type
       class="ml-3"
     >
       <label
-        class="font-medium text-gray-700 dark:text-gray-200"
+        class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
         for="mention"
       >
         Mentioned
@@ -885,7 +885,7 @@ exports[`routes/Filters.tsx Reasons section should be able to toggle reason type
     class="flex items-center"
   >
     <input
-      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
       id="mention"
       type="checkbox"
     />
@@ -893,7 +893,7 @@ exports[`routes/Filters.tsx Reasons section should be able to toggle reason type
       class="ml-3"
     >
       <label
-        class="font-medium text-gray-700 dark:text-gray-200"
+        class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
         for="mention"
       >
         Mentioned
@@ -931,7 +931,7 @@ exports[`routes/Filters.tsx Users section should be able to toggle the hideBots
     class="flex items-center"
   >
     <input
-      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
       id="hideBots"
       type="checkbox"
     />
@@ -939,7 +939,7 @@ exports[`routes/Filters.tsx Users section should be able to toggle the hideBots
       class="ml-3"
     >
       <label
-        class="font-medium text-gray-700 dark:text-gray-200"
+        class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
         for="hideBots"
       >
         Hide notifications from Bot accounts
@@ -977,7 +977,7 @@ exports[`routes/Filters.tsx Users section should not be able to toggle the hideB
     class="flex items-center"
   >
     <input
-      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+      class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
       disabled=""
       id="hideBots"
       type="checkbox"
@@ -986,7 +986,7 @@ exports[`routes/Filters.tsx Users section should not be able to toggle the hideB
       class="ml-3"
     >
       <label
-        class="font-medium text-gray-700 dark:text-gray-200"
+        class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
         for="hideBots"
         style="text-decoration: line-through;"
       >
diff --git a/src/routes/__snapshots__/Settings.test.tsx.snap b/src/routes/__snapshots__/Settings.test.tsx.snap
index c15485145..5b0464e0b 100644
--- a/src/routes/__snapshots__/Settings.test.tsx.snap
+++ b/src/routes/__snapshots__/Settings.test.tsx.snap
@@ -104,14 +104,14 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             >
               <input
                 checked=""
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="theme_system"
                 name="theme"
                 type="radio"
                 value="SYSTEM"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="theme_system"
               >
                 System
@@ -121,14 +121,14 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
               class="flex items-center"
             >
               <input
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="theme_light"
                 name="theme"
                 type="radio"
                 value="LIGHT"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="theme_light"
               >
                 Light
@@ -138,14 +138,14 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
               class="flex items-center"
             >
               <input
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="theme_dark"
                 name="theme"
                 type="radio"
                 value="DARK"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="theme_dark"
               >
                 Dark
@@ -196,7 +196,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="detailedNotifications"
             type="checkbox"
           />
@@ -204,7 +204,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="detailedNotifications"
             >
               Detailed notifications
@@ -240,7 +240,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showPills"
             type="checkbox"
           />
@@ -248,7 +248,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showPills"
             >
               Show notification metric pills
@@ -284,7 +284,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showNumber"
             type="checkbox"
           />
@@ -292,7 +292,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showNumber"
             >
               Show number
@@ -327,7 +327,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showAccountHostname"
             type="checkbox"
           />
@@ -335,7 +335,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showAccountHostname"
             >
               Show account hostname
@@ -391,14 +391,14 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             >
               <input
                 checked=""
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="groupBy_repository"
                 name="groupBy"
                 type="radio"
                 value="REPOSITORY"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="groupBy_repository"
               >
                 Repository
@@ -408,14 +408,14 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
               class="flex items-center"
             >
               <input
-                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500"
+                class="size-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
                 id="groupBy_date"
                 name="groupBy"
                 type="radio"
                 value="DATE"
               />
               <label
-                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white"
+                class="ml-3 block text-sm font-medium text-gray-700 dark:text-white cursor-pointer"
                 for="groupBy_date"
               >
                 Date
@@ -431,7 +431,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showOnlyParticipating"
             type="checkbox"
           />
@@ -439,7 +439,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showOnlyParticipating"
             >
               Show only participating
@@ -474,7 +474,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="markAsDoneOnOpen"
             type="checkbox"
           />
@@ -482,7 +482,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="markAsDoneOnOpen"
             >
               Mark as done on open
@@ -497,7 +497,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="delayNotificationState"
             type="checkbox"
           />
@@ -505,7 +505,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="delayNotificationState"
             >
               Delay notification state
@@ -563,7 +563,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="kbdShortcutEnabled"
             type="checkbox"
           />
@@ -571,7 +571,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="kbdShortcutEnabled"
             >
               Enable keyboard shortcut
@@ -606,7 +606,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showNotificationsCountInTray"
             type="checkbox"
           />
@@ -614,7 +614,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showNotificationsCountInTray"
             >
               Show notifications count in tray
@@ -630,7 +630,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="showNotifications"
             type="checkbox"
           />
@@ -638,7 +638,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="showNotifications"
             >
               Show system notifications
@@ -654,7 +654,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
         >
           <input
             checked=""
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="playSound"
             type="checkbox"
           />
@@ -662,7 +662,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="playSound"
             >
               Play sound
@@ -677,7 +677,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           class="flex items-center"
         >
           <input
-            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500"
+            class="size-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-500 cursor-pointer"
             id="openAtStartUp"
             type="checkbox"
           />
@@ -685,7 +685,7 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
             class="ml-3"
           >
             <label
-              class="font-medium text-gray-700 dark:text-gray-200"
+              class="font-medium text-gray-700 dark:text-gray-200 cursor-pointer"
               for="openAtStartUp"
             >
               Open at startup