diff --git a/src/client/theme-default/components/NavBarLinks.ts b/src/client/theme-default/components/NavBarLinks.ts index 9e5367ad..671afb81 100644 --- a/src/client/theme-default/components/NavBarLinks.ts +++ b/src/client/theme-default/components/NavBarLinks.ts @@ -2,24 +2,59 @@ import { computed } from 'vue' import { useSiteData, useSiteDataByRoute } from 'vitepress' import NavBarLink from './NavBarLink.vue' import NavDropdownLink from './NavDropdownLink.vue' -import NavRepoLink from './NavRepoLink.vue' +import { DefaultTheme } from '../config' + +const platforms = ['GitHub', 'GitLab', 'Bitbucket'].map( + (platform) => [platform, new RegExp(platform, 'i')] as const +) export default { components: { NavBarLink, - NavDropdownLink, - NavRepoLink + NavDropdownLink }, setup() { + const siteDataByRoute = useSiteDataByRoute() + const siteData = useSiteData() + const repoInfo = computed(() => { + const theme = siteData.value.themeConfig as DefaultTheme.Config + // return theme.editLinks + // ? { + // repo: theme.docsRepo || theme.repo, + // label: theme.repoLabel + // } + // : null + + const repo = theme.docsRepo || theme.repo + let text: string | undefined = theme.repoLabel + + if (repo) { + const link = /^https?:/.test(repo) ? repo : `https://github.com/${repo}` + if (!text) { + // if no label is provided, deduce it from the repo url + const repoHosts = link.match(/^https?:\/\/[^/]+/) + if (repoHosts) { + const repoHost = repoHosts[0] + const foundPlatform = platforms.find(([_platform, re]) => + re.test(repoHost) + ) + text = foundPlatform && foundPlatform[0] + } + } + + return { link, text: text || 'Source' } + } + return null + }) return { navData: process.env.NODE_ENV === 'production' ? // navbar items do not change in production - useSiteDataByRoute().value.themeConfig.nav + siteDataByRoute.value.themeConfig.nav : // use computed in dev for hot reload - computed(() => useSiteDataByRoute().value.themeConfig.nav), - editLinkConfig: computed(() => useSiteData().value.themeConfig.editLink) + computed(() => siteDataByRoute.value.themeConfig.nav), + repoInfo } } } diff --git a/src/client/theme-default/components/NavBarLinks.vue b/src/client/theme-default/components/NavBarLinks.vue index 7ddb2782..9fcd03d2 100644 --- a/src/client/theme-default/components/NavBarLinks.vue +++ b/src/client/theme-default/components/NavBarLinks.vue @@ -5,7 +5,7 @@ - + diff --git a/src/client/theme-default/components/NavRepoLink.ts b/src/client/theme-default/components/NavRepoLink.ts deleted file mode 100644 index a0b105a2..00000000 --- a/src/client/theme-default/components/NavRepoLink.ts +++ /dev/null @@ -1,47 +0,0 @@ -import { computed, defineComponent, PropType } from 'vue' -import OutboundLink from './icons/OutboundLink.vue' -import { DefaultTheme } from '/@theme/config' - -export default defineComponent({ - components: { - OutboundLink - }, - - props: { - editLinkConfig: { - type: Object as PropType, - required: true - } - }, - - setup(props) { - const editLinkConfig = props.editLinkConfig - const repoLink = computed(() => { - if (editLinkConfig && editLinkConfig.repo) { - return /^https?:/.test(editLinkConfig.repo) - ? editLinkConfig.repo - : `https://github.com/${editLinkConfig.repo}` - } - return null - }) - const repoLabel = computed(() => { - if (!repoLink.value) return - const repoHosts = repoLink.value.match(/^https?:\/\/[^/]+/) - if (!repoHosts) return - const repoHost = repoHosts[0] - const platforms = ['GitHub', 'GitLab', 'Bitbucket'] - for (let i = 0; i < platforms.length; i++) { - const platform = platforms[i] - if (new RegExp(platform, 'i').test(repoHost)) { - return platform - } - } - - return 'Source' - }) - return { - repoLink, - repoLabel - } - } -}) diff --git a/src/client/theme-default/components/NavRepoLink.vue b/src/client/theme-default/components/NavRepoLink.vue deleted file mode 100644 index f1091274..00000000 --- a/src/client/theme-default/components/NavRepoLink.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - - - diff --git a/src/client/theme-default/components/PageEdit.ts b/src/client/theme-default/components/PageEdit.ts index 753a5fa9..761d9bae 100644 --- a/src/client/theme-default/components/PageEdit.ts +++ b/src/client/theme-default/components/PageEdit.ts @@ -1,7 +1,8 @@ -import { defineComponent, computed } from 'vue' +import { computed } from 'vue' import OutboundLink from './icons/OutboundLink.vue' import { endingSlashRE, isExternal } from '/@theme/utils' -import { usePageData, useSiteData, useSiteDataByRoute } from 'vitepress' +import { usePageData, useSiteData } from 'vitepress' +import { DefaultTheme } from '../config' function createEditLink( repo: string, @@ -35,47 +36,46 @@ function createEditLink( ) } -export default defineComponent({ +export default { components: { OutboundLink }, setup() { const pageData = usePageData() - const siteData = useSiteData() - const siteDataByRoute = useSiteDataByRoute() - - const { - repo, - text, - dir = '', - branch = 'master', - docsRepo = repo - } = siteData.value.themeConfig.editLink - const { relativePath } = pageData.value + const siteData = useSiteData() const editLink = computed(() => { - const showEditLink = + const showEditLink: boolean | undefined = pageData.value.frontmatter.editLink == null - ? siteData.value.themeConfig.editLink + ? siteData.value.themeConfig.editLinks : pageData.value.frontmatter.editLink + const { + repo, + docsDir = '', + docsBranch = 'master', + docsRepo = repo + } = siteData.value.themeConfig - if (showEditLink && relativePath) { - return createEditLink(repo, docsRepo, dir, branch, relativePath) + const { relativePath } = pageData.value + if (showEditLink && relativePath && repo) { + return createEditLink( + repo, + docsRepo || repo, + docsDir, + docsBranch, + relativePath + ) } return null }) - const editLinkText = computed(() => { - return ( - siteDataByRoute.value.themeConfig.editLink.text || - text || - `Edit this page` - ) - }) + const editLinkText = computed( + () => siteData.value.themeConfig.editLinkText || 'Edit this page' + ) return { editLink, editLinkText } } -}) +} diff --git a/src/client/theme-default/components/PageEdit.vue b/src/client/theme-default/components/PageEdit.vue index 5d8b0829..c76aecdd 100644 --- a/src/client/theme-default/components/PageEdit.vue +++ b/src/client/theme-default/components/PageEdit.vue @@ -1,15 +1,10 @@ @@ -27,6 +22,6 @@ } .page-edit .edit-link a { color: #4e6e8e; - margin-right: 0.25rem + margin-right: 0.25rem; } diff --git a/src/client/theme-default/config.ts b/src/client/theme-default/config.ts index b8c72e70..31b2af74 100644 --- a/src/client/theme-default/config.ts +++ b/src/client/theme-default/config.ts @@ -4,7 +4,48 @@ export namespace DefaultTheme { nav?: NavItem[] | false sidebar?: SideBarConfig | MultiSideBarConfig search?: SearchConfig | false - editLink?: EditLinkConfig | false + + /** + * GitHub repository following the format /. + * + * @example vuejs/vue-next + */ + repo?: string + /** + * Customize the header label. Defaults to GitHub/Gitlab/Bitbucket depending + * on the provided repo + * + * @exampe `"Contribute!"` + */ + repoLabel?: string + + /** + * If your docs are in a different repository from your main project + * + * @example `"vuejs/docs-next"` + */ + docsRepo?: string + /** + * If your docs are not at the root of the repo. + * + * @example `"docs"` + */ + docsDir?: string + /** + * If your docs are in a different branch. Defaults to `master` + * @example `"next"` + */ + docsBranch?: string + + /** + * Enable links to edit pages at the bottom of the page + */ + editLinks?: boolean + /** + * Custom text for edit link. Defaults to "Edit this page" + */ + editLinkText?: string + lastUpdated?: string | boolean prevLink?: boolean nextLink?: boolean @@ -70,14 +111,4 @@ export namespace DefaultTheme { indexName: string } } - - // edit link ----------------------------------------------------------------- - - export interface EditLinkConfig { - repo: string - docsRepo?: string - dir?: string - branch?: string - text?: string - } }