diff --git a/src/__mocks__/state-mocks.ts b/src/__mocks__/state-mocks.ts index 0065b2390..68f46e8e5 100644 --- a/src/__mocks__/state-mocks.ts +++ b/src/__mocks__/state-mocks.ts @@ -5,6 +5,7 @@ import { type GitifyUser, GroupBy, type Hostname, + type Link, OpenPreference, type SettingsState, Theme, @@ -24,6 +25,7 @@ export const mockGitifyUser: GitifyUser = { login: 'octocat', name: 'Mona Lisa Octocat', id: 123456789, + avatar: 'https://avatars.githubusercontent.com/u/583231?v=4' as Link, }; export const mockPersonalAccessTokenAccount: Account = { diff --git a/src/components/AccountNotifications.test.tsx b/src/components/AccountNotifications.test.tsx index d0b3556f4..cfb410fb9 100644 --- a/src/components/AccountNotifications.test.tsx +++ b/src/components/AccountNotifications.test.tsx @@ -114,6 +114,62 @@ describe('components/AccountNotifications.tsx', () => { expect(openAccountProfileMock).toHaveBeenCalledWith(mockGitHubCloudAccount); }); + it('should open my issues when clicked', async () => { + const openMyIssuesMock = jest + .spyOn(links, 'openGitHubIssues') + .mockImplementation(); + + const props = { + account: mockGitHubCloudAccount, + notifications: [], + showAccountHostname: true, + error: null, + }; + + await act(async () => { + render( + + + , + ); + }); + + fireEvent.click(screen.getByTitle('My Issues')); + + expect(openMyIssuesMock).toHaveBeenCalledTimes(1); + expect(openMyIssuesMock).toHaveBeenCalledWith( + mockGitHubCloudAccount.hostname, + ); + }); + + it('should open my pull requests when clicked', async () => { + const openPullRequestsMock = jest + .spyOn(links, 'openGitHubPulls') + .mockImplementation(); + + const props = { + account: mockGitHubCloudAccount, + notifications: [], + showAccountHostname: true, + error: null, + }; + + await act(async () => { + render( + + + , + ); + }); + + fireEvent.click(screen.getByTitle('My Pull Requests')); + + expect(openPullRequestsMock).toHaveBeenCalledTimes(1); + expect(openPullRequestsMock).toHaveBeenCalledWith( + mockGitHubCloudAccount.hostname, + ); + }); + it('should toggle account notifications visibility', async () => { const props = { account: mockGitHubCloudAccount, diff --git a/src/components/AccountNotifications.tsx b/src/components/AccountNotifications.tsx index 3714bc649..4e3a2c971 100644 --- a/src/components/AccountNotifications.tsx +++ b/src/components/AccountNotifications.tsx @@ -2,19 +2,27 @@ import { ChevronDownIcon, ChevronLeftIcon, ChevronUpIcon, + FeedPersonIcon, + GitPullRequestIcon, + IssueOpenedIcon, } from '@primer/octicons-react'; import { type FC, type MouseEvent, useContext, useMemo, useState } from 'react'; import { AppContext } from '../context/App'; import { type Account, type GitifyError, Opacity, Size } from '../types'; import type { Notification } from '../typesGitHub'; import { cn } from '../utils/cn'; -import { openAccountProfile } from '../utils/links'; +import { + openAccountProfile, + openGitHubIssues, + openGitHubPulls, +} from '../utils/links'; import { AllRead } from './AllRead'; import { HoverGroup } from './HoverGroup'; import { NotificationRow } from './NotificationRow'; import { Oops } from './Oops'; import { RepositoryNotifications } from './RepositoryNotifications'; import { InteractionButton } from './buttons/InteractionButton'; +import { AvatarIcon } from './icons/AvatarIcon'; import { PlatformIcon } from './icons/PlatformIcon'; interface IAccountNotifications { @@ -85,8 +93,13 @@ export const AccountNotifications: FC = ( onClick={toggleAccountNotifications} > - - + + = ( + + openGitHubIssues(account.hostname)} + /> + openGitHubPulls(account.hostname)} + /> = ({ > - - - - - + + + + + + + + + + + + + + + + + - - - - - + + + + + + + + + + + + + + + + + - - - - - + + + + + + + + + + + + + + + + + - - - - - + + + + + + - + + + + + + + + + + + + @@ -1160,27 +1360,13 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi class="flex" > - - - - - + + + + + + + + + + + + + + + + + - - - - - + + + + + + + + + + + + + + + + + - - - - - + - - - - - - - - - - 🎊 - - - No new notifications. - - - -