Skip to content

Commit 90883e2

Browse files
nedtwiggnedtwigg
authored
Better table upper decorations (#95 closes #73)
2 parents f0997b1 + db3fc26 commit 90883e2

File tree

5 files changed

+150
-74
lines changed

5 files changed

+150
-74
lines changed

‎src/lib/enhancers/github/GitHubIssueAppendEnhancer.tsx‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -90,13 +90,15 @@ export class GitHubIssueAppendEnhancer
9090
<span className="flex h-4 w-4 flex-shrink-0 items-center justify-center">
9191
<IssueOpenedIcon size={16} />
9292
</span>
93-
#{spot.number}
94-
<a
95-
href={`https://${spot.domain}/${spot.slug}`}
96-
className="truncate hover:underline"
97-
>
98-
{spot.slug}
99-
</a>
93+
<span>
94+
#{spot.number} |{" "}
95+
<a
96+
href={`https://${spot.domain}/${spot.slug}`}
97+
className="truncate hover:underline"
98+
>
99+
{spot.slug}
100+
</a>
101+
</span>
100102
</>
101103
)
102104
}

‎src/lib/enhancers/github/GitHubIssueCreateEnhancer.tsx‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { IssueOpenedIcon } from "@primer/octicons-react"
12
import OverType, { type OverTypeInstance } from "overtype"
23
import type {
34
CommentEnhancer,
@@ -74,13 +75,19 @@ export class GitHubIssueCreateEnhancer
7475
}
7576

7677
tableUpperDecoration(spot: GitHubIssueCreateSpot): React.ReactNode {
77-
const { slug } = spot
7878
return (
7979
<>
80-
<span>New Issue</span>
81-
<span className="font-mono text-muted-foreground text-sm">
82-
{" "}
83-
{slug}{" "}
80+
<span className="flex h-4 w-4 flex-shrink-0 items-center justify-center">
81+
<IssueOpenedIcon size={16} />
82+
</span>
83+
<span>
84+
New |{" "}
85+
<a
86+
href={`https://${spot.domain}/${spot.slug}`}
87+
className="truncate hover:underline"
88+
>
89+
{spot.slug}
90+
</a>
8491
</span>
8592
</>
8693
)

‎src/lib/enhancers/github/GitHubPrAppendEnhancer.tsx‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { FeedPullRequestOpenIcon } from "@primer/octicons-react"
12
import OverType, { type OverTypeInstance } from "overtype"
23
import type React from "react"
34
import type {
@@ -83,11 +84,20 @@ export class GitHubPrAppendEnhancer
8384
}
8485

8586
tableUpperDecoration(spot: GitHubPrAppendSpot): React.ReactNode {
86-
const { slug, number } = spot
8787
return (
8888
<>
89-
<span className="font-mono text-muted-foreground text-sm">{slug}</span>
90-
<span className="ml-2 font-medium">PR #{number}</span>
89+
<span className="flex h-4 w-4 flex-shrink-0 items-center justify-center">
90+
<FeedPullRequestOpenIcon size={16} />
91+
</span>
92+
<span>
93+
#{spot.number} |{" "}
94+
<a
95+
href={`https://${spot.domain}/${spot.slug}`}
96+
className="truncate hover:underline"
97+
>
98+
{spot.slug}
99+
</a>
100+
</span>
91101
</>
92102
)
93103
}

‎src/lib/enhancers/github/GitHubPrCreateEnhancer.tsx‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { FeedPullRequestOpenIcon } from "@primer/octicons-react"
12
import OverType, { type OverTypeInstance } from "overtype"
23
import type {
34
CommentEnhancer,
@@ -89,13 +90,19 @@ export class GitHubPrCreateEnhancer
8990
}
9091

9192
tableUpperDecoration(spot: GitHubPrCreateSpot): React.ReactNode {
92-
const { slug } = spot
9393
return (
9494
<>
95-
<span>New PR</span>
96-
<span className="font-mono text-muted-foreground text-sm">
97-
{" "}
98-
{slug}{" "}
95+
<span className="flex h-4 w-4 flex-shrink-0 items-center justify-center">
96+
<FeedPullRequestOpenIcon size={16} />
97+
</span>
98+
<span>
99+
New |{" "}
100+
<a
101+
href={`https://${spot.domain}/${spot.slug}`}
102+
className="truncate hover:underline"
103+
>
104+
{spot.slug}
105+
</a>
99106
</span>
100107
</>
101108
)

‎tests/lib/enhancers/__snapshots__/gh-ui.test.ts.snap‎

Lines changed: 104 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,18 @@ exports[`github ui > gh_issue:should render correct UI elements 1`] = `
1313
size={16}
1414
/>
1515
</span>
16-
#
17-
523
18-
<a
19-
className="truncate hover:underline"
20-
href="https://github.com/diffplug/selfie"
21-
>
22-
diffplug/selfie
23-
</a>
16+
<span>
17+
#
18+
523
19+
|
20+
21+
<a
22+
className="truncate hover:underline"
23+
href="https://github.com/diffplug/selfie"
24+
>
25+
diffplug/selfie
26+
</a>
27+
</span>
2428
</React.Fragment>,
2529
},
2630
]
@@ -46,14 +50,18 @@ exports[`github ui > gh_issue_edit:should render correct UI elements 1`] = `
4650
size={16}
4751
/>
4852
</span>
49-
#
50-
56
51-
<a
52-
className="truncate hover:underline"
53-
href="https://github.com/diffplug/gitcasso"
54-
>
55-
diffplug/gitcasso
56-
</a>
53+
<span>
54+
#
55+
56
56+
|
57+
58+
<a
59+
className="truncate hover:underline"
60+
href="https://github.com/diffplug/gitcasso"
61+
>
62+
diffplug/gitcasso
63+
</a>
64+
</span>
5765
</React.Fragment>,
5866
},
5967
]
@@ -86,14 +94,18 @@ exports[`github ui > gh_issue_edit_multiple:should render correct UI elements 1`
8694
size={16}
8795
/>
8896
</span>
89-
#
90-
3
91-
<a
92-
className="truncate hover:underline"
93-
href="https://github.com/diffplug/testing-deletable"
94-
>
95-
diffplug/testing-deletable
96-
</a>
97+
<span>
98+
#
99+
3
100+
|
101+
102+
<a
103+
className="truncate hover:underline"
104+
href="https://github.com/diffplug/testing-deletable"
105+
>
106+
diffplug/testing-deletable
107+
</a>
108+
</span>
97109
</React.Fragment>,
98110
},
99111
]
@@ -105,15 +117,22 @@ exports[`github ui > gh_issue_new:should render correct UI elements 1`] = `
105117
"for": "id=:r34: name=null className=prc-Textarea-TextArea-13q4j focus-visible overtype-input",
106118
"title": "New issue title",
107119
"upperDecoration": <React.Fragment>
108-
<span>
109-
New Issue
110-
</span>
111120
<span
112-
className="font-mono text-muted-foreground text-sm"
121+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
113122
>
123+
<IssueOpenedIcon
124+
size={16}
125+
/>
126+
</span>
127+
<span>
128+
New |
114129
115-
diffplug/gitcasso
116-
130+
<a
131+
className="truncate hover:underline"
132+
href="https://github.com/diffplug/gitcasso"
133+
>
134+
diffplug/gitcasso
135+
</a>
117136
</span>
118137
</React.Fragment>,
119138
},
@@ -128,15 +147,23 @@ exports[`github ui > gh_pr:should render correct UI elements 1`] = `
128147
#517",
129148
"upperDecoration": <React.Fragment>
130149
<span
131-
className="font-mono text-muted-foreground text-sm"
150+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
132151
>
133-
diffplug/selfie
152+
<FeedPullRequestOpenIcon
153+
size={16}
154+
/>
134155
</span>
135-
<span
136-
className="ml-2 font-medium"
137-
>
138-
PR #
156+
<span>
157+
#
139158
517
159+
|
160+
161+
<a
162+
className="truncate hover:underline"
163+
href="https://github.com/diffplug/selfie"
164+
>
165+
diffplug/selfie
166+
</a>
140167
</span>
141168
</React.Fragment>,
142169
},
@@ -159,15 +186,23 @@ exports[`github ui > gh_pr_edit:should render correct UI elements 1`] = `
159186
#58",
160187
"upperDecoration": <React.Fragment>
161188
<span
162-
className="font-mono text-muted-foreground text-sm"
189+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
163190
>
164-
diffplug/gitcasso
191+
<FeedPullRequestOpenIcon
192+
size={16}
193+
/>
165194
</span>
166-
<span
167-
className="ml-2 font-medium"
168-
>
169-
PR #
195+
<span>
196+
#
170197
58
198+
|
199+
200+
<a
201+
className="truncate hover:underline"
202+
href="https://github.com/diffplug/gitcasso"
203+
>
204+
diffplug/gitcasso
205+
</a>
171206
</span>
172207
</React.Fragment>,
173208
},
@@ -196,15 +231,23 @@ exports[`github ui > gh_pr_edit_multiple:should render correct UI elements 1`] =
196231
#5",
197232
"upperDecoration": <React.Fragment>
198233
<span
199-
className="font-mono text-muted-foreground text-sm"
234+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
200235
>
201-
diffplug/testing-deletable
236+
<FeedPullRequestOpenIcon
237+
size={16}
238+
/>
202239
</span>
203-
<span
204-
className="ml-2 font-medium"
205-
>
206-
PR #
240+
<span>
241+
#
207242
5
243+
|
244+
245+
<a
246+
className="truncate hover:underline"
247+
href="https://github.com/diffplug/testing-deletable"
248+
>
249+
diffplug/testing-deletable
250+
</a>
208251
</span>
209252
</React.Fragment>,
210253
},
@@ -217,15 +260,22 @@ exports[`github ui > gh_pr_new:should render correct UI elements 1`] = `
217260
"for": "id=pull_request_body name=pull_request[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 CommentBox-input--large overtype-input",
218261
"title": "Update README.md",
219262
"upperDecoration": <React.Fragment>
220-
<span>
221-
New PR
222-
</span>
223263
<span
224-
className="font-mono text-muted-foreground text-sm"
264+
className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
225265
>
266+
<FeedPullRequestOpenIcon
267+
size={16}
268+
/>
269+
</span>
270+
<span>
271+
New |
226272
227-
diffplug/selfie
228-
273+
<a
274+
className="truncate hover:underline"
275+
href="https://github.com/diffplug/selfie"
276+
>
277+
diffplug/selfie
278+
</a>
229279
</span>
230280
</React.Fragment>,
231281
},

0 commit comments

Comments
 (0)