-
Notifications
You must be signed in to change notification settings - Fork 102
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* feat: adopt github native tag styles * feat: add opendigger logo to labels * style: adjust styles of the opendigger logo * refactor: vertical align logo and text in correct way * chore: change for smaller opendigger png * fix: tags are not inserted to repositories without a tag container * fix: handle repo meta without labels
- Loading branch information
Showing
4 changed files
with
74 additions
and
89 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
35 changes: 35 additions & 0 deletions
35
src/pages/ContentScripts/features/repo-sidebar-labels/OpenDiggerLabel.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
import React from 'react'; | ||
import { Label } from '../../../../api/common'; | ||
|
||
interface OpenDiggerLabelProps { | ||
label: Label; | ||
} | ||
|
||
const OpenDiggerLabel: React.FC<OpenDiggerLabelProps> = ({ label }) => { | ||
return ( | ||
<a | ||
id={`opendigger-label-${label.id}`} | ||
className="topic-tag topic-tag-link" | ||
style={{ | ||
display: 'inline-flex', | ||
alignItems: 'center', | ||
paddingLeft: '4px', | ||
}} | ||
href="https://open-digger.cn" | ||
target="_blank" | ||
> | ||
<img | ||
style={{ | ||
marginRight: '4px', | ||
borderRadius: '50%', | ||
}} | ||
src="https://open-digger.cn/img/logo/logo-blue-round-corner-36px.png" | ||
width={16} | ||
height={16} | ||
/> | ||
<span>{label.name}</span> | ||
</a> | ||
); | ||
}; | ||
|
||
export default OpenDiggerLabel; |
67 changes: 32 additions & 35 deletions
67
src/pages/ContentScripts/features/repo-sidebar-labels/index.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,57 +1,54 @@ | ||
import features from '../../../../feature-manager'; | ||
import View from './view'; | ||
import elementReady from 'element-ready'; | ||
import { getRepoName, hasRepoContainerHeader, isPublicRepoWithMeta } from '../../../../helpers/get-repo-info'; | ||
import { RepoMeta, metaStore } from '../../../../api/common'; | ||
import { Label, RepoMeta, metaStore } from '../../../../api/common'; | ||
import { createRoot } from 'react-dom/client'; | ||
import OpenDiggerLabel from './OpenDiggerLabel'; | ||
|
||
import React from 'react'; | ||
import $ from 'jquery'; | ||
import { createRoot } from 'react-dom/client'; | ||
|
||
const featureId = features.getFeatureID(import.meta.url); | ||
type Label = { | ||
id: string; | ||
name: string; | ||
type: string; | ||
}; | ||
|
||
let repoName: string; | ||
let meta: RepoMeta; | ||
let filteredLabels: Label[]; | ||
|
||
const getData = async () => { | ||
meta = (await metaStore.get(repoName)) as RepoMeta; | ||
const getLabels = async (repoName: string) => { | ||
const meta = (await metaStore.get(repoName)) as RepoMeta; | ||
// filtered all xxx-n and n is not 0 | ||
filteredLabels = (meta.labels as Label[]).filter((label: Label) => { | ||
return meta.labels?.filter((label) => { | ||
return !(label.type.includes('-') && parseInt(label.type.split('-')[1]) > 0); | ||
}); | ||
}; | ||
|
||
const renderTo = (container: any) => { | ||
createRoot(container).render(<View labels={filteredLabels} />); | ||
const renderTags = (labels: Label[]) => { | ||
let githubTagContainer = $('.topic-tag.topic-tag-link').parent(); | ||
// some repositories don't have tags, create a tag container for our tags | ||
if (githubTagContainer.length === 0) { | ||
githubTagContainer = $('<div class="f6"></div>'); | ||
const githubTagContainerWrap = $('<div class="my-3"></div>'); | ||
githubTagContainerWrap.append(githubTagContainer); | ||
const anchor = $('h3.sr-only:contains("Resources")'); | ||
githubTagContainerWrap.insertBefore(anchor); | ||
} | ||
for (const label of labels) { | ||
const id = `opendigger-label-${label.id}`; | ||
// if the tag already exists, skip | ||
if (document.getElementById(id)) { | ||
continue; | ||
} | ||
const labelElement = document.createElement('span'); | ||
createRoot(labelElement).render(<OpenDiggerLabel label={label} />); | ||
githubTagContainer.append(labelElement); | ||
} | ||
}; | ||
|
||
const init = async (): Promise<void> => { | ||
repoName = getRepoName(); | ||
await getData(); | ||
const container = document.createElement('div'); | ||
container.id = featureId; | ||
createRoot(container).render(<View labels={filteredLabels} />); | ||
|
||
await elementReady('.Layout-sidebar'); | ||
$('.Layout-sidebar').find('p.f4.my-3').after(container); | ||
}; | ||
|
||
const restore = async () => { | ||
if (repoName !== getRepoName()) { | ||
repoName = getRepoName(); | ||
await getData(); | ||
const repoName = getRepoName(); | ||
const labels = await getLabels(repoName); | ||
if (labels && labels.length > 0) { | ||
renderTags(labels); | ||
} | ||
renderTo($(`#${featureId}`)[0]); | ||
}; | ||
|
||
features.add(featureId, { | ||
asLongAs: [isPublicRepoWithMeta, hasRepoContainerHeader], | ||
awaitDomReady: false, | ||
awaitDomReady: true, | ||
init, | ||
restore, | ||
}); |
53 changes: 0 additions & 53 deletions
53
src/pages/ContentScripts/features/repo-sidebar-labels/view.tsx
This file was deleted.
Oops, something went wrong.