Skip to content

Commit 08832f9

Browse files
nedtwiggnedtwigg
authored
Organize GItHub Enhancer (#13)
2 parents f702c57 + a988f11 commit 08832f9

File tree

5 files changed

+76
-77
lines changed

5 files changed

+76
-77
lines changed

‎browser-extension/src/lib/enhancers/github/githubHighlighter.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import hljs from 'highlight.js'
2+
3+
export function githubHighlighter(code: string, language: string) {
4+
try {
5+
if (language && hljs.getLanguage(language)) {
6+
const result = hljs.highlight(code, { language })
7+
return result.value
8+
} else {
9+
const result = hljs.highlightAuto(code)
10+
return result.value
11+
}
12+
} catch (error) {
13+
console.warn('highlight.js highlighting failed:', error)
14+
return code
15+
}
16+
}

‎browser-extension/src/lib/enhancers/github.ts‎ renamed to ‎browser-extension/src/lib/enhancers/github/githubPRAddComment.ts‎

Lines changed: 13 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,22 @@
1-
import hljs from 'highlight.js'
2-
import { logger } from '../../lib/logger'
3-
import OverType, { type OverTypeInstance } from '../../overtype/overtype'
4-
import type { CommentEnhancer, CommentSpot } from '../enhancer'
1+
import OverType, { type OverTypeInstance } from '../../../overtype/overtype'
2+
import type { CommentEnhancer, CommentSpot } from '../../enhancer'
3+
import { logger } from '../../logger'
4+
import { githubHighlighter } from './githubHighlighter'
5+
import { GITHUB_SPOT_TYPES, type GitHubSpotType } from './githubSpotTypes'
56

6-
const GITHUB_SPOT_TYPES = [
7-
'GH_PR_ADD_COMMENT',
8-
/* TODO
9-
'GH_ISSUE_NEW',
10-
'GH_PR_NEW',
11-
'GH_ISSUE_ADD_COMMENT',
12-
'GH_ISSUE_EDIT_COMMENT',
13-
'GH_PR_EDIT_COMMENT',
14-
'GH_PR_CODE_COMMENT',
15-
*/
16-
] as const
17-
18-
export type GitHubSpotType = (typeof GITHUB_SPOT_TYPES)[number]
19-
20-
export interface GitHubAddCommentSpot extends CommentSpot {
7+
interface GitHubPRAddCommentSpot extends CommentSpot {
218
type: GitHubSpotType // Override to narrow from string to specific union
229
domain: string
2310
slug: string // owner/repo
2411
number: number // issue/PR number, undefined for new issues and PRs
2512
}
2613

27-
export class GitHubAddCommentEnhancer implements CommentEnhancer<GitHubAddCommentSpot> {
14+
export class GitHubPRAddCommentEnhancer implements CommentEnhancer<GitHubPRAddCommentSpot> {
2815
forSpotTypes(): string[] {
2916
return [...GITHUB_SPOT_TYPES]
3017
}
3118

32-
tryToEnhance(_textarea: HTMLTextAreaElement): GitHubAddCommentSpot | null {
19+
tryToEnhance(_textarea: HTMLTextAreaElement): GitHubPRAddCommentSpot | null {
3320
// Only handle github.com domains TODO: identify GitHub Enterprise somehow
3421
if (window.location.hostname !== 'github.com') {
3522
return null
@@ -55,10 +42,10 @@ export class GitHubAddCommentEnhancer implements CommentEnhancer<GitHubAddCommen
5542
}
5643

5744
prepareForFirstEnhancement(): void {
58-
OverType.setCodeHighlighter(hljsHighlighter)
45+
OverType.setCodeHighlighter(githubHighlighter)
5946
}
6047

61-
enhance(textArea: HTMLTextAreaElement, _spot: GitHubAddCommentSpot): OverTypeInstance {
48+
enhance(textArea: HTMLTextAreaElement, _spot: GitHubPRAddCommentSpot): OverTypeInstance {
6249
const overtypeContainer = this.modifyDOM(textArea)
6350
return new OverType(overtypeContainer, {
6451
autoResize: true,
@@ -81,31 +68,16 @@ export class GitHubAddCommentEnhancer implements CommentEnhancer<GitHubAddCommen
8168
return overtypeContainer.parentElement!.closest('div')!
8269
}
8370

84-
tableTitle(spot: GitHubAddCommentSpot): string {
71+
tableTitle(spot: GitHubPRAddCommentSpot): string {
8572
const { slug, number } = spot
8673
return `${slug} PR #${number}`
8774
}
8875

89-
tableIcon(_: GitHubAddCommentSpot): string {
76+
tableIcon(_: GitHubPRAddCommentSpot): string {
9077
return '🔄' // PR icon TODO: icon urls in /public
9178
}
9279

93-
buildUrl(spot: GitHubAddCommentSpot): string {
80+
buildUrl(spot: GitHubPRAddCommentSpot): string {
9481
return `https://${spot.domain}/${spot.slug}/pull/${spot.number}`
9582
}
9683
}
97-
98-
function hljsHighlighter(code: string, language: string) {
99-
try {
100-
if (language && hljs.getLanguage(language)) {
101-
const result = hljs.highlight(code, { language })
102-
return result.value
103-
} else {
104-
const result = hljs.highlightAuto(code)
105-
return result.value
106-
}
107-
} catch (error) {
108-
console.warn('highlight.js highlighting failed:', error)
109-
return code
110-
}
111-
}

‎browser-extension/src/lib/enhancers/github/githubSpotTypes.ts‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
export const GITHUB_SPOT_TYPES = [
2+
'GH_PR_ADD_COMMENT',
3+
/* TODO
4+
'GH_ISSUE_NEW',
5+
'GH_PR_NEW',
6+
'GH_ISSUE_ADD_COMMENT',
7+
'GH_ISSUE_EDIT_COMMENT',
8+
'GH_PR_EDIT_COMMENT',
9+
'GH_PR_CODE_COMMENT',
10+
*/
11+
] as const
12+
13+
export type GitHubSpotType = (typeof GITHUB_SPOT_TYPES)[number]

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import type { OverTypeInstance } from '../overtype/overtype'
22
import type { CommentEnhancer, CommentSpot } from './enhancer'
3-
import { GitHubAddCommentEnhancer } from './enhancers/github'
3+
import { GitHubPRAddCommentEnhancer } from './enhancers/github/githubPRAddComment'
44

55
export interface EnhancedTextarea<T extends CommentSpot = CommentSpot> {
66
textarea: HTMLTextAreaElement
@@ -15,7 +15,7 @@ export class EnhancerRegistry {
1515

1616
constructor() {
1717
// Register all available handlers
18-
this.register(new GitHubAddCommentEnhancer())
18+
this.register(new GitHubPRAddCommentEnhancer())
1919
}
2020

2121
private register<T extends CommentSpot>(handler: CommentEnhancer<T>): void {

‎browser-extension/src/playgrounds/github-playground.ts‎

Lines changed: 32 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,47 @@
1-
import hljs from "highlight.js";
2-
import OverType from "../overtype/overtype";
1+
import hljs from 'highlight.js'
2+
import OverType from '../overtype/overtype'
33

44
export function githubPrNewCommentContentScript() {
5-
if (window.location.hostname !== "github.com") {
6-
return;
7-
}
8-
OverType.setCodeHighlighter(hljsHighlighter);
9-
const ghCommentBox = document.getElementById(
10-
"new_comment_field"
11-
) as HTMLTextAreaElement | null;
12-
if (ghCommentBox) {
13-
const overtypeContainer = modifyDOM(ghCommentBox);
14-
new OverType(overtypeContainer, {
15-
placeholder: "Add your comment here...",
16-
autoResize: true,
17-
minHeight: "102px",
18-
padding: "var(--base-size-8)",
19-
});
20-
}
5+
if (window.location.hostname !== 'github.com') {
6+
return
7+
}
8+
OverType.setCodeHighlighter(hljsHighlighter)
9+
const ghCommentBox = document.getElementById('new_comment_field') as HTMLTextAreaElement | null
10+
if (ghCommentBox) {
11+
const overtypeContainer = modifyDOM(ghCommentBox)
12+
new OverType(overtypeContainer, {
13+
autoResize: true,
14+
minHeight: '102px',
15+
padding: 'var(--base-size-8)',
16+
placeholder: 'Add your comment here...',
17+
})
18+
}
2119
}
2220

2321
function modifyDOM(overtypeInput: HTMLTextAreaElement): HTMLElement {
24-
overtypeInput.classList.add("overtype-input");
25-
const overtypePreview = document.createElement("div");
26-
overtypePreview.classList.add("overtype-preview");
27-
overtypeInput.insertAdjacentElement("afterend", overtypePreview);
28-
const overtypeWrapper = overtypeInput.parentElement!.closest("div")!;
29-
overtypeWrapper.classList.add("overtype-wrapper");
30-
overtypeInput.placeholder = "Add your comment here...";
31-
const overtypeContainer = overtypeWrapper.parentElement!.closest("div")!;
32-
overtypeContainer.classList.add("overtype-container");
33-
return overtypeContainer.parentElement!.closest("div")!;
22+
overtypeInput.classList.add('overtype-input')
23+
const overtypePreview = document.createElement('div')
24+
overtypePreview.classList.add('overtype-preview')
25+
overtypeInput.insertAdjacentElement('afterend', overtypePreview)
26+
const overtypeWrapper = overtypeInput.parentElement!.closest('div')!
27+
overtypeWrapper.classList.add('overtype-wrapper')
28+
overtypeInput.placeholder = 'Add your comment here...'
29+
const overtypeContainer = overtypeWrapper.parentElement!.closest('div')!
30+
overtypeContainer.classList.add('overtype-container')
31+
return overtypeContainer.parentElement!.closest('div')!
3432
}
3533

3634
function hljsHighlighter(code: string, language: string) {
3735
try {
3836
if (language && hljs.getLanguage(language)) {
39-
const result = hljs.highlight(code, { language });
40-
return result.value;
37+
const result = hljs.highlight(code, { language })
38+
return result.value
4139
} else {
42-
const result = hljs.highlightAuto(code);
43-
return result.value;
40+
const result = hljs.highlightAuto(code)
41+
return result.value
4442
}
4543
} catch (error) {
46-
console.warn("highlight.js highlighting failed:", error);
47-
return code;
44+
console.warn('highlight.js highlighting failed:', error)
45+
return code
4846
}
4947
}

0 commit comments

Comments
 (0)