Mirrors/tachiyomi-website
2
0
Fork 0
mirror of https://github.com/tachiyomiorg/website.git synced 2024-12-20 23:22:00 +01:00
Code Issues Packages Projects Releases Wiki Activity

Update the navbar app version on build (#25)

Browse Source 
* Update the NavBar app version on build (closes #9).

* Add replacement for `VPNavScreenMenu` as well.
This commit is contained in:
Alessandro Jean 2023-09-08 13:11:21 -03:00 committed by GitHub
parent b763f9323f
commit 6df2b8ee5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 138 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
website/src/.vitepress/config.ts
View File

@ -1,3 +1,4 @@
import { URL, fileURLToPath } from "node:url";
import { defineConfig, loadEnv } from "vitepress";
import ElementPlus from "unplugin-element-plus/vite";
@ -32,6 +33,23 @@ export default defineConfig({
generateOgImages(context);
},
vite: {
resolve: {
alias: [
{
// Used to show the release version on navbar.
find: /^.*\/VPNavBarMenu\.vue$/,
replacement: fileURLToPath(
new URL("./theme/components/CustomNavBarMenu.vue", import.meta.url)
),
},
{
find: /^.*VPNavScreenMenu\.vue$/,
replacement: fileURLToPath(
new URL("./theme/components/CustomNavScreenMenu.vue", import.meta.url)
),
},
]
},
plugins: [ElementPlus({})],
ssr: {
noExternal: ["element-plus"],

6
website/src/.vitepress/config/navigation/navbar.ts
View File

@ -1,7 +1,5 @@
import type { DefaultTheme } from "vitepress";
const APP_VERSION = "0.14.6";
const nav: DefaultTheme.NavItem[] = [
{
text: "Documentation",
@ -9,7 +7,7 @@ const nav: DefaultTheme.NavItem[] = [
activeMatch: "/docs/",
},
{
text: APP_VERSION,
text: "{app_version}",
activeMatch: "^/*?(download|changelogs)/*?$",
items: [
{
@ -18,7 +16,7 @@ const nav: DefaultTheme.NavItem[] = [
},
{
text: "Changelog",
link: `/changelogs/#v${APP_VERSION}`,
link: "/changelogs/#v{app_version}",
},
{
text: "Contributing",

62
website/src/.vitepress/theme/components/CustomNavBarMenu.vue Normal file
View File

@ -0,0 +1,62 @@
<script setup lang="ts">
import { computed } from "vue";
import { type DefaultTheme, useData } from "vitepress";
import { data as release } from "../data/release.data";
import VPNavBarMenuLink from "vitepress/dist/client/theme-default/components/VPNavBarMenuLink.vue";
import VPNavBarMenuGroup from "vitepress/dist/client/theme-default/components/VPNavBarMenuGroup.vue";
const { theme } = useData<DefaultTheme.Config>();
/**
* Workaround to use the release data directly while the sidebar
* and navbar doesn't support using the VitePress data loading.
*/
const nav = computed(() => {
return theme.value.nav?.map((item) => {
if (item.text !== "{app_version}") {
return item
}
const appVersion = release.stable.tag_name.substring(1);
return <DefaultTheme.NavItemWithChildren> {
...item,
text: item.text === "{app_version}" ? appVersion : item.text,
items: (item as DefaultTheme.NavItemWithChildren).items.map((child) => {
if (!("link" in child)) {
return child;
}
return <DefaultTheme.NavItemWithLink> {
...child,
link: child.link.replace("{app_version}", appVersion),
}
}),
}
});
})
</script>
<template>
<nav v-if="nav" aria-labelledby="main-nav-aria-label" class="VPNavBarMenu">
<span id="main-nav-aria-label" class="visually-hidden">Main Navigation</span>
<template v-for="item in nav" :key="item.text">
<VPNavBarMenuLink v-if="'link' in item" :item="item" />
<VPNavBarMenuGroup v-else :item="item" />
</template>
</nav>
</template>
<style lang="stylus" scoped>
.VPNavBarMenu {
display: none
}
@media (min-width: 768px) {
.VPNavBarMenu {
display: flex
}
}
</style>

56
website/src/.vitepress/theme/components/CustomNavScreenMenu.vue Normal file
View File

@ -0,0 +1,56 @@
<script setup lang="ts">
import { computed } from "vue";
import { type DefaultTheme, useData } from "vitepress";
import { data as release } from "../data/release.data";
import VPNavScreenMenuLink from "vitepress/dist/client/theme-default/components/VPNavScreenMenuLink.vue";
import VPNavScreenMenuGroup from "vitepress/dist/client/theme-default/components/VPNavScreenMenuGroup.vue";
const { theme } = useData<DefaultTheme.Config>();
/**
* Workaround to use the release data directly while the sidebar
* and navbar doesn't support using the VitePress data loading.
*/
const nav = computed(() => {
return theme.value.nav?.map((item) => {
if (item.text !== "{app_version}") {
return item
}
const appVersion = release.stable.tag_name.substring(1);
return <DefaultTheme.NavItemWithChildren> {
...item,
text: item.text === "{app_version}" ? appVersion : item.text,
items: (item as DefaultTheme.NavItemWithChildren).items.map((child) => {
if (!("link" in child)) {
return child;
}
return <DefaultTheme.NavItemWithLink> {
...child,
link: child.link.replace("{app_version}", appVersion),
}
}),
}
});
})
</script>
<template>
<nav v-if="nav" class="VPNavScreenMenu">
<template v-for="item in nav" :key="item.text">
<VPNavScreenMenuLink
v-if="'link' in item"
:item="item"
/>
<VPNavScreenMenuGroup
v-else
:text="item.text || ''"
:items="item.items"
/>
</template>
</nav>
</template>