Skip to content

Commit c9abebd

Browse files
nedtwiggnedtwigg
authored
Enhance editing comments in issues and PRs (#50 progress towards #21)
2 parents 8e86f31 + d9f6798 commit c9abebd

File tree

4 files changed

+202
-2
lines changed

4 files changed

+202
-2
lines changed

‎browser-extension/src/lib/enhancers/github/githubEditComment.tsx‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
import OverType, { type OverTypeInstance } from 'overtype'
2+
import type React from 'react'
3+
import type { CommentEnhancer, CommentSpot } from '@/lib/enhancer'
4+
import { logger } from '@/lib/logger'
5+
import { modifyDOM } from '../modifyDOM'
6+
import { commonGithubOptions } from './ghOptions'
7+
import { githubHighlighter } from './githubHighlighter'
8+
9+
export interface GitHubEditCommentSpot extends CommentSpot {
10+
type: 'GH_EDIT_COMMENT'
11+
title: string
12+
domain: string
13+
slug: string
14+
number: number
15+
}
16+
17+
export class GitHubEditCommentEnhancer implements CommentEnhancer<GitHubEditCommentSpot> {
18+
forSpotTypes(): string[] {
19+
return ['GH_EDIT_COMMENT']
20+
}
21+
22+
tryToEnhance(_textarea: HTMLTextAreaElement): GitHubEditCommentSpot | null {
23+
if (
24+
document.querySelector('meta[name="hostname"]')?.getAttribute('content') !== 'github.com' ||
25+
!_textarea.matches('.TimelineItem textarea')
26+
) {
27+
return null
28+
}
29+
30+
// Parse GitHub URL structure: /owner/repo/issues/123 or /owner/repo/pull/456
31+
logger.info(`${this.constructor.name} examing url`, window.location.pathname)
32+
33+
const match = window.location.pathname.match(/^\/([^/]+)\/([^/]+)(?:\/(pull|issues)\/(\d+))/)
34+
logger.info(`${this.constructor.name} found match`, window.location.pathname)
35+
if (!match) return null
36+
const [, owner, repo, numberStr] = match
37+
const slug = `${owner}/${repo}`
38+
const number = parseInt(numberStr!, 10)
39+
const unique_key = `github.com:${slug}:${number}`
40+
const title = 'TODO_TITLE'
41+
return {
42+
domain: 'github.com',
43+
number,
44+
slug,
45+
title,
46+
type: 'GH_EDIT_COMMENT',
47+
unique_key,
48+
}
49+
}
50+
51+
prepareForFirstEnhancement(): void {
52+
OverType.setCodeHighlighter(githubHighlighter)
53+
}
54+
55+
enhance(textArea: HTMLTextAreaElement, _spot: GitHubEditCommentSpot): OverTypeInstance {
56+
const overtypeContainer = modifyDOM(textArea)
57+
return new OverType(overtypeContainer, {
58+
...commonGithubOptions,
59+
minHeight: '102px',
60+
padding: 'var(--base-size-8)',
61+
placeholder: 'Add your comment here...',
62+
})[0]!
63+
}
64+
65+
tableUpperDecoration(spot: GitHubEditCommentSpot): React.ReactNode {
66+
const { slug, number } = spot
67+
return (
68+
<>
69+
<span className='font-mono text-muted-foreground text-sm'>{slug}</span>
70+
<span className='ml-2 font-medium'>PR #{number}</span>
71+
</>
72+
)
73+
}
74+
75+
tableTitle(_spot: GitHubEditCommentSpot): string {
76+
return 'TITLE_TODO'
77+
}
78+
}

‎browser-extension/src/lib/enhancers/github/githubPRNewComment.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,12 @@ export class GitHubPRNewCommentEnhancer implements CommentEnhancer<GitHubPRNewCo
2929

3030
// /owner/repo/compare/feature/more-enhancers?expand=1
3131
// or /owner/repo/compare/feat/issue-static-and-dynamic...feature/more-enhancers?expand=1
32-
logger.info(`${this.constructor.name} examing url`, location.pathname)
32+
logger.debug(`${this.constructor.name} examing url`, window.location.pathname)
3333

3434
const match = location.pathname.match(
3535
/^\/([^/]+)\/([^/]+)\/compare\/(?:([^.?]+)\.\.\.)?([^?]+)/,
3636
)
37-
logger.info(`${this.constructor.name} found match`, location.pathname, match)
37+
logger.debug(`${this.constructor.name} found match`, window.location.pathname, match)
3838

3939
if (!match) return null
4040
const [, owner, repo, baseBranch, compareBranch] = match

‎browser-extension/src/lib/registries.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import type { OverTypeInstance } from 'overtype'
22
import OverType from 'overtype'
33
import type { CommentEnhancer, CommentSpot, StrippedLocation } from './enhancer'
44
import { CommentEnhancerMissing } from './enhancers/CommentEnhancerMissing'
5+
import { GitHubEditCommentEnhancer } from './enhancers/github/githubEditComment'
56
import { GitHubIssueAddCommentEnhancer } from './enhancers/github/githubIssueAddComment'
67
import { GitHubIssueNewCommentEnhancer } from './enhancers/github/githubIssueNewComment'
78
import { GitHubPRAddCommentEnhancer } from './enhancers/github/githubPRAddComment'
@@ -21,6 +22,7 @@ export class EnhancerRegistry {
2122

2223
constructor() {
2324
// Register all available handlers
25+
this.register(new GitHubEditCommentEnhancer())
2426
this.register(new GitHubIssueAddCommentEnhancer())
2527
this.register(new GitHubIssueNewCommentEnhancer())
2628
this.register(new GitHubPRAddCommentEnhancer())

‎browser-extension/tests/lib/enhancers/github.test.ts‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -175,4 +175,124 @@ describe('github', () => {
175175
]
176176
`)
177177
})
178+
withCorpus('gh_issue_edit').it('should create the correct spot object', async () => {
179+
expect(enhancements(document, window)).toMatchInlineSnapshot(`
180+
[
181+
{
182+
"for": "id=:rc3: name=null className=prc-Textarea-TextArea-13q4j focus-visible overtype-input",
183+
"spot": {
184+
"domain": "github.com",
185+
"number": 56,
186+
"slug": "diffplug/gitcasso",
187+
"title": "TODO_TITLE",
188+
"type": "GH_ISSUE_ADD_COMMENT",
189+
"unique_key": "github.com:diffplug/gitcasso:56",
190+
},
191+
"title": "TITLE_TODO",
192+
"upperDecoration": <React.Fragment>
193+
<span
194+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
195+
>
196+
<IssueOpenedIcon
197+
size={16}
198+
/>
199+
</span>
200+
#
201+
56
202+
<a
203+
className="truncate hover:underline"
204+
href="https://github.com/diffplug/gitcasso"
205+
>
206+
diffplug/gitcasso
207+
</a>
208+
</React.Fragment>,
209+
},
210+
{
211+
"for": "id=:ra7: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
212+
"spot": {
213+
"domain": "github.com",
214+
"number": 56,
215+
"slug": "diffplug/gitcasso",
216+
"title": "TODO_TITLE",
217+
"type": "GH_ISSUE_ADD_COMMENT",
218+
"unique_key": "github.com:diffplug/gitcasso:56",
219+
},
220+
"title": "TITLE_TODO",
221+
"upperDecoration": <React.Fragment>
222+
<span
223+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
224+
>
225+
<IssueOpenedIcon
226+
size={16}
227+
/>
228+
</span>
229+
#
230+
56
231+
<a
232+
className="truncate hover:underline"
233+
href="https://github.com/diffplug/gitcasso"
234+
>
235+
diffplug/gitcasso
236+
</a>
237+
</React.Fragment>,
238+
},
239+
]
240+
`)
241+
})
242+
withCorpus('gh_pr_edit').it('should create the correct spot object', async () => {
243+
expect(enhancements(document, window)).toMatchInlineSnapshot(`
244+
[
245+
{
246+
"for": "id=issue-3429313834-body name=pull_request[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit js-size-to-fit size-to-fit js-session-resumable CommentBox-input FormControl-textarea js-saved-reply-shortcut-comment-field focus-visible overtype-input",
247+
"spot": {
248+
"domain": "github.com",
249+
"number": NaN,
250+
"slug": "diffplug/gitcasso",
251+
"title": "TODO_TITLE",
252+
"type": "GH_EDIT_COMMENT",
253+
"unique_key": "github.com:diffplug/gitcasso:NaN",
254+
},
255+
"title": "TITLE_TODO",
256+
"upperDecoration": <React.Fragment>
257+
<span
258+
className="font-mono text-muted-foreground text-sm"
259+
>
260+
diffplug/gitcasso
261+
</span>
262+
<span
263+
className="ml-2 font-medium"
264+
>
265+
PR #
266+
NaN
267+
</span>
268+
</React.Fragment>,
269+
},
270+
{
271+
"for": "id=new_comment_field name=comment[body] className=js-comment-field js-paste-markdown js-task-list-field js-quick-submit FormControl-textarea CommentBox-input js-size-to-fit size-to-fit js-session-resumable js-saved-reply-shortcut-comment-field overtype-input",
272+
"spot": {
273+
"domain": "github.com",
274+
"number": 58,
275+
"slug": "diffplug/gitcasso",
276+
"title": "TODO_TITLE",
277+
"type": "GH_PR_ADD_COMMENT",
278+
"unique_key": "github.com:diffplug/gitcasso:58",
279+
},
280+
"title": "TITLE_TODO",
281+
"upperDecoration": <React.Fragment>
282+
<span
283+
className="font-mono text-muted-foreground text-sm"
284+
>
285+
diffplug/gitcasso
286+
</span>
287+
<span
288+
className="ml-2 font-medium"
289+
>
290+
PR #
291+
58
292+
</span>
293+
</React.Fragment>,
294+
},
295+
]
296+
`)
297+
})
178298
})

0 commit comments

Comments
 (0)