diff --git a/src/components/Node.tsx b/src/components/Node.tsx
index 5fa7942..7fd3ea1 100644
--- a/src/components/Node.tsx
+++ b/src/components/Node.tsx
@@ -38,6 +38,10 @@ export function Node({
style,
onClick,
}: Props) {
+ const {
+ value: { commentToggle },
+ } = useConfigs()
+
return (
{renderLabelText(node)}
+ {(commentToggle && !!node.comments) && 💬 {node.comments}}
{renderActions && {renderActions(node)}
}
diff --git a/src/components/settings/SidebarSettings.tsx b/src/components/settings/SidebarSettings.tsx
index 8f805b0..3ac1ed8 100644
--- a/src/components/settings/SidebarSettings.tsx
+++ b/src/components/settings/SidebarSettings.tsx
@@ -102,6 +102,14 @@ export function SidebarSettings(props: React.PropsWithChildren) {
},
}}
/>
+
)
}
diff --git a/src/global.d.ts b/src/global.d.ts
index 081c987..e149322 100644
--- a/src/global.d.ts
+++ b/src/global.d.ts
@@ -14,6 +14,7 @@ type TreeNode = {
url?: string
sha?: string
accessDenied?: boolean
+ comments: number
}
type IO = {
diff --git a/src/platforms/GitHub/API.ts b/src/platforms/GitHub/API.ts
index 083912e..0491ef9 100644
--- a/src/platforms/GitHub/API.ts
+++ b/src/platforms/GitHub/API.ts
@@ -106,6 +106,16 @@ export async function getPullTreeData(
return await request(url, { accessToken })
}
+export async function getPullComments(
+ userName: string,
+ repoName: string,
+ pullId: string,
+ accessToken?: string,
+): Promise {
+ const url = `https://${API_ENDPOINT}/repos/${userName}/${repoName}/pulls/${pullId}/comments`
+ return await request(url, { accessToken })
+}
+
export async function getPullPageDocument(
userName: string,
repoName: string,
diff --git a/src/platforms/GitHub/Request.d.ts b/src/platforms/GitHub/Request.d.ts
index a010a1c..257cf46 100644
--- a/src/platforms/GitHub/Request.d.ts
+++ b/src/platforms/GitHub/Request.d.ts
@@ -35,7 +35,12 @@ declare namespace GitHubAPI {
changed_files: number
}
+ type PullComment = {
+ path: string
+ }
+
type PullTreeData = PullTreeItem[]
+ type PullComments = PullComment[]
type MetaData = {
name: string
diff --git a/src/platforms/GitHub/index.ts b/src/platforms/GitHub/index.ts
index 4b63d68..f37bff6 100644
--- a/src/platforms/GitHub/index.ts
+++ b/src/platforms/GitHub/index.ts
@@ -177,9 +177,10 @@ export const GitHub: Platform = {
GITHUB_API_RESPONSE_LENGTH_LIMIT / GITHUB_API_PAGED_RESPONSE_LENGTH_LIMIT,
)
let page = 1
- const [pullData, treeData] = await Promise.all([
+ const [pullData, treeData, commentData] = await Promise.all([
API.getPullData(userName, repoName, pullId, accessToken),
API.getPullTreeData(userName, repoName, pullId, page, accessToken),
+ API.getPullComments(userName, repoName, pullId, accessToken),
])
const count = pullData.changed_files
@@ -207,6 +208,7 @@ export const GitHub: Platform = {
window.location.search
}#${creator(item.filename) || ''}`,
sha: item.sha,
+ comments: commentData?.filter(comment => item.filename === comment.path).length,
}))
const root = processTree(nodes)
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 85a3e31..bc813e2 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -503,6 +503,14 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
&.focused,
&:hover {
background: var(--gitako-bg-tertiary);
+
+ .node-item-comment {
+ background: var(--gitako-bg-tertiary);
+ background: -moz-linear-gradient(left, transparent 0%, var(--gitako-bg-tertiary) 15%, var(--gitako-bg-tertiary) 100%);
+ background: -webkit-linear-gradient(left, transparent 0%, var(--gitako-bg-tertiary) 15%, var(--gitako-bg-tertiary) 100%);
+ background: linear-gradient(to right, transparent 0% ,var(--gitako-bg-tertiary) 15%, var(--gitako-bg-tertiary) 100%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#161b22', endColorstr='#161b22', GradientType=1);
+ }
}
&:active {
background: var(--gitako-bg-secondary);
@@ -574,6 +582,21 @@ $minimal-z-index: max($github-header-z-index, $github-pull-request-float-header-
}
}
+ .node-item-comment {
+ position: absolute;
+ top: 0;
+ right: 0;
+ height: 36px;
+ line-height: 37px;
+ padding: 0 10px;
+ color: var(--gitako-auto-gray-5);
+ background: var(--gitako-bg-primary);
+ background: -moz-linear-gradient(left, transparent 0%, var(--gitako-bg-primary) 15%, var(--gitako-bg-primary) 100%);
+ background: -webkit-linear-gradient(left, transparent 0%, var(--gitako-bg-primary) 15%, var(--gitako-bg-primary) 100%);
+ background: linear-gradient(to right, transparent 0%, var(--gitako-bg-primary) 15%, var(--gitako-bg-primary) 100%);
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000d1117', endColorstr='#0d1117', GradientType=1);
+ }
+
.go-to-button,
.find-in-folder-button {
@include icon-button();
diff --git a/src/utils/configHelper.ts b/src/utils/configHelper.ts
index bbedd31..01c1869 100644
--- a/src/utils/configHelper.ts
+++ b/src/utils/configHelper.ts
@@ -14,6 +14,7 @@ export type Config = {
toggleButtonContent: 'logo' | 'octoface'
recursiveToggleFolder: 'shift' | 'alt'
searchMode: SearchMode
+ commentToggle: boolean
}
enum configKeys {
@@ -29,6 +30,7 @@ enum configKeys {
toggleButtonContent = 'toggleButtonContent',
recursiveToggleFolder = 'recursiveToggleFolder',
searchMode = 'searchMode',
+ commentToggle = 'commentToggle',
}
const defaultConfigs: Config = {
@@ -44,6 +46,7 @@ const defaultConfigs: Config = {
toggleButtonContent: 'logo',
recursiveToggleFolder: 'shift',
searchMode: 'fuzzy',
+ commentToggle: true,
}
const configKeyArray = Object.values(configKeys)
@@ -85,6 +88,7 @@ async function migrateConfig() {
'copySnippetButton',
'intelligentToggle',
'icons',
+ 'commentToggle',
])
if (config && (!('configVersion' in config) || config.configVersion < version)) {
await storageHelper.set({ platform_GitHub: config, configVersion: version })