From ed291fc4266df9fd5cbc052167e37a726aa8ad96 Mon Sep 17 00:00:00 2001 From: Percy Ma Date: Thu, 2 Jun 2022 18:04:07 +0800 Subject: [PATCH 1/3] fix: unable to use non-GitHub repo in editLink close https://github.com/vuejs/vitepress/issues/694 --- docs/config/theme-configs.md | 55 +++++++++++++++++++ .../theme-default/composables/edit-link.ts | 2 +- types/default-theme.d.ts | 7 +++ 3 files changed, 63 insertions(+), 1 deletion(-) diff --git a/docs/config/theme-configs.md b/docs/config/theme-configs.md index 17c24708849c..7755d5ee25eb 100644 --- a/docs/config/theme-configs.md +++ b/docs/config/theme-configs.md @@ -188,6 +188,61 @@ export interface Footer { } ``` +## editLink + +- Type: `EditLink` + +Edit link configuration. You can then customize git repo link and display text. + +```ts +export default { + themeConfig: { + editLink: { + domain: 'github.com' + repo: 'vuejs/vitepress', + branch: 'next', + dir: 'docs', + text: 'Edit this page on GitHub' + }, + } +} +``` + +```ts +export interface EditLink { + /** + * Domain of git repo + * + * @example 'github.com' or 'https://github.com' + */ + domain?: string + /** + * Repo of the site. + * + * @example 'vuejs/docs' + */ + repo: string + /** + * Branch of the repo. + * + * @default 'main' + */ + branch?: string + /** + * If your docs are not at the root of the repo. + * + * @example 'docs' + */ + dir?: string + /** + * Custom text for edit link. + * + * @default 'Edit this page' + */ + text?: string +} +``` + ## lastUpdatedText - Type: `string` diff --git a/src/client/theme-default/composables/edit-link.ts b/src/client/theme-default/composables/edit-link.ts index 32bf66c20cff..44dd571343e3 100644 --- a/src/client/theme-default/composables/edit-link.ts +++ b/src/client/theme-default/composables/edit-link.ts @@ -6,7 +6,7 @@ export function useEditLink() { return computed(() => { const url = [ - 'https://github.com', + `https://${theme.value.editLink?.domain || 'github.com'}`, theme.value.editLink?.repo || '???', 'edit', theme.value.editLink?.branch || 'main', diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts index 2f44cd113774..6ed2a0047dab 100644 --- a/types/default-theme.d.ts +++ b/types/default-theme.d.ts @@ -119,6 +119,13 @@ export namespace DefaultTheme { // edit link ----------------------------------------------------------------- export interface EditLink { + /** + * Domain of git repo + * + * @example 'github.com' or 'https://github.com' + */ + domain?: string + /** * Repo of the site. * From 267c702d0e1e8280f0c661b5c214def02aed19c8 Mon Sep 17 00:00:00 2001 From: Percy Ma Date: Thu, 2 Jun 2022 20:38:12 +0800 Subject: [PATCH 2/3] feat: allow custom edit link style Co-authored-by: Divyansh Singh <40380293+brc-dd@users.noreply.github.com> --- docs/.vitepress/config.ts | 3 +- docs/config/theme-configs.md | 19 +++++++- .../theme-default/composables/edit-link.ts | 48 ++++++++++++------- types/default-theme.d.ts | 9 +++- 4 files changed, 59 insertions(+), 20 deletions(-) diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index f35819775c52..d3b840d7e51f 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -16,8 +16,9 @@ export default defineConfig({ }, editLink: { + domain: 'gitlab.com', repo: 'vuejs/vitepress', - branch: 'next', + branch: 'main', dir: 'docs', text: 'Edit this page on GitHub' }, diff --git a/docs/config/theme-configs.md b/docs/config/theme-configs.md index 7755d5ee25eb..7f532b1997be 100644 --- a/docs/config/theme-configs.md +++ b/docs/config/theme-configs.md @@ -194,13 +194,22 @@ export interface Footer { Edit link configuration. You can then customize git repo link and display text. +We have built-in recognition of common git services, you just need to configure the domain. If you're using a self-built service (like GitLab) you can specify or customize the link style. + + +Available parameters: + - `:repo`: The `repo` you configured + - `:branch`: Ibid + - `:path`: `dir` + file path + ```ts export default { themeConfig: { editLink: { - domain: 'github.com' + style: ':repo/edit/:branch/:path', + domain: 'github.com', repo: 'vuejs/vitepress', - branch: 'next', + branch: 'main', dir: 'docs', text: 'Edit this page on GitHub' }, @@ -210,6 +219,12 @@ export default { ```ts export interface EditLink { + /** + * Git service edit link style. + * + * @default 'github' + */ + style?: 'github' | 'gitlab' | 'bitbucket' | string /** * Domain of git repo * diff --git a/src/client/theme-default/composables/edit-link.ts b/src/client/theme-default/composables/edit-link.ts index 44dd571343e3..90ef5baf881a 100644 --- a/src/client/theme-default/composables/edit-link.ts +++ b/src/client/theme-default/composables/edit-link.ts @@ -4,23 +4,39 @@ import { useData } from 'vitepress' export function useEditLink() { const { theme, page } = useData() - return computed(() => { - const url = [ - `https://${theme.value.editLink?.domain || 'github.com'}`, - theme.value.editLink?.repo || '???', - 'edit', - theme.value.editLink?.branch || 'main', - theme.value.editLink?.dir || null, - page.value.relativePath - ] - .filter((v) => v) - .join('/') + const { + style = '', + domain = 'github.com', + repo = '???', + branch = 'main', + dir = '', + text = 'Edit this page' + } = theme.value.editLink || {} + const { relativePath } = page.value + const base = /^https?:\/\//.test(domain) ? domain : `https://${domain}` + const path = dir ? `/${dir}/${relativePath}` : `/${relativePath}` + + const linkStyle = { + github: ':repo/edit/:branch/:path', + gitlab: ':repo/-/edit/:branch/:path', + bitbucket: + ':repo/src/:branch/:path?mode=edit&spa=0&at=:branch&fileviewer=file-view-default' + } - const text = theme.value.editLink?.text ?? 'Edit this page' + function knownService(domain: string) { + if (/bitbucket\.org/.test(domain)) return 'bitbucket' + if (/gitlab\.com/.test(domain)) return 'gitlab' + if (/gitee\.com/.test(domain)) return 'github' + return 'github' + } + + return computed(() => { + const url = `${base}/${style || linkStyle[knownService(domain)]}` + .replace(/:repo/g, repo) + .replace(/:branch/g, branch) + .replace(/:path/g, `${path}`) + .replace(/([^:])\/\//g, '$1/') - return { - url, - text - } + return { url, text } }) } diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts index 6ed2a0047dab..e282d4c267ec 100644 --- a/types/default-theme.d.ts +++ b/types/default-theme.d.ts @@ -120,7 +120,14 @@ export namespace DefaultTheme { export interface EditLink { /** - * Domain of git repo + * Git service edit link style. + * + * @default 'github' + */ + style?: 'github' | 'gitlab' | 'bitbucket' | string + + /** + * Domain of the git service. * * @example 'github.com' or 'https://github.com' */ From 290dac3ba47d915e50bde52479aca036dfdab8c4 Mon Sep 17 00:00:00 2001 From: Percy Ma Date: Thu, 2 Jun 2022 20:40:14 +0800 Subject: [PATCH 3/3] docs(theme): keep in sync with comment --- docs/config/theme-configs.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/config/theme-configs.md b/docs/config/theme-configs.md index 7f532b1997be..f232977e5880 100644 --- a/docs/config/theme-configs.md +++ b/docs/config/theme-configs.md @@ -226,7 +226,7 @@ export interface EditLink { */ style?: 'github' | 'gitlab' | 'bitbucket' | string /** - * Domain of git repo + * Domain of the git service. * * @example 'github.com' or 'https://github.com' */