fix: error component height based on accounts (#2375)

fix: error for multiple accounts

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

Author: setchy

src/renderer/components/notifications/AccountNotifications.test.tsx

@@ -2,6 +2,7 @@ import { act, render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
 import {
+  mockAuth,
   mockGitHubCloudAccount,
   mockSettings,
 } from '../../__mocks__/state-mocks';
@@ -80,7 +81,7 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
     expect(tree).toMatchSnapshot();
   });
 
-  it('should render itself - account error', async () => {
+  it('should render itself - account error for single account', async () => {
     const props = {
       account: mockGitHubCloudAccount,
       notifications: [],
@@ -96,7 +97,37 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
 
     await act(async () => {
       tree = render(
-        <AppContext.Provider value={{ settings: mockSettings }}>
+        <AppContext.Provider
+          value={{
+            auth: { accounts: [mockGitHubCloudAccount] },
+            settings: mockSettings,
+          }}
+        >
+          <AccountNotifications {...props} />
+        </AppContext.Provider>,
+      );
+    });
+
+    expect(tree).toMatchSnapshot();
+  });
+
+  it('should render itself - account error for multiple accounts', async () => {
+    const props = {
+      account: mockGitHubCloudAccount,
+      notifications: [],
+      error: {
+        title: 'Error title',
+        descriptions: ['Error description'],
+        emojis: ['🔥'],
+      },
+      showAccountHeader: true,
+    };
+
+    let tree: ReturnType<typeof render> | null = null;
+
+    await act(async () => {
+      tree = render(
+        <AppContext.Provider value={{ auth: mockAuth, settings: mockSettings }}>
           <AccountNotifications {...props} />
         </AppContext.Provider>,
       );

src/renderer/components/notifications/AccountNotifications.tsx

@@ -6,6 +6,7 @@ import { Button, Stack } from '@primer/react';
 import { AppContext } from '../../context/App';
 import { type Account, type GitifyError, Size } from '../../types';
 import type { Notification } from '../../typesGitHub';
+import { hasMultipleAccounts } from '../../utils/auth/utils';
 import { cn } from '../../utils/cn';
 import { getChevronDetails } from '../../utils/helpers';
 import {
@@ -37,7 +38,7 @@ export const AccountNotifications: FC<IAccountNotifications> = (
 ) => {
   const { account, showAccountHeader, notifications } = props;
 
-  const { settings } = useContext(AppContext);
+  const { auth, settings } = useContext(AppContext);
 
   const [showAccountNotifications, setShowAccountNotifications] =
     useState(true);
@@ -126,7 +127,9 @@ export const AccountNotifications: FC<IAccountNotifications> = (
 
       {showAccountNotifications && (
         <>
-          {props.error && <Oops error={props.error} fullHeight={false} />}
+          {props.error && (
+            <Oops error={props.error} fullHeight={!hasMultipleAccounts(auth)} />
+          )}
 
           {!hasNotifications && !props.error && <AllRead fullHeight={false} />}