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(
+ <AppContext.Provider value={{ settings: mockSettings }}>
+ <AccountNotifications {...props} />
+ </AppContext.Provider>,
+ );
+ });
+
+ 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(
+ <AppContext.Provider value={{ settings: mockSettings }}>
+ <AccountNotifications {...props} />
+ </AppContext.Provider>,
+ );
+ });
+
+ 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<IAccountNotifications> = (
onClick={toggleAccountNotifications}
>
<div className="flex">
- <div className="mr-3 flex items-center justify-center">
- <PlatformIcon type={account.platform} size={Size.MEDIUM} />
+ <div className="mr-2 flex items-center justify-center">
+ <AvatarIcon
+ title={account.user.login}
+ url={account.user.avatar}
+ size={Size.SMALL}
+ defaultIcon={FeedPersonIcon}
+ />
</div>
<button
type="button"
@@ -101,6 +114,19 @@ export const AccountNotifications: FC<IAccountNotifications> = (
</button>
</div>
<HoverGroup>
+ <PlatformIcon type={account.platform} size={Size.SMALL} />
+ <InteractionButton
+ title="My Issues"
+ icon={IssueOpenedIcon}
+ size={Size.SMALL}
+ onClick={() => openGitHubIssues(account.hostname)}
+ />
+ <InteractionButton
+ title="My Pull Requests"
+ icon={GitPullRequestIcon}
+ size={Size.SMALL}
+ onClick={() => openGitHubPulls(account.hostname)}
+ />
<InteractionButton
title={toggleAccountNotificationsLabel}
icon={ChevronIcon}
diff --git a/src/components/RepositoryNotifications.tsx b/src/components/RepositoryNotifications.tsx
index c4aaab81c..758c3a099 100644
--- a/src/components/RepositoryNotifications.tsx
+++ b/src/components/RepositoryNotifications.tsx
@@ -55,7 +55,7 @@ export const RepositoryNotifications: FC<IRepositoryNotifications> = ({
>
<div
className={cn(
- 'flex flex-1 gap-4 items-center truncate text-sm font-medium',
+ 'flex flex-1 gap-3 items-center truncate text-sm font-medium',
animateExit &&
'translate-x-full opacity-0 transition duration-[350ms] ease-in-out',
showAsRead ? Opacity.READ : Opacity.MEDIUM,
diff --git a/src/components/__snapshots__/AccountNotifications.test.tsx.snap b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
index f37cb8bcd..295295cda 100644
--- a/src/components/__snapshots__/AccountNotifications.test.tsx.snap
+++ b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
@@ -12,27 +12,13 @@ exports[`components/AccountNotifications.tsx should render itself - account erro
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -45,6 +31,70 @@ exports[`components/AccountNotifications.tsx should render itself - account erro
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="No notifications for account"
@@ -97,27 +147,13 @@ exports[`components/AccountNotifications.tsx should render itself - account erro
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -130,6 +166,70 @@ exports[`components/AccountNotifications.tsx should render itself - account erro
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="No notifications for account"
@@ -239,27 +339,13 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -272,6 +358,70 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Hide account notifications"
@@ -671,27 +821,13 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -704,26 +840,90 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
<button
class="h-full hover:text-green-500 focus:outline-none"
- title="Hide account notifications"
+ title="My Issues"
type="button"
>
<svg
- aria-label="Hide account notifications"
- class="octicon octicon-chevron-down"
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
fill="currentColor"
focusable="false"
height="14"
role="img"
style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 12 12"
+ viewBox="0 0 16 16"
width="14"
>
<path
- d="M6 8.825c-.2 0-.4-.1-.5-.2l-3.3-3.3c-.3-.3-.3-.8 0-1.1.3-.3.8-.3 1.1 0l2.7 2.7 2.7-2.7c.3-.3.8-.3 1.1 0 .3.3.3.8 0 1.1l-3.2 3.2c-.2.2-.4.3-.6.3Z"
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
/>
- </svg>
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="Hide account notifications"
+ type="button"
+ >
+ <svg
+ aria-label="Hide account notifications"
+ class="octicon octicon-chevron-down"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 12 12"
+ width="14"
+ >
+ <path
+ d="M6 8.825c-.2 0-.4-.1-.5-.2l-3.3-3.3c-.3-.3-.3-.8 0-1.1.3-.3.8-.3 1.1 0l2.7 2.7 2.7-2.7c.3-.3.8-.3 1.1 0 .3.3.3.8 0 1.1l-3.2 3.2c-.2.2-.4.3-.6.3Z"
+ />
+ </svg>
</button>
</div>
</div>
@@ -1160,27 +1360,13 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1193,6 +1379,70 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Hide account notifications"
@@ -1229,27 +1479,13 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1262,6 +1498,70 @@ exports[`components/AccountNotifications.tsx should render itself - group notifi
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Hide account notifications"
@@ -1355,27 +1655,13 @@ exports[`components/AccountNotifications.tsx should render itself - no notificat
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1387,55 +1673,6 @@ exports[`components/AccountNotifications.tsx should render itself - no notificat
</div>
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
- >
- <button
- class="h-full hover:text-green-500 focus:outline-none"
- title="No notifications for account"
- type="button"
- >
- <svg
- aria-label="No notifications for account"
- class="octicon octicon-chevron-left"
- fill="currentColor"
- focusable="false"
- height="14"
- role="img"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 12 12"
- width="14"
- >
- <path
- d="M3.587 6.025c0 .2.1.4.2.5l3.3 3.3c.3.3.8.3 1.1 0 .3-.3.3-.8 0-1.1l-2.7-2.7 2.7-2.7c.3-.3.3-.8 0-1.1-.3-.3-.8-.3-1.1 0l-3.2 3.2c-.2.2-.3.4-.3.6Z"
- />
- </svg>
- </button>
- </div>
- </div>
- <div
- class="flex flex-1 flex-col items-center justify-center bg-white p-4 text-black dark:bg-gray-dark dark:text-white"
- >
- <h1
- class="mt-2 mb-5 text-5xl"
- >
- 🎊
- </h1>
- <h2
- class="mb-2 text-xl font-semibold"
- >
- No new notifications.
- </h2>
- </div>
- </div>
- </body>,
- "container": <div>
- <div
- class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold dark:text-white bg-gray-300 dark:bg-gray-darkest opacity-70"
- >
- <div
- class="flex"
- >
- <div
- class="mr-3 flex items-center justify-center"
>
<span
class="mr-1"
@@ -1446,18 +1683,117 @@ exports[`components/AccountNotifications.tsx should render itself - no notificat
class="octicon octicon-mark-github"
fill="currentColor"
focusable="false"
- height="16"
+ height="14"
style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
viewBox="0 0 16 16"
- width="16"
+ width="14"
>
<path
d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
/>
</svg>
</span>
- </div>
- <button
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="No notifications for account"
+ type="button"
+ >
+ <svg
+ aria-label="No notifications for account"
+ class="octicon octicon-chevron-left"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 12 12"
+ width="14"
+ >
+ <path
+ d="M3.587 6.025c0 .2.1.4.2.5l3.3 3.3c.3.3.8.3 1.1 0 .3-.3.3-.8 0-1.1l-2.7-2.7 2.7-2.7c.3-.3.3-.8 0-1.1-.3-.3-.8-.3-1.1 0l-3.2 3.2c-.2.2-.3.4-.3.6Z"
+ />
+ </svg>
+ </button>
+ </div>
+ </div>
+ <div
+ class="flex flex-1 flex-col items-center justify-center bg-white p-4 text-black dark:bg-gray-dark dark:text-white"
+ >
+ <h1
+ class="mt-2 mb-5 text-5xl"
+ >
+ 🎊
+ </h1>
+ <h2
+ class="mb-2 text-xl font-semibold"
+ >
+ No new notifications.
+ </h2>
+ </div>
+ </div>
+ </body>,
+ "container": <div>
+ <div
+ class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold dark:text-white bg-gray-300 dark:bg-gray-darkest opacity-70"
+ >
+ <div
+ class="flex"
+ >
+ <div
+ class="mr-2 flex items-center justify-center"
+ >
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
+ </div>
+ <button
title="Open Profile"
type="button"
>
@@ -1468,6 +1804,70 @@ exports[`components/AccountNotifications.tsx should render itself - no notificat
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="No notifications for account"
@@ -1572,27 +1972,13 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1605,6 +1991,70 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Show account notifications"
@@ -1637,27 +2087,13 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1670,6 +2106,70 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Hide account notifications"
@@ -1706,27 +2206,13 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
class="flex"
>
<div
- class="mr-3 flex items-center justify-center"
+ class="mr-2 flex items-center justify-center"
>
- <span
- class="mr-1"
- title="GitHub Cloud"
- >
- <svg
- aria-hidden="true"
- class="octicon octicon-mark-github"
- fill="currentColor"
- focusable="false"
- height="16"
- style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
- viewBox="0 0 16 16"
- width="16"
- >
- <path
- d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
- />
- </svg>
- </span>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-5"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
</div>
<button
title="Open Profile"
@@ -1739,6 +2225,70 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
<div
class="flex items-center justify-center gap-2 opacity-0 transition-opacity group-hover:opacity-80"
>
+ <span
+ class="mr-1"
+ title="GitHub Cloud"
+ >
+ <svg
+ aria-hidden="true"
+ class="octicon octicon-mark-github"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+ />
+ </svg>
+ </span>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Issues"
+ type="button"
+ >
+ <svg
+ aria-label="My Issues"
+ class="octicon octicon-issue-opened"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+ />
+ <path
+ d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="h-full hover:text-green-500 focus:outline-none"
+ title="My Pull Requests"
+ type="button"
+ >
+ <svg
+ aria-label="My Pull Requests"
+ class="octicon octicon-git-pull-request"
+ fill="currentColor"
+ focusable="false"
+ height="14"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="14"
+ >
+ <path
+ d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"
+ />
+ </svg>
+ </button>
<button
class="h-full hover:text-green-500 focus:outline-none"
title="Hide account notifications"
diff --git a/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap b/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
index 34fac98d9..31eacbd20 100644
--- a/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
+++ b/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
@@ -9,7 +9,7 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<img
alt="gitify-app/notifications-test's avatar"
@@ -103,7 +103,7 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<img
alt="gitify-app/notifications-test's avatar"
@@ -254,7 +254,7 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<svg
aria-hidden="true"
@@ -350,7 +350,7 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<svg
aria-hidden="true"
@@ -453,7 +453,7 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<svg
aria-hidden="true"
@@ -613,7 +613,7 @@ exports[`components/Repository.tsx should use default repository icon when avata
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<svg
aria-hidden="true"
@@ -716,7 +716,7 @@ exports[`components/Repository.tsx should use default repository icon when avata
class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
>
<div
- class="flex flex-1 gap-4 items-center truncate text-sm font-medium opacity-80"
+ class="flex flex-1 gap-3 items-center truncate text-sm font-medium opacity-80"
>
<svg
aria-hidden="true"
diff --git a/src/context/App.test.tsx b/src/context/App.test.tsx
index 4e49f7fe3..f41f887b8 100644
--- a/src/context/App.test.tsx
+++ b/src/context/App.test.tsx
@@ -79,19 +79,19 @@ describe('context/App.tsx', () => {
);
act(() => {
- jest.advanceTimersByTime(Constants.FETCH_INTERVAL);
+ jest.advanceTimersByTime(Constants.FETCH_NOTIFICATIONS_INTERVAL);
return;
});
expect(fetchNotificationsMock).toHaveBeenCalledTimes(2);
act(() => {
- jest.advanceTimersByTime(Constants.FETCH_INTERVAL);
+ jest.advanceTimersByTime(Constants.FETCH_NOTIFICATIONS_INTERVAL);
return;
});
expect(fetchNotificationsMock).toHaveBeenCalledTimes(3);
act(() => {
- jest.advanceTimersByTime(Constants.FETCH_INTERVAL);
+ jest.advanceTimersByTime(Constants.FETCH_NOTIFICATIONS_INTERVAL);
return;
});
expect(fetchNotificationsMock).toHaveBeenCalledTimes(4);
diff --git a/src/context/App.tsx b/src/context/App.tsx
index b803af53a..a1db7ece4 100644
--- a/src/context/App.tsx
+++ b/src/context/App.tsx
@@ -32,7 +32,7 @@ import {
addAccount,
authGitHub,
getToken,
- getUserData,
+ refreshAccount,
removeAccount,
} from '../utils/auth/utils';
import {
@@ -148,7 +148,13 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
useInterval(() => {
fetchNotifications({ auth, settings });
- }, Constants.FETCH_INTERVAL);
+ }, Constants.FETCH_NOTIFICATIONS_INTERVAL);
+
+ useInterval(() => {
+ for (const account of auth.accounts) {
+ refreshAccount(account);
+ }
+ }, Constants.REFRESH_ACCOUNTS_INTERVAL);
useEffect(() => {
const count = getNotificationCount(notifications);
@@ -204,8 +210,7 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
const { authCode } = await authGitHub();
const { token } = await getToken(authCode);
const hostname = Constants.DEFAULT_AUTH_OPTIONS.hostname;
- const user = await getUserData(token, hostname);
- const updatedAuth = addAccount(auth, 'GitHub App', token, hostname, user);
+ const updatedAuth = await addAccount(auth, 'GitHub App', token, hostname);
setAuth(updatedAuth);
saveState({ auth: updatedAuth, settings });
}, [auth, settings]);
@@ -214,8 +219,7 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
async (data: LoginOAuthAppOptions) => {
const { authOptions, authCode } = await authGitHub(data);
const { token, hostname } = await getToken(authCode, authOptions);
- const user = await getUserData(token, hostname);
- const updatedAuth = addAccount(auth, 'OAuth App', token, hostname, user);
+ const updatedAuth = await addAccount(auth, 'OAuth App', token, hostname);
setAuth(updatedAuth);
saveState({ auth: updatedAuth, settings });
},
@@ -225,13 +229,11 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
const loginWithPersonalAccessToken = useCallback(
async ({ token, hostname }: LoginPersonalAccessTokenOptions) => {
await headNotifications(hostname, token);
- const user = await getUserData(token, hostname);
- const updatedAuth = addAccount(
+ const updatedAuth = await addAccount(
auth,
'Personal Access Token',
token,
hostname,
- user,
);
setAuth(updatedAuth);
saveState({ auth: updatedAuth, settings });
@@ -254,11 +256,15 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
const restoreSettings = useCallback(async () => {
await migrateAuthenticatedAccounts();
-
const existing = loadState();
if (existing.auth) {
setAuth({ ...defaultAuth, ...existing.auth });
+
+ // Refresh account data on app start
+ for (const account of existing.auth.accounts) {
+ await refreshAccount(account);
+ }
}
if (existing.settings) {
@@ -267,14 +273,6 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
webFrame.setZoomLevel(
zoomPercentageToLevel(existing.settings.zoomPercentage),
);
- return existing.settings;
- }
-
- for (const account of auth.accounts.filter(
- (a) => a.platform === 'GitHub Enterprise Server',
- )) {
- const res = await headNotifications(account.hostname, account.token);
- account.version = res.headers['x-github-enterprise-version'];
}
}, []);
diff --git a/src/routes/Accounts.test.tsx b/src/routes/Accounts.test.tsx
index 3b4e84624..7fdae52fa 100644
--- a/src/routes/Accounts.test.tsx
+++ b/src/routes/Accounts.test.tsx
@@ -1,4 +1,10 @@
-import { act, fireEvent, render, screen } from '@testing-library/react';
+import {
+ act,
+ fireEvent,
+ render,
+ screen,
+ waitFor,
+} from '@testing-library/react';
import { MemoryRouter } from 'react-router-dom';
import {
mockAuth,
@@ -8,6 +14,7 @@ import {
mockSettings,
} from '../__mocks__/state-mocks';
import { AppContext } from '../context/App';
+import * as apiRequests from '../utils/api/request';
import * as comms from '../utils/comms';
import * as links from '../utils/links';
@@ -160,6 +167,41 @@ describe('routes/Accounts.tsx', () => {
);
});
+ it('should refresh account', async () => {
+ const apiRequestAuthMock = jest.spyOn(apiRequests, 'apiRequestAuth');
+
+ await act(async () => {
+ render(
+ <AppContext.Provider
+ value={{
+ auth: {
+ accounts: [mockPersonalAccessTokenAccount],
+ },
+ settings: mockSettings,
+ }}
+ >
+ <MemoryRouter>
+ <AccountsRoute />
+ </MemoryRouter>
+ </AppContext.Provider>,
+ );
+ });
+
+ fireEvent.click(screen.getByTitle('Refresh octocat'));
+
+ expect(apiRequestAuthMock).toHaveBeenCalledTimes(1);
+ expect(apiRequestAuthMock).toHaveBeenCalledWith(
+ 'https://api.github.com/user',
+ 'GET',
+ 'token-123-456',
+ );
+ await waitFor(() =>
+ expect(mockNavigate).toHaveBeenNthCalledWith(1, '/accounts', {
+ replace: true,
+ }),
+ );
+ });
+
it('should logout', async () => {
const logoutFromAccountMock = jest.fn();
const updateTrayIconMock = jest.spyOn(comms, 'updateTrayIcon');
diff --git a/src/routes/Accounts.tsx b/src/routes/Accounts.tsx
index 774a5d39d..6831259d2 100644
--- a/src/routes/Accounts.tsx
+++ b/src/routes/Accounts.tsx
@@ -1,21 +1,24 @@
import {
+ FeedPersonIcon,
KeyIcon,
PersonIcon,
PlusIcon,
SignOutIcon,
StarFillIcon,
StarIcon,
+ SyncIcon,
} from '@primer/octicons-react';
import { type FC, useCallback, useContext } from 'react';
import { useNavigate } from 'react-router-dom';
import { Header } from '../components/Header';
import { AuthMethodIcon } from '../components/icons/AuthMethodIcon';
+import { AvatarIcon } from '../components/icons/AvatarIcon';
import { PlatformIcon } from '../components/icons/PlatformIcon';
import { AppContext } from '../context/App';
import { BUTTON_CLASS_NAME } from '../styles/gitify';
import { type Account, IconColor, Size } from '../types';
-import { getAccountUUID } from '../utils/auth/utils';
+import { getAccountUUID, refreshAccount } from '../utils/auth/utils';
import { cn } from '../utils/cn';
import { updateTrayIcon, updateTrayTitle } from '../utils/comms';
import {
@@ -67,16 +70,22 @@ export const AccountsRoute: FC = () => {
<div>
<button
type="button"
- className="mb-1 cursor-pointer text-sm font-semibold"
+ className="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
title="Open Profile"
onClick={() => openAccountProfile(account)}
>
+ <AvatarIcon
+ title={account.user.login}
+ url={account.user.avatar}
+ size={Size.MEDIUM}
+ defaultIcon={FeedPersonIcon}
+ />
@{account.user.login}
<span
hidden={!account.user?.name}
- className="pl-1 text-xs font-medium italic"
+ className="text-xs font-medium italic"
>
- - {account.user?.name}
+ ({account.user?.name})
</span>
</button>
</div>
@@ -106,7 +115,7 @@ export const AccountsRoute: FC = () => {
<div>
<button
type="button"
- className={cn(BUTTON_CLASS_NAME, 'cursor-default')}
+ className={cn(BUTTON_CLASS_NAME, 'px-0', 'cursor-default')}
title="Primary account"
hidden={i !== 0}
>
@@ -118,7 +127,7 @@ export const AccountsRoute: FC = () => {
</button>
<button
type="button"
- className={BUTTON_CLASS_NAME}
+ className={cn(BUTTON_CLASS_NAME, 'px-0')}
title="Set as primary account"
onClick={() => setAsPrimaryAccount(account)}
hidden={i === 0}
@@ -131,7 +140,21 @@ export const AccountsRoute: FC = () => {
</button>
<button
type="button"
- className={BUTTON_CLASS_NAME}
+ className={cn(BUTTON_CLASS_NAME, 'px-0')}
+ title={`Refresh ${account.user.login}`}
+ onClick={async () => {
+ await refreshAccount(account);
+ navigate('/accounts', { replace: true });
+ }}
+ >
+ <SyncIcon
+ size={Size.XLARGE}
+ aria-label={`Refresh ${account.user.login}`}
+ />
+ </button>
+ <button
+ type="button"
+ className={cn(BUTTON_CLASS_NAME, 'px-0')}
title={`Logout ${account.user.login}`}
onClick={() => logoutAccount(account)}
>
diff --git a/src/routes/__snapshots__/Accounts.test.tsx.snap b/src/routes/__snapshots__/Accounts.test.tsx.snap
index d86dd8780..26e7de18b 100644
--- a/src/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/routes/__snapshots__/Accounts.test.tsx.snap
@@ -68,17 +68,23 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
>
<div>
<button
- class="mb-1 cursor-pointer text-sm font-semibold"
+ class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
title="Open Profile"
type="button"
>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-6"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
@
octocat
<span
- class="pl-1 text-xs font-medium italic"
+ class="text-xs font-medium italic"
>
- -
+ (
Mona Lisa Octocat
+ )
</span>
</button>
</div>
@@ -143,7 +149,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</div>
<div>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none cursor-default"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
title="Primary account"
type="button"
>
@@ -164,7 +170,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
hidden=""
title="Set as primary account"
type="button"
@@ -186,7 +192,28 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+ title="Refresh octocat"
+ type="button"
+ >
+ <svg
+ aria-label="Refresh octocat"
+ class="octicon octicon-sync"
+ fill="currentColor"
+ focusable="false"
+ height="20"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="20"
+ >
+ <path
+ d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
title="Logout octocat"
type="button"
>
@@ -216,17 +243,23 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
>
<div>
<button
- class="mb-1 cursor-pointer text-sm font-semibold"
+ class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
title="Open Profile"
type="button"
>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-6"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
@
octocat
<span
- class="pl-1 text-xs font-medium italic"
+ class="text-xs font-medium italic"
>
- -
+ (
Mona Lisa Octocat
+ )
</span>
</button>
</div>
@@ -291,7 +324,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</div>
<div>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none cursor-default"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
hidden=""
title="Primary account"
type="button"
@@ -313,7 +346,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
title="Set as primary account"
type="button"
>
@@ -334,7 +367,28 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+ title="Refresh octocat"
+ type="button"
+ >
+ <svg
+ aria-label="Refresh octocat"
+ class="octicon octicon-sync"
+ fill="currentColor"
+ focusable="false"
+ height="20"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="20"
+ >
+ <path
+ d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
title="Logout octocat"
type="button"
>
@@ -364,17 +418,23 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
>
<div>
<button
- class="mb-1 cursor-pointer text-sm font-semibold"
+ class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
title="Open Profile"
type="button"
>
+ <img
+ alt="octocat's avatar"
+ class="rounded-full object-cover size-6"
+ src="https://avatars.githubusercontent.com/u/583231?v=4"
+ />
@
octocat
<span
- class="pl-1 text-xs font-medium italic"
+ class="text-xs font-medium italic"
>
- -
+ (
Mona Lisa Octocat
+ )
</span>
</button>
</div>
@@ -439,7 +499,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</div>
<div>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none cursor-default"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
hidden=""
title="Primary account"
type="button"
@@ -461,7 +521,7 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
title="Set as primary account"
type="button"
>
@@ -482,7 +542,28 @@ exports[`routes/Accounts.tsx General should render itself & its children 1`] = `
</svg>
</button>
<button
- class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+ title="Refresh octocat"
+ type="button"
+ >
+ <svg
+ aria-label="Refresh octocat"
+ class="octicon octicon-sync"
+ fill="currentColor"
+ focusable="false"
+ height="20"
+ role="img"
+ style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+ viewBox="0 0 16 16"
+ width="20"
+ >
+ <path
+ d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+ />
+ </svg>
+ </button>
+ <button
+ class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
title="Logout octocat"
type="button"
>
diff --git a/src/types.ts b/src/types.ts
index 09ac84a8b..826127dc0 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -130,6 +130,7 @@ export interface AccountNotifications {
export interface GitifyUser {
login: string;
name: string | null;
+ avatar: Link | null;
id: number;
}
diff --git a/src/utils/auth/migration.test.ts b/src/utils/auth/migration.test.ts
index 4eb2dc59b..b6669d37c 100644
--- a/src/utils/auth/migration.test.ts
+++ b/src/utils/auth/migration.test.ts
@@ -84,7 +84,9 @@ describe('utils/auth/migration.ts', () => {
describe('convertAccounts', () => {
it('should convert accounts - personal access token only', async () => {
- nock('https://api.github.com').get('/user').reply(200, mockGitifyUser);
+ nock('https://api.github.com')
+ .get('/user')
+ .reply(200, { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar });
const result = await convertAccounts({
token: mockToken,
@@ -105,7 +107,7 @@ describe('utils/auth/migration.ts', () => {
it('should convert accounts - oauth app only', async () => {
nock('https://github.gitify.io/api/v3')
.get('/user')
- .reply(200, mockGitifyUser);
+ .reply(200, { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar });
const result = await convertAccounts({
enterpriseAccounts: [
@@ -125,10 +127,12 @@ describe('utils/auth/migration.ts', () => {
});
it('should convert accounts - combination', async () => {
- nock('https://api.github.com').get('/user').reply(200, mockGitifyUser);
+ nock('https://api.github.com')
+ .get('/user')
+ .reply(200, { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar });
nock('https://github.gitify.io/api/v3')
.get('/user')
- .reply(200, mockGitifyUser);
+ .reply(200, { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar });
const result = await convertAccounts({
token: mockToken,
diff --git a/src/utils/auth/utils.test.ts b/src/utils/auth/utils.test.ts
index bb8f22642..460b0496b 100644
--- a/src/utils/auth/utils.test.ts
+++ b/src/utils/auth/utils.test.ts
@@ -1,6 +1,12 @@
import remote from '@electron/remote';
+import axios from 'axios';
import type { AxiosPromise, AxiosResponse } from 'axios';
-import { mockAuth, mockGitHubCloudAccount } from '../../__mocks__/state-mocks';
+import nock from 'nock';
+import {
+ mockAuth,
+ mockGitHubCloudAccount,
+ mockGitifyUser,
+} from '../../__mocks__/state-mocks';
import type {
Account,
AuthCode,
@@ -118,11 +124,21 @@ describe('utils/auth/utils.ts', () => {
mockAuthState = {
accounts: [],
};
+
+ // axios will default to using the XHR adapter which can't be intercepted
+ // by nock. So, configure axios to use the node adapter.
+ axios.defaults.adapter = 'http';
});
describe('should add GitHub Cloud account', () => {
- it('should add personal access token account', () => {
- const result = auth.addAccount(
+ beforeEach(() => {
+ nock('https://api.github.com')
+ .get('/user')
+ .reply(200, { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar });
+ });
+
+ it('should add personal access token account', async () => {
+ const result = await auth.addAccount(
mockAuthState,
'Personal Access Token',
'123-456' as Token,
@@ -135,13 +151,14 @@ describe('utils/auth/utils.ts', () => {
method: 'Personal Access Token',
platform: 'GitHub Cloud',
token: '123-456' as Token,
- user: undefined,
+ user: mockGitifyUser,
+ version: 'latest',
},
]);
});
- it('should add oauth app account', () => {
- const result = auth.addAccount(
+ it('should add oauth app account', async () => {
+ const result = await auth.addAccount(
mockAuthState,
'OAuth App',
'123-456' as Token,
@@ -154,15 +171,26 @@ describe('utils/auth/utils.ts', () => {
method: 'OAuth App',
platform: 'GitHub Cloud',
token: '123-456' as Token,
- user: undefined,
+ user: mockGitifyUser,
+ version: 'latest',
},
]);
});
});
describe('should add GitHub Enterprise Server account', () => {
- it('should add personal access token account', () => {
- const result = auth.addAccount(
+ beforeEach(() => {
+ nock('https://github.gitify.io/api/v3')
+ .get('/user')
+ .reply(
+ 200,
+ { ...mockGitifyUser, avatar_url: mockGitifyUser.avatar },
+ { 'x-github-enterprise-version': '3.0.0' },
+ );
+ });
+
+ it('should add personal access token account', async () => {
+ const result = await auth.addAccount(
mockAuthState,
'Personal Access Token',
'123-456' as Token,
@@ -175,13 +203,14 @@ describe('utils/auth/utils.ts', () => {
method: 'Personal Access Token',
platform: 'GitHub Enterprise Server',
token: '123-456' as Token,
- user: undefined,
+ user: mockGitifyUser,
+ version: '3.0.0',
},
]);
});
- it('should add oauth app account', () => {
- const result = auth.addAccount(
+ it('should add oauth app account', async () => {
+ const result = await auth.addAccount(
mockAuthState,
'OAuth App',
'123-456' as Token,
@@ -194,7 +223,8 @@ describe('utils/auth/utils.ts', () => {
method: 'OAuth App',
platform: 'GitHub Enterprise Server',
token: '123-456' as Token,
- user: undefined,
+ user: mockGitifyUser,
+ version: '3.0.0',
},
]);
});
diff --git a/src/utils/auth/utils.ts b/src/utils/auth/utils.ts
index b15b84557..4a502e287 100644
--- a/src/utils/auth/utils.ts
+++ b/src/utils/auth/utils.ts
@@ -1,5 +1,6 @@
import { BrowserWindow } from '@electron/remote';
import { format } from 'date-fns';
+import log from 'electron-log';
import type {
Account,
AuthCode,
@@ -98,6 +99,7 @@ export async function getUserData(
id: response.id,
login: response.login,
name: response.name,
+ avatar: response.avatar_url,
};
}
@@ -120,24 +122,23 @@ export async function getToken(
};
}
-export function addAccount(
+export async function addAccount(
auth: AuthState,
method: AuthMethod,
token: Token,
hostname: Hostname,
- user?: GitifyUser,
-): AuthState {
+): Promise<AuthState> {
+ let newAccount = {
+ hostname: hostname,
+ method: method,
+ platform: getPlatformFromHostname(hostname),
+ token: token,
+ } as Account;
+
+ newAccount = await refreshAccount(newAccount);
+
return {
- accounts: [
- ...auth.accounts,
- {
- hostname: hostname,
- method: method,
- platform: getPlatformFromHostname(hostname),
- token: token,
- user: user,
- },
- ],
+ accounts: [...auth.accounts, newAccount],
};
}
@@ -151,6 +152,27 @@ export function removeAccount(auth: AuthState, account: Account): AuthState {
};
}
+export async function refreshAccount(account: Account): Promise<Account> {
+ try {
+ const res = await getAuthenticatedUser(account.hostname, account.token);
+
+ // Refresh user data
+ account.user = {
+ id: res.data.id,
+ login: res.data.login,
+ name: res.data.name,
+ avatar: res.data.avatar_url,
+ };
+
+ // Refresh platform version
+ account.version = res.headers['x-github-enterprise-version'] ?? 'latest';
+ } catch (error) {
+ log.error('Failed to refresh account', error);
+ }
+
+ return account;
+}
+
export function getDeveloperSettingsURL(account: Account): Link {
const settingsURL = new URL(`https://${account.hostname}`);
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 15ed6ef59..eabacbaeb 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -21,7 +21,8 @@ export const Constants = {
ALL_READ_EMOJIS: ['🎉', '🎊', '🥳', '👏', '🙌', '😎', '🏖️', '🚀', '✨', '🏆'],
- FETCH_INTERVAL: 60000,
+ FETCH_NOTIFICATIONS_INTERVAL: 60000,
+ REFRESH_ACCOUNTS_INTERVAL: 3600000,
DEFAULT_KEYBOARD_SHORTCUT: 'CommandOrControl+Shift+G',