adjust styling, use default value

Signed-off-by: Adam Setch <[email protected]>

Author: setchy

src/renderer/__mocks__/state-mocks.ts

@@ -93,7 +93,6 @@ const mockNotificationSettings: NotificationSettingsState = {
   markAsDoneOnOpen: false,
   markAsDoneOnUnsubscribe: false,
   delayNotificationState: false,
-  notificationVolume: 20,
 };
 
 const mockSystemSettings: SystemSettingsState = {
@@ -102,6 +101,7 @@ const mockSystemSettings: SystemSettingsState = {
   showNotificationsCountInTray: true,
   showNotifications: true,
   playSound: true,
+  notificationVolume: 20,
   useAlternateIdleIcon: false,
   openAtStartup: false,
 };

src/renderer/components/settings/SystemSettings.tsx

@@ -18,7 +18,7 @@ import {
 
 import { APPLICATION } from '../../../shared/constants';
 import { isLinux, isMacOS } from '../../../shared/platform';
-import { AppContext } from '../../context/App';
+import { AppContext, defaultSettings } from '../../context/App';
 import { OpenPreference } from '../../types';
 import { Constants } from '../../utils/constants';
 import { Checkbox } from '../fields/Checkbox';
@@ -91,7 +91,7 @@ export const SystemSettings: FC = () => {
           onChange={(evt) => updateSetting('playSound', evt.target.checked)}
         />
 
-        {settings.playSound && (
+        <Box className="pl-6" hidden={!settings.playSound}>
           <Stack
             direction="horizontal"
             gap="condensed"
@@ -145,13 +145,16 @@ export const SystemSettings: FC = () => {
                 icon={XCircleIcon}
                 unsafeDisableTooltip={true}
                 onClick={() => {
-                  updateSetting('notificationVolume', 20);
+                  updateSetting(
+                    'notificationVolume',
+                    defaultSettings.notificationVolume,
+                  );
                 }}
                 data-testid="settings-volume-reset"
               />
             </ButtonGroup>
           </Stack>
-        )}
+        </Box>
 
         <Checkbox
           name="useAlternateIdleIcon"

src/renderer/context/App.tsx

@@ -85,7 +85,6 @@ const defaultNotificationSettings: NotificationSettingsState = {
   markAsDoneOnOpen: false,
   markAsDoneOnUnsubscribe: false,
   delayNotificationState: false,
-  notificationVolume: 20,
 };
 
 const defaultSystemSettings: SystemSettingsState = {
@@ -94,6 +93,7 @@ const defaultSystemSettings: SystemSettingsState = {
   showNotificationsCountInTray: true,
   showNotifications: true,
   playSound: true,
+  notificationVolume: 20,
   useAlternateIdleIcon: false,
   openAtStartup: false,
 };

src/renderer/types.ts

@@ -81,7 +81,6 @@ export interface NotificationSettingsState {
   markAsDoneOnOpen: boolean;
   markAsDoneOnUnsubscribe: boolean;
   delayNotificationState: boolean;
-  notificationVolume: number;
 }
 
 export interface SystemSettingsState {
@@ -91,6 +90,7 @@ export interface SystemSettingsState {
   showNotifications: boolean;
   useAlternateIdleIcon: boolean;
   playSound: boolean;
+  notificationVolume: number;
   openAtStartup: boolean;
 }
 

src/renderer/utils/notifications/native.ts

@@ -2,6 +2,7 @@ import path from 'node:path';
 
 import { APPLICATION } from '../../../shared/constants';
 import { isWindows } from '../../../shared/platform';
+import { defaultSettings } from '../../context/App';
 import type { AccountNotifications, GitifyState } from '../../types';
 import { Notification } from '../../typesGitHub';
 import { getAccountUUID } from '../auth/utils';
@@ -86,7 +87,9 @@ export const raiseNativeNotification = (notifications: Notification[]) => {
   return nativeNotification;
 };
 
-export const raiseSoundNotification = (volume = 0.2) => {
+export const raiseSoundNotification = (
+  volume = defaultSettings.notificationVolume / 100,
+) => {
   const audio = new Audio(
     path.join(
       __dirname,