feat(theme-docs): allow customising default branch

docs/content/en/themes-docs.md

@@ -210,6 +210,9 @@ You can create a `content/settings.json` file to configure the theme:
 - `github`
   - Type: `String`
   - *The GitHub repository of your project `${org}/${name}` to display the last version, the releases page, the link at the top and the `Edit this page on GitHub link` on each page*
+- `defaultBranch`
+  - Type: `String`
+  - *The default branch for the GitHub repository of your project, used in the `Edit this page on GitHub link` on each page (defaults to `main` if it cannot be detected).*
 - `twitter`
   - Type: `String`
   - *The Twitter username you want to link*
@@ -391,4 +394,4 @@ You can apply `dark-img` and `light-img` classes to your images when you have tw
 ```md
 <img src="/img-light.svg" class="light-img" alt="Image light" />
 <img src="/img-dark.svg" class="dark-img" alt="Image dark" />
-```
+```

packages/theme-docs/src/components/global/app/AppGithubLink.vue

@@ -32,7 +32,7 @@ export default {
         return
       }
 
-      return `https://github.com/${this.settings.github}/edit/dev/docs/content${this.document.path}${this.document.extension}`
+      return `https://github.com/${this.settings.github}/edit/${this.settings.defaultBranch}/docs/content${this.document.path}${this.document.extension}`
     }
   }
 }

packages/theme-docs/src/plugins/init.js

@@ -3,6 +3,7 @@ export default async function ({ store, app }) {
     await store.dispatch('fetchSettings')
     await store.dispatch('fetchCategories')
     await store.dispatch('fetchReleases')
+    await store.dispatch('fetchDefaultBranch')
   }
   // Spa Fallback
   if (process.client && !store.state.settings) {
@@ -14,12 +15,16 @@ export default async function ({ store, app }) {
   if (process.client && !store.state.releases.length) {
     await store.dispatch('fetchReleases')
   }
+  if (process.client && !store.state.settings.defaultBranch) {
+    await store.dispatch('fetchDefaultBranch')
+  }
   // Hot reload on development
   if (process.client && process.dev) {
     window.onNuxtReady(() => {
       window.$nuxt.$on('content:update', async () => {
         await store.dispatch('fetchSettings')
         await store.dispatch('fetchReleases')
+        await store.dispatch('fetchDefaultBranch')
         await store.dispatch('fetchCategories')
       })
     })

packages/theme-docs/src/store/index.js

@@ -5,7 +5,8 @@ export const state = () => ({
   categories: {},
   releases: [],
   settings: {
-    title: 'Nuxt Content Docs'
+    title: 'Nuxt Content Docs',
+    defaultBranch: ''
   }
 })
 
@@ -29,6 +30,9 @@ export const mutations = {
   SET_RELEASES (state, releases) {
     state.releases = releases
   },
+  SET_DEFAULT_BRANCH (state, branch) {
+    state.settings.defaultBranch = branch
+  },
   SET_SETTINGS (state, settings) {
     state.settings = Object.assign({}, settings)
   }
@@ -86,6 +90,28 @@ export const actions = {
 
     commit('SET_RELEASES', releases)
   },
+  async fetchDefaultBranch ({ commit, state }) {
+    if (!state.settings.github || state.settings.defaultBranch) {
+      return
+    }
+
+    const options = {}
+    if (process.env.GITHUB_TOKEN) {
+      options.headers = { Authorization: `token ${process.env.GITHUB_TOKEN}` }
+    }
+    let defaultBranch
+    try {
+      const data = await fetch(`https://api.github.com/repos/${state.settings.github}`, options).then((res) => {
+        if (!res.ok) {
+          throw new Error(res.statusText)
+        }
+        return res
+      }).then(res => res.json())
+      defaultBranch = data.default_branch
+    } catch (e) {}
+
+    commit('SET_DEFAULT_BRANCH', defaultBranch || 'main')
+  },
   async fetchSettings ({ commit }) {
     try {
       const settings = await this.$content('settings').fetch()