Skip to content

Commit ec7b143

Browse files
setchysetchy
authored
feat: add link to notification user profile (#928)
* feat: notification user profile link * feat: notification user profile link * feat: notification user profile link * feat: notification user profile link
1 parent ee3a8f4 commit ec7b143

File tree

8 files changed

+107
-15
lines changed

8 files changed

+107
-15
lines changed

‎src/__mocks__/mockedData.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -299,6 +299,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
299299
createdAt: '2022-02-20T18:33:39Z',
300300
author: {
301301
login: 'comment-user',
302+
url: 'https://github.com/comment-user',
302303
type: 'User',
303304
},
304305
replies: {
@@ -310,6 +311,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
310311
createdAt: '2022-02-21T03:30:42Z',
311312
author: {
312313
login: 'comment-user',
314+
url: 'https://github.com/comment-user',
313315
type: 'User',
314316
},
315317
replies: {
@@ -321,6 +323,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
321323
createdAt: '2022-02-21T18:26:27Z',
322324
author: {
323325
login: 'comment-user',
326+
url: 'https://github.com/comment-user',
324327
type: 'User',
325328
},
326329
replies: {
@@ -330,6 +333,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
330333
createdAt: '2022-02-23T00:57:58Z',
331334
author: {
332335
login: 'reply-user',
336+
url: 'https://github.com/reply-user',
333337
type: 'User',
334338
},
335339
},
@@ -341,6 +345,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
341345
createdAt: '2022-02-23T00:57:49Z',
342346
author: {
343347
login: 'comment-user',
348+
url: 'https://github.com/comment-user',
344349
type: 'User',
345350
},
346351
replies: {
@@ -352,6 +357,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
352357
createdAt: '2022-02-27T01:22:20Z',
353358
author: {
354359
login: 'comment-user',
360+
url: 'https://github.com/comment-user',
355361
type: 'User',
356362
},
357363
replies: {
@@ -361,6 +367,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
361367
createdAt: '2022-03-05T17:43:52Z',
362368
author: {
363369
login: 'reply-user',
370+
url: 'https://github.com/reply-user',
364371
type: 'User',
365372
},
366373
},
@@ -372,6 +379,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
372379
createdAt: '2022-03-04T20:39:44Z',
373380
author: {
374381
login: 'comment-user',
382+
url: 'https://github.com/comment-user',
375383
type: 'User',
376384
},
377385
replies: {
@@ -381,6 +389,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
381389
createdAt: '2022-03-05T17:41:04Z',
382390
author: {
383391
login: 'reply-user',
392+
url: 'https://github.com/reply-user',
384393
type: 'User',
385394
},
386395
},
@@ -392,6 +401,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
392401
createdAt: '2022-03-05T11:05:42Z',
393402
author: {
394403
login: 'comment-user',
404+
url: 'https://github.com/comment-user',
395405
type: 'User',
396406
},
397407
replies: {
@@ -401,6 +411,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
401411
createdAt: '2022-03-05T17:41:44Z',
402412
author: {
403413
login: 'reply-user',
414+
url: 'https://github.com/reply-user',
404415
type: 'User',
405416
},
406417
},
@@ -423,6 +434,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
423434
createdAt: '2022-02-20T18:33:39Z',
424435
author: {
425436
login: 'comment-user',
437+
url: 'https://github.com/comment-user',
426438
type: 'User',
427439
},
428440
replies: {
@@ -434,6 +446,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
434446
createdAt: '2022-02-21T03:30:42Z',
435447
author: {
436448
login: 'comment-user',
449+
url: 'https://github.com/comment-user',
437450
type: 'User',
438451
},
439452
replies: {
@@ -445,6 +458,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
445458
createdAt: '2022-02-21T18:26:27Z',
446459
author: {
447460
login: 'comment-user',
461+
url: 'https://github.com/comment-user',
448462
type: 'User',
449463
},
450464
replies: {
@@ -454,6 +468,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
454468
createdAt: '2022-02-23T00:57:58Z',
455469
author: {
456470
login: 'reply-user',
471+
url: 'https://github.com/reply-user',
457472
type: 'User',
458473
},
459474
},
@@ -465,6 +480,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
465480
createdAt: '2022-02-23T00:57:49Z',
466481
author: {
467482
login: 'comment-user',
483+
url: 'https://github.com/comment-user',
468484
type: 'User',
469485
},
470486
replies: {
@@ -476,6 +492,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
476492
createdAt: '2022-02-27T01:22:20Z',
477493
author: {
478494
login: 'comment-user',
495+
url: 'https://github.com/comment-user',
479496
type: 'User',
480497
},
481498
replies: {
@@ -485,6 +502,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
485502
createdAt: '2022-03-05T17:43:52Z',
486503
author: {
487504
login: 'reply-user',
505+
url: 'https://github.com/reply-user',
488506
type: 'User',
489507
},
490508
},
@@ -496,6 +514,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
496514
createdAt: '2022-03-04T20:39:44Z',
497515
author: {
498516
login: 'comment-user',
517+
url: 'https://github.com/comment-user',
499518
type: 'User',
500519
},
501520
replies: {
@@ -505,6 +524,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
505524
createdAt: '2022-03-05T17:41:04Z',
506525
author: {
507526
login: 'reply-user',
527+
url: 'https://github.com/reply-user',
508528
type: 'User',
509529
},
510530
},
@@ -516,6 +536,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
516536
createdAt: '2022-03-05T11:05:42Z',
517537
author: {
518538
login: 'comment-user',
539+
url: 'https://github.com/comment-user',
519540
type: 'User',
520541
},
521542
replies: {
@@ -525,6 +546,7 @@ export const mockedGraphQLResponse: GraphQLSearch<Discussion> = {
525546
createdAt: '2022-03-05T17:41:44Z',
526547
author: {
527548
login: 'reply-user',
549+
url: 'https://github.com/reply-user',
528550
type: 'User',
529551
},
530552
},

‎src/components/NotificationRow.test.tsx‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ import { AppContext } from '../context/App';
88
import { mockedSingleNotification } from '../__mocks__/mockedData';
99
import { NotificationRow } from './NotificationRow';
1010
import { mockAccounts, mockSettings } from '../__mocks__/mock-state';
11+
import { shell } from 'electron';
1112

1213
describe('components/NotificationRow.tsx', () => {
1314
beforeEach(() => {
@@ -148,4 +149,35 @@ describe('components/NotificationRow.tsx', () => {
148149
fireEvent.click(getByTitle('Unsubscribe'));
149150
expect(unsubscribeNotification).toHaveBeenCalledTimes(1);
150151
});
152+
153+
it('should open notification user profile', () => {
154+
const props = {
155+
notification: {
156+
...mockedSingleNotification,
157+
subject: {
158+
...mockedSingleNotification.subject,
159+
user: {
160+
login: 'some-user',
161+
html_url: 'https://github.com/some-user',
162+
type: 'User',
163+
},
164+
},
165+
},
166+
hostname: 'github.com',
167+
};
168+
169+
const { getByTitle } = render(
170+
<AppContext.Provider
171+
value={{
172+
settings: { ...mockSettings },
173+
accounts: mockAccounts,
174+
}}
175+
>
176+
<NotificationRow {...props} />
177+
</AppContext.Provider>,
178+
);
179+
180+
fireEvent.click(getByTitle('View User Profile'));
181+
expect(shell.openExternal).toHaveBeenCalledTimes(1);
182+
});
151183
});

‎src/components/NotificationRow.tsx‎

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
import { formatForDisplay, openInBrowser } from '../utils/helpers';
1111
import { Notification } from '../typesGithub';
1212
import { AppContext } from '../context/App';
13+
import { openExternalLink } from '../utils/comms';
1314

1415
interface IProps {
1516
hostname: string;
@@ -79,21 +80,36 @@ export const NotificationRow: React.FC<IProps> = ({
7980
<NotificationIcon size={18} aria-label={notification.subject.type} />
8081
</div>
8182

82-
<div
83-
className="flex-1 overflow-hidden cursor-pointer"
84-
onClick={() => pressTitle()}
85-
role="main"
86-
>
83+
<div className="flex-1 overflow-hidden">
8784
<div
88-
className="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden"
85+
className="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden cursor-pointer"
86+
role="main"
87+
onClick={() => pressTitle()}
8988
title={notification.subject.title}
9089
>
9190
{notification.subject.title}
9291
</div>
9392

9493
<div className="text-xs text-capitalize whitespace-nowrap overflow-ellipsis overflow-hidden">
9594
<span title={reason.description}>{reason.type}</span> -{' '}
96-
<span title={updatedLabel}>{updatedLabel}</span>
95+
<span title={updatedLabel}>
96+
Updated {updatedAt}
97+
{notification.subject.user && (
98+
<>
99+
{' '}
100+
by{' '}
101+
<span
102+
className="cursor-pointer"
103+
title="View User Profile"
104+
onClick={() =>
105+
openExternalLink(notification.subject.user.html_url)
106+
}
107+
>
108+
{notification.subject.user.login}
109+
</span>
110+
</>
111+
)}
112+
</span>
97113
</div>
98114
</div>
99115

‎src/components/__snapshots__/NotificationRow.test.tsx.snap‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,12 +35,12 @@ exports[`components/NotificationRow.tsx should render itself & its children 1`]
3535
</svg>
3636
</div>
3737
<div
38-
className="flex-1 overflow-hidden cursor-pointer"
39-
onClick={[Function]}
40-
role="main"
38+
className="flex-1 overflow-hidden"
4139
>
4240
<div
43-
className="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden"
41+
className="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden cursor-pointer"
42+
onClick={[Function]}
43+
role="main"
4444
title="I am a robot and this is a test!"
4545
>
4646
I am a robot and this is a test!
@@ -58,7 +58,8 @@ exports[`components/NotificationRow.tsx should render itself & its children 1`]
5858
<span
5959
title="Updated in over 3 years"
6060
>
61-
Updated in over 3 years
61+
Updated
62+
in over 3 years
6263
</span>
6364
</div>
6465
</div>

‎src/hooks/useNotifications.test.ts‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -308,25 +308,39 @@ describe('hooks/useNotifications.ts', () => {
308308
merged: true,
309309
user: {
310310
login: 'some-user',
311+
html_url: 'https://github.com/some-user',
311312
type: 'User',
312313
},
313314
});
314315
nock('https://api.github.com')
315316
.get('/3/comments')
316-
.reply(200, { user: { login: 'some-commenter', type: 'User' } });
317+
.reply(200, {
318+
user: {
319+
login: 'some-commenter',
320+
html_url: 'https://github.com/some-commenter',
321+
type: 'User',
322+
},
323+
});
317324
nock('https://api.github.com')
318325
.get('/4')
319326
.reply(200, {
320327
state: 'closed',
321328
merged: false,
322329
user: {
323330
login: 'some-user',
331+
html_url: 'https://github.com/some-user',
324332
type: 'User',
325333
},
326334
});
327335
nock('https://api.github.com')
328336
.get('/4/comments')
329-
.reply(200, { user: { login: 'some-commenter', type: 'User' } });
337+
.reply(200, {
338+
user: {
339+
login: 'some-commenter',
340+
html_url: 'https://github.com/some-commenter',
341+
type: 'User',
342+
},
343+
});
330344

331345
const { result } = renderHook(() => useNotifications(true));
332346

‎src/typesGithub.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -137,11 +137,13 @@ export interface User {
137137

138138
export interface SubjectUser {
139139
login: string;
140+
html_url: string;
140141
type: string;
141142
}
142143

143144
export interface DiscussionAuthor {
144145
login: string;
146+
url: string;
145147
type: string;
146148
}
147149

‎src/utils/helpers.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -160,6 +160,7 @@ export async function fetchDiscussion(
160160
createdAt
161161
author {
162162
login
163+
url
163164
type
164165
}
165166
}

0 commit comments

Comments
 (0)