Merge branch 'main' of https://github.com/gitify-app/gitify

Author: setchy

package.json

@@ -89,7 +89,7 @@
     "@testing-library/user-event": "14.6.1",
     "@types/jest": "30.0.0",
     "@types/node": "24.10.1",
-    "@types/react": "19.2.5",
+    "@types/react": "19.2.6",
     "@types/react-dom": "19.2.3",
     "@types/react-router-dom": "5.3.3",
     "@types/semver": "7.7.1",

pnpm-lock.yaml

@@ -1,13 +1,13 @@
-import { act, fireEvent, screen } from '@testing-library/react';
+import { act, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
 import { renderWithAppContext } from '../../__helpers__/test-utils';
 import { mockGitHubAppAccount } from '../../__mocks__/account-mocks';
+import * as zoom from '../../utils/zoom';
 import { AppearanceSettings } from './AppearanceSettings';
 
 describe('renderer/components/settings/AppearanceSettings.tsx', () => {
   const updateSettingMock = jest.fn();
-  const zoomTimeout = () => new Promise((r) => setTimeout(r, 300));
 
   afterEach(() => {
     jest.clearAllMocks();
@@ -45,28 +45,12 @@ describe('renderer/components/settings/AppearanceSettings.tsx', () => {
     expect(updateSettingMock).toHaveBeenCalledWith('increaseContrast', true);
   });
 
-  it('should update the zoom value when using CMD + and CMD -', async () => {
-    window.gitify.zoom.getLevel = jest.fn().mockReturnValue(-1);
-
-    await act(async () => {
-      renderWithAppContext(<AppearanceSettings />, {
-        updateSetting: updateSettingMock,
-      });
-    });
-
-    fireEvent(window, new Event('resize'));
-    await zoomTimeout();
-
-    expect(updateSettingMock).toHaveBeenCalledTimes(1);
-    expect(updateSettingMock).toHaveBeenCalledWith('zoomPercentage', 50);
-  });
-
   it('should update the zoom values when using the zoom buttons', async () => {
-    window.gitify.zoom.getLevel = jest.fn().mockReturnValue(0);
-    window.gitify.zoom.setLevel = jest.fn().mockImplementation((level) => {
-      window.gitify.zoom.getLevel = jest.fn().mockReturnValue(level);
-      fireEvent(window, new Event('resize'));
-    });
+    const zoomOutSpy = jest.spyOn(zoom, 'decreaseZoom').mockImplementation();
+    const zoomInSpy = jest.spyOn(zoom, 'increaseZoom').mockImplementation();
+    const zoomResetSpy = jest
+      .spyOn(zoom, 'resetZoomLevel')
+      .mockImplementation();
 
     await act(async () => {
       renderWithAppContext(<AppearanceSettings />, {
@@ -75,55 +59,19 @@ describe('renderer/components/settings/AppearanceSettings.tsx', () => {
     });
 
     // Zoom Out
-    await act(async () => {
-      await userEvent.click(screen.getByTestId('settings-zoom-out'));
-      await zoomTimeout();
-
-      expect(updateSettingMock).toHaveBeenCalledTimes(1);
-      expect(updateSettingMock).toHaveBeenNthCalledWith(
-        1,
-        'zoomPercentage',
-        90,
-      );
-    });
+    await userEvent.click(screen.getByTestId('settings-zoom-out'));
+    expect(zoomOutSpy).toHaveBeenCalledTimes(1);
 
-    await act(async () => {
-      await userEvent.click(screen.getByTestId('settings-zoom-out'));
-      await zoomTimeout();
-
-      expect(updateSettingMock).toHaveBeenCalledTimes(2);
-      expect(updateSettingMock).toHaveBeenNthCalledWith(
-        2,
-        'zoomPercentage',
-        80,
-      );
-    });
+    await userEvent.click(screen.getByTestId('settings-zoom-out'));
+    expect(zoomOutSpy).toHaveBeenCalledTimes(2);
 
     // Zoom In
-    await act(async () => {
-      await userEvent.click(screen.getByTestId('settings-zoom-in'));
-      await zoomTimeout();
-
-      expect(updateSettingMock).toHaveBeenCalledTimes(3);
-      expect(updateSettingMock).toHaveBeenNthCalledWith(
-        3,
-        'zoomPercentage',
-        90,
-      );
-    });
+    await userEvent.click(screen.getByTestId('settings-zoom-in'));
+    expect(zoomInSpy).toHaveBeenCalledTimes(1);
 
     // Zoom Reset
-    await act(async () => {
-      await userEvent.click(screen.getByTestId('settings-zoom-reset'));
-      await zoomTimeout();
-
-      expect(updateSettingMock).toHaveBeenCalledTimes(4);
-      expect(updateSettingMock).toHaveBeenNthCalledWith(
-        4,
-        'zoomPercentage',
-        100,
-      );
-    });
+    await userEvent.click(screen.getByTestId('settings-zoom-reset'));
+    expect(zoomResetSpy).toHaveBeenCalledTimes(1);
   });
 
   it('should toggle account header checkbox', async () => {

src/renderer/components/settings/AppearanceSettings.test.tsx

@@ -1,4 +1,4 @@
-import { type FC, useContext, useState } from 'react';
+import { type FC, useContext } from 'react';
 
 import {
   PaintbrushIcon,
@@ -23,33 +23,16 @@ import {
   canIncreaseZoom,
   decreaseZoom,
   increaseZoom,
+  resetZoomLevel,
   zoomLevelToPercentage,
 } from '../../utils/zoom';
 import { Checkbox } from '../fields/Checkbox';
 import { FieldLabel } from '../fields/FieldLabel';
 import { Title } from '../primitives/Title';
 
-let timeout: NodeJS.Timeout;
-const DELAY = 200;
-
 export const AppearanceSettings: FC = () => {
   const { auth, settings, updateSetting } = useContext(AppContext);
-  const [zoomPercentage, setZoomPercentage] = useState(
-    zoomLevelToPercentage(window.gitify.zoom.getLevel()),
-  );
-
-  window.addEventListener('resize', () => {
-    // clear the timeout
-    clearTimeout(timeout);
-    // start timing for event "completion"
-    timeout = setTimeout(() => {
-      const zoomPercentage = zoomLevelToPercentage(
-        window.gitify.zoom.getLevel(),
-      );
-      setZoomPercentage(zoomPercentage);
-      updateSetting('zoomPercentage', zoomPercentage);
-    }, DELAY);
-  });
+  const zoomPercentage = zoomLevelToPercentage(window.gitify.zoom.getLevel());
 
   return (
     <fieldset>
@@ -148,7 +131,7 @@ export const AppearanceSettings: FC = () => {
               aria-label="Reset zoom"
               data-testid="settings-zoom-reset"
               icon={SyncIcon}
-              onClick={() => window.gitify.zoom.setLevel(0)}
+              onClick={() => resetZoomLevel()}
               size="small"
               unsafeDisableTooltip={true}
               variant="danger"

src/renderer/components/settings/AppearanceSettings.tsx

@@ -55,6 +55,8 @@ describe('renderer/context/App.tsx', () => {
   const markNotificationsAsDoneMock = jest.fn();
   const unsubscribeNotificationMock = jest.fn();
 
+  // Removed unused zoomTimeout
+
   const saveStateSpy = jest
     .spyOn(storage, 'saveState')
     .mockImplementation(jest.fn());