refactor: error page fallback

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

Author: setchy

src/renderer/components/Oops.test.tsx

@@ -2,7 +2,7 @@ import { render } from '@testing-library/react';
 import { Oops } from './Oops';
 
 describe('renderer/components/Oops.tsx', () => {
-  it('should render itself & its children', () => {
+  it('should render itself & its children - specified error', () => {
     const mockError = {
       title: 'Error title',
       descriptions: ['Error description'],
@@ -12,4 +12,10 @@ describe('renderer/components/Oops.tsx', () => {
 
     expect(tree).toMatchSnapshot();
   });
+
+  it('should render itself & its children - fallback to unknown error', () => {
+    const tree = render(<Oops error={null} />);
+
+    expect(tree).toMatchSnapshot();
+  });
 });

src/renderer/components/Oops.tsx

@@ -1,6 +1,7 @@
 import { type FC, useMemo } from 'react';
 
 import type { GitifyError } from '../types';
+import { Errors } from '../utils/errors';
 import { EmojiSplash } from './layout/EmojiSplash';
 
 interface IOops {
@@ -9,16 +10,18 @@ interface IOops {
 }
 
 export const Oops: FC<IOops> = ({ error, fullHeight = true }: IOops) => {
+  const err = error ?? Errors.UNKNOWN;
+
   const emoji = useMemo(
-    () => error.emojis[Math.floor(Math.random() * error.emojis.length)],
-    [error],
+    () => err.emojis[Math.floor(Math.random() * err.emojis.length)],
+    [err],
   );
 
   return (
     <EmojiSplash
       emoji={emoji}
-      heading={error.title}
-      subHeadings={error.descriptions}
+      heading={err.title}
+      subHeadings={err.descriptions}
       fullHeight={fullHeight}
     />
   );

src/renderer/components/__snapshots__/Oops.test.tsx.snap

@@ -5,7 +5,6 @@ import { Oops } from '../components/Oops';
 import { AccountNotifications } from '../components/notifications/AccountNotifications';
 import { AppContext } from '../context/App';
 import { getAccountUUID } from '../utils/auth/utils';
-import { Errors } from '../utils/errors';
 import { getNotificationCount } from '../utils/notifications/notifications';
 
 export const NotificationsRoute: FC = () => {
@@ -28,7 +27,7 @@ export const NotificationsRoute: FC = () => {
   );
 
   if (status === 'error') {
-    return <Oops error={globalError ?? Errors.UNKNOWN} />;
+    return <Oops error={globalError} />;
   }
 
   if (!hasNotifications && hasNoAccountErrors) {