From b2f99c844e90382c26626a70dbf7ae33f88e2c9f Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Sat, 13 Jul 2024 15:18:13 -0400
Subject: [PATCH 1/2] refactor: split default and mock settings into sections

---
 src/__mocks__/state-mocks.ts                  | 38 ++++++++++++-----
 src/components/settings/SystemSettings.tsx    |  2 +-
 src/context/App.tsx                           | 42 ++++++++++++-------
 .../__snapshots__/Settings.test.tsx.snap      |  8 ++--
 4 files changed, 59 insertions(+), 31 deletions(-)

diff --git a/src/__mocks__/state-mocks.ts b/src/__mocks__/state-mocks.ts
index 9885f0b10..9878894e6 100644
--- a/src/__mocks__/state-mocks.ts
+++ b/src/__mocks__/state-mocks.ts
@@ -71,26 +71,42 @@ export const mockAuth: AuthState = {
 
 export const mockToken = 'token-123-456' as Token;
 
-export const mockSettings: SettingsState = {
-  participating: false,
-  playSound: true,
-  showNotifications: true,
-  hideBots: false,
-  showNotificationsCountInTray: false,
-  openAtStartup: false,
+const mockApperanceSettings = {
   theme: Theme.SYSTEM,
   zoomPercentage: 100,
   detailedNotifications: true,
-  markAsDoneOnOpen: false,
-  showAccountHostname: false,
-  delayNotificationState: false,
   showPills: true,
   showNumber: true,
-  keyboardShortcut: true,
+  showAccountHostname: false,
+};
+
+const mockNotificationSettings = {
   groupBy: GroupBy.REPOSITORY,
+  participating: false,
+  markAsDoneOnOpen: false,
+  delayNotificationState: false,
+};
+
+const mockSystemSettings = {
+  keyboardShortcut: true,
+  showNotificationsCountInTray: false,
+  showNotifications: true,
+  playSound: true,
+  openAtStartup: false,
+};
+
+const mockFilters = {
+  hideBots: false,
   filterReasons: [],
 };
 
+export const mockSettings: SettingsState = {
+  ...mockApperanceSettings,
+  ...mockNotificationSettings,
+  ...mockSystemSettings,
+  ...mockFilters,
+};
+
 export const mockState: GitifyState = {
   auth: mockAuth,
   settings: mockSettings,
diff --git a/src/components/settings/SystemSettings.tsx b/src/components/settings/SystemSettings.tsx
index a29edf059..08ba6ca3e 100644
--- a/src/components/settings/SystemSettings.tsx
+++ b/src/components/settings/SystemSettings.tsx
@@ -13,7 +13,7 @@ export const SystemSettings: FC = () => {
     <fieldset>
       <Legend icon={DeviceDesktopIcon}>System</Legend>
       <Checkbox
-        name="kbdShortcutEnabled"
+        name="keyboardShortcutEnabled"
         label="Enable keyboard shortcut"
         checked={settings.keyboardShortcut}
         onChange={(evt) =>
diff --git a/src/context/App.tsx b/src/context/App.tsx
index adbcf1e5b..4b68d5f20 100644
--- a/src/context/App.tsx
+++ b/src/context/App.tsx
@@ -52,27 +52,39 @@ const defaultAuth: AuthState = {
   user: null,
 };
 
-export const defaultFilters = {
-  hideBots: false,
-  filterReasons: [],
-};
-
-export const defaultSettings: SettingsState = {
-  participating: false,
-  playSound: true,
-  showNotifications: true,
-  showNotificationsCountInTray: false,
-  openAtStartup: false,
+const defaultApperanceSettings = {
   theme: Theme.SYSTEM,
   zoomPercentage: 100,
   detailedNotifications: true,
-  markAsDoneOnOpen: false,
-  showAccountHostname: false,
-  delayNotificationState: false,
   showPills: true,
   showNumber: true,
-  keyboardShortcut: true,
+  showAccountHostname: false,
+};
+
+const defaultNotificationSettings = {
   groupBy: GroupBy.REPOSITORY,
+  participating: false,
+  markAsDoneOnOpen: false,
+  delayNotificationState: false,
+};
+
+const defaultSystemSettings = {
+  keyboardShortcut: true,
+  showNotificationsCountInTray: false,
+  showNotifications: true,
+  playSound: true,
+  openAtStartup: false,
+};
+
+export const defaultFilters = {
+  hideBots: false,
+  filterReasons: [],
+};
+
+export const defaultSettings: SettingsState = {
+  ...defaultApperanceSettings,
+  ...defaultNotificationSettings,
+  ...defaultSystemSettings,
   ...defaultFilters,
 };
 
diff --git a/src/routes/__snapshots__/Settings.test.tsx.snap b/src/routes/__snapshots__/Settings.test.tsx.snap
index c15485145..320b557b9 100644
--- a/src/routes/__snapshots__/Settings.test.tsx.snap
+++ b/src/routes/__snapshots__/Settings.test.tsx.snap
@@ -564,7 +564,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"
-            id="kbdShortcutEnabled"
+            id="keyboardShortcutEnabled"
             type="checkbox"
           />
           <div
@@ -572,13 +572,13 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           >
             <label
               class="font-medium text-gray-700 dark:text-gray-200"
-              for="kbdShortcutEnabled"
+              for="keyboardShortcutEnabled"
             >
               Enable keyboard shortcut
               <span
-                aria-label="tooltip-kbdShortcutEnabled"
+                aria-label="tooltip-keyboardShortcutEnabled"
                 class="relative"
-                id="tooltip-kbdShortcutEnabled"
+                id="tooltip-keyboardShortcutEnabled"
               >
                 <svg
                   aria-hidden="true"

From 417decd40201f697dbf24bd20eb614c08d35a10d Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Sat, 13 Jul 2024 15:19:15 -0400
Subject: [PATCH 2/2] refactor: split default and mock settings into sections

---
 src/components/settings/SystemSettings.tsx      | 2 +-
 src/routes/__snapshots__/Settings.test.tsx.snap | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/settings/SystemSettings.tsx b/src/components/settings/SystemSettings.tsx
index 08ba6ca3e..a29edf059 100644
--- a/src/components/settings/SystemSettings.tsx
+++ b/src/components/settings/SystemSettings.tsx
@@ -13,7 +13,7 @@ export const SystemSettings: FC = () => {
     <fieldset>
       <Legend icon={DeviceDesktopIcon}>System</Legend>
       <Checkbox
-        name="keyboardShortcutEnabled"
+        name="kbdShortcutEnabled"
         label="Enable keyboard shortcut"
         checked={settings.keyboardShortcut}
         onChange={(evt) =>
diff --git a/src/routes/__snapshots__/Settings.test.tsx.snap b/src/routes/__snapshots__/Settings.test.tsx.snap
index 320b557b9..c15485145 100644
--- a/src/routes/__snapshots__/Settings.test.tsx.snap
+++ b/src/routes/__snapshots__/Settings.test.tsx.snap
@@ -564,7 +564,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"
-            id="keyboardShortcutEnabled"
+            id="kbdShortcutEnabled"
             type="checkbox"
           />
           <div
@@ -572,13 +572,13 @@ exports[`routes/Settings.tsx should render itself & its children 1`] = `
           >
             <label
               class="font-medium text-gray-700 dark:text-gray-200"
-              for="keyboardShortcutEnabled"
+              for="kbdShortcutEnabled"
             >
               Enable keyboard shortcut
               <span
-                aria-label="tooltip-keyboardShortcutEnabled"
+                aria-label="tooltip-kbdShortcutEnabled"
                 class="relative"
-                id="tooltip-keyboardShortcutEnabled"
+                id="tooltip-kbdShortcutEnabled"
               >
                 <svg
                   aria-hidden="true"