Skip to content

Commit 0ac3997

Browse files
setchysetchy
committed
feat: Avatar shape based on user type
Signed-off-by: Adam Setch <[email protected]>
1 parent 8f621c9 commit 0ac3997

File tree

7 files changed

+463
-493
lines changed

7 files changed

+463
-493
lines changed

‎src/renderer/components/notifications/NotificationFooter.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import { Avatar } from '@primer/react';
66
import { IconColor, Opacity, Size } from '../../types';
77
import type { Notification } from '../../typesGitHub';
88
import { cn } from '../../utils/cn';
9-
import { formatNotificationUpdatedAt } from '../../utils/helpers';
9+
import {
10+
formatNotificationUpdatedAt,
11+
isNonHumanUser,
12+
} from '../../utils/helpers';
1013
import { openUserProfile } from '../../utils/links';
1114
import { formatReason } from '../../utils/reason';
1215
import { Pills } from './Pills';
@@ -32,6 +35,7 @@ export const NotificationFooter: FC<INotificationFooter> = ({
3235
title={`View profile: ${notification.subject.user.login}`}
3336
src={notification.subject.user.avatar_url}
3437
size={Size.SMALL}
38+
square={isNonHumanUser(notification.subject.user.type)}
3539
onClick={(event: MouseEvent<HTMLElement>) => {
3640
// Don't trigger onClick of parent element.
3741
event.stopPropagation();

‎src/renderer/components/notifications/RepositoryNotifications.tsx‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { cn } from '../../utils/cn';
1010
import {
1111
getChevronDetails,
1212
isMarkAsDoneFeatureSupported,
13+
isNonHumanUser,
1314
} from '../../utils/helpers';
1415
import { openRepository } from '../../utils/links';
1516
import { HoverGroup } from '../primitives/HoverGroup';
@@ -69,7 +70,13 @@ export const RepositoryNotifications: FC<IRepositoryNotifications> = ({
6970
}}
7071
>
7172
<Stack direction="horizontal" gap="condensed" align="center">
72-
<Avatar src={avatarUrl} size={Size.LARGE} />
73+
<Avatar
74+
src={avatarUrl}
75+
size={Size.LARGE}
76+
square={isNonHumanUser(
77+
repoNotifications[0].repository.owner.type,
78+
)}
79+
/>
7380
<Text>{repoName}</Text>
7481
</Stack>
7582
</Button>

‎src/renderer/routes/Accounts.tsx‎

Lines changed: 45 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ import {
2020
IconButton,
2121
Stack,
2222
Text,
23-
Tooltip,
2423
} from '@primer/react';
2524

2625
import { Header } from '../components/primitives/Header';
@@ -88,51 +87,54 @@ export const AccountsRoute: FC = () => {
8887
className="rounded-md bg-gray-100 p-2 pb-0 dark:bg-gray-sidebar"
8988
>
9089
<Stack direction="vertical" gap="none">
91-
<Tooltip text="Open profile" direction="se">
92-
<Button
93-
onClick={() => openAccountProfile(account)}
94-
data-testid="account-profile"
90+
<Button
91+
title="Open account profile"
92+
onClick={() => openAccountProfile(account)}
93+
data-testid="account-profile"
94+
sx={{ width: 'fit-content' }}
95+
>
96+
<Stack
97+
direction="horizontal"
98+
gap="condensed"
99+
align="center"
95100
>
96-
<Stack
97-
direction="horizontal"
98-
gap="condensed"
99-
align="center"
100-
>
101-
<Avatar src={account.user.avatar} size={Size.XLARGE} />
102-
<Text>@{account.user.login}</Text>
103-
<span className="text-xs italic">
104-
({account.user?.name})
105-
</span>
106-
</Stack>
107-
</Button>
108-
</Tooltip>
109-
110-
<Stack direction="horizontal" gap="condensed" align="start">
101+
<Avatar src={account.user.avatar} size={Size.XLARGE} />
102+
<Text>@{account.user.login}</Text>
103+
<span className="text-xs italic">
104+
({account.user?.name})
105+
</span>
106+
</Stack>
107+
</Button>
108+
109+
<Stack
110+
direction="horizontal"
111+
gap="condensed"
112+
align="start"
113+
justify="space-between"
114+
>
111115
<Stack direction="vertical" gap="none">
112116
<ActionList variant="inset">
113-
<Tooltip text="Open Host" direction="e">
114-
<ActionList.Item
115-
onSelect={() => openHost(account.hostname)}
116-
data-testid="account-host"
117-
>
118-
<ActionList.LeadingVisual>
119-
<PlatformIcon />
120-
</ActionList.LeadingVisual>
121-
<span className="text-xs">{account.hostname}</span>
122-
</ActionList.Item>
123-
</Tooltip>
124-
125-
<Tooltip text="Open Developer Settings" direction="e">
126-
<ActionList.Item
127-
onSelect={() => openDeveloperSettings(account)}
128-
data-testid="account-developer-settings"
129-
>
130-
<ActionList.LeadingVisual>
131-
<AuthMethodIcon />
132-
</ActionList.LeadingVisual>
133-
<span className="text-xs">{account.method}</span>
134-
</ActionList.Item>
135-
</Tooltip>
117+
<ActionList.Item
118+
title="Open host"
119+
onSelect={() => openHost(account.hostname)}
120+
data-testid="account-host"
121+
>
122+
<ActionList.LeadingVisual>
123+
<PlatformIcon />
124+
</ActionList.LeadingVisual>
125+
<span className="text-xs">{account.hostname}</span>
126+
</ActionList.Item>
127+
128+
<ActionList.Item
129+
title="Open developer settings"
130+
onSelect={() => openDeveloperSettings(account)}
131+
data-testid="account-developer-settings"
132+
>
133+
<ActionList.LeadingVisual>
134+
<AuthMethodIcon />
135+
</ActionList.LeadingVisual>
136+
<span className="text-xs">{account.method}</span>
137+
</ActionList.Item>
136138
</ActionList>
137139
</Stack>
138140

0 commit comments

Comments
 (0)