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

Fix remaining eslint errors

Browse Source
This commit is contained in:
arkon 2023-11-11 10:22:07 -05:00
parent e0da86ca0c
commit bbac199151
46 changed files with 2243 additions and 2252 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
website/.editorconfig
View File

@ -2,12 +2,8 @@ root = true
[*] [*]
end_of_line = lf end_of_line = lf
indent_style = tab indent_style = space
indent_size = 4 indent_size = 2
charset = utf-8 charset = utf-8
trim_trailing_whitespace = true trim_trailing_whitespace = true
insert_final_newline = true insert_final_newline = true
[*.yml]
indent_style = space
indent_size = 2

2
website/.stylelintrc.cjs
View File

@ -9,7 +9,7 @@ module.exports = {
'stylus/selector-type-no-unknown': null, 'stylus/selector-type-no-unknown': null,
'stylus/selector-list-comma': 'always', 'stylus/selector-list-comma': 'always',
'stylus/indentation': [ 'stylus/indentation': [
'tab', 2,
{ {
indentInsideParens: 'twice', indentInsideParens: 'twice',
}, },

3
website/eslint.config.js
View File

@ -19,6 +19,9 @@ export default antfu({
'docs/.vitepress/cache/**', 'docs/.vitepress/cache/**',
], ],
typescript: true,
vue: true,
...compat.config({ ...compat.config({
rules: { rules: {
'comma-dangle': ['error', 'only-multiline'], 'comma-dangle': ['error', 'only-multiline'],

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

@ -1,30 +1,34 @@
import process from "node:process" import process from 'node:process'
import { URL, fileURLToPath } from "node:url" import { URL, fileURLToPath } from 'node:url'
import { defineConfig, loadEnv } from "vitepress" import { defineConfig, loadEnv } from 'vitepress'
import ElementPlus from "unplugin-element-plus/vite" import ElementPlus from 'unplugin-element-plus/vite'
import markdownConfig from "./config/markdownConfig" import markdownConfig from './config/markdownConfig'
// For use with loading Markdown plugins // For use with loading Markdown plugins
import themeConfig from "./config/themeConfig" import themeConfig from './config/themeConfig'
// Theme related config // Theme related config
import headConfig from "./config/headConfig" // Provides how to generate Meta head tags import headConfig from './config/headConfig'
import generateMeta from "./config/hooks/generateMeta" // Provides how to generate Meta head tags
import generateMeta from './config/hooks/generateMeta'
// Enhanced meta generation // Enhanced meta generation
import generateFeed from "./config/hooks/generateFeed" // Allows generation of RSS feed import generateFeed from './config/hooks/generateFeed'
import generateOgImages from "./config/hooks/generateOgImages"
const title = "Tachiyomi" // Allows generation of RSS feed
const description = "Discover and read manga, webtoons, comics, and more – easier than ever on your Android device." import generateOgImages from './config/hooks/generateOgImages'
const env = loadEnv("", process.cwd()) const title = 'Tachiyomi'
const hostname: string = env.VITE_HOSTNAME || "http://localhost:4173" const description = 'Discover and read manga, webtoons, comics, and more – easier than ever on your Android device.'
const env = loadEnv('', process.cwd())
const hostname: string = env.VITE_HOSTNAME || 'http://localhost:4173'
export default defineConfig({ export default defineConfig({
outDir: "../dist", outDir: '../dist',
lastUpdated: true, lastUpdated: true,
cleanUrls: true, cleanUrls: true,
title, title,
@ -35,7 +39,7 @@ export default defineConfig({
head: headConfig, head: headConfig,
markdown: markdownConfig, markdown: markdownConfig,
themeConfig, themeConfig,
transformHead: async (context) => generateMeta(context, hostname), transformHead: async context => generateMeta(context, hostname),
buildEnd: async (context) => { buildEnd: async (context) => {
generateFeed(context, hostname) generateFeed(context, hostname)
generateOgImages(context) generateOgImages(context)
@ -47,26 +51,26 @@ export default defineConfig({
// Used to show the release version on navbar. // Used to show the release version on navbar.
find: /^.*\/VPNavBarMenu\.vue$/, find: /^.*\/VPNavBarMenu\.vue$/,
replacement: fileURLToPath( replacement: fileURLToPath(
new URL("./theme/components/CustomNavBarMenu.vue", import.meta.url), new URL('./theme/components/CustomNavBarMenu.vue', import.meta.url),
), ),
}, },
{ {
find: /^.*VPNavScreenMenu\.vue$/, find: /^.*VPNavScreenMenu\.vue$/,
replacement: fileURLToPath( replacement: fileURLToPath(
new URL("./theme/components/CustomNavScreenMenu.vue", import.meta.url), new URL('./theme/components/CustomNavScreenMenu.vue', import.meta.url),
), ),
}, },
{ {
find: /^.*VPSwitchAppearance\.vue$/, find: /^.*VPSwitchAppearance\.vue$/,
replacement: fileURLToPath( replacement: fileURLToPath(
new URL("./theme/components/CustomSwitchAppearance.vue", import.meta.url), new URL('./theme/components/CustomSwitchAppearance.vue', import.meta.url),
), ),
}, },
], ],
}, },
plugins: [ElementPlus({})], plugins: [ElementPlus({})],
ssr: { ssr: {
noExternal: ["element-plus"], noExternal: ['element-plus'],
}, },
}, },
}) })

10
website/src/.vitepress/config/constants.ts
View File

@ -1,6 +1,6 @@
export const GITHUB_EXTENSION_JSON export const GITHUB_EXTENSION_JSON
= "https://raw.githubusercontent.com/tachiyomiorg/tachiyomi-extensions/repo/index.json" = 'https://raw.githubusercontent.com/tachiyomiorg/tachiyomi-extensions/repo/index.json'
export const GITHUB_STABLE_API = "https://api.github.com/repos/tachiyomiorg/tachiyomi/releases/latest" export const GITHUB_STABLE_API = 'https://api.github.com/repos/tachiyomiorg/tachiyomi/releases/latest'
export const GITHUB_STABLE_RELEASE = "https://github.com/tachiyomiorg/tachiyomi/releases/latest" export const GITHUB_STABLE_RELEASE = 'https://github.com/tachiyomiorg/tachiyomi/releases/latest'
export const GITHUB_PREVIEW_API = "https://api.github.com/repos/tachiyomiorg/android-app-preview/releases/latest" export const GITHUB_PREVIEW_API = 'https://api.github.com/repos/tachiyomiorg/android-app-preview/releases/latest'
export const GITHUB_PREVIEW_RELEASE = "https://github.com/tachiyomiorg/android-app-preview/releases/latest" export const GITHUB_PREVIEW_RELEASE = 'https://github.com/tachiyomiorg/android-app-preview/releases/latest'

66
website/src/.vitepress/config/headConfig.ts
View File

@ -1,59 +1,59 @@
import type { HeadConfig } from "vitepress" import type { HeadConfig } from 'vitepress'
const headConfig: HeadConfig[] = [ const headConfig: HeadConfig[] = [
["meta", { name: "darkreader-lock" }], ['meta', { name: 'darkreader-lock' }],
["meta", { name: "theme-color", content: "#818CF8" }], ['meta', { name: 'theme-color', content: '#818CF8' }],
["meta", { name: "msapplication-TileColor", content: "#818CF8" }], ['meta', { name: 'msapplication-TileColor', content: '#818CF8' }],
["meta", { name: "viewport", content: "width=device-width, initial-scale=1.0" }], ['meta', { name: 'viewport', content: 'width=device-width, initial-scale=1.0' }],
["meta", { name: "referrer", content: "no-referrer-when-downgrade" }], ['meta', { name: 'referrer', content: 'no-referrer-when-downgrade' }],
["link", { rel: "icon", type: "image/x-icon", href: "/favicon.ico" }], ['link', { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
[ [
"link", 'link',
{ {
rel: "icon", rel: 'icon',
type: "image/png", type: 'image/png',
sizes: "32x32", sizes: '32x32',
href: "/favicon-32x32.png", href: '/favicon-32x32.png',
}, },
], ],
[ [
"link", 'link',
{ {
rel: "icon", rel: 'icon',
type: "image/png", type: 'image/png',
sizes: "16x16", sizes: '16x16',
href: "/favicon-16x16.png", href: '/favicon-16x16.png',
}, },
], ],
["link", { rel: "manifest", href: "/site.webmanifest" }], ['link', { rel: 'manifest', href: '/site.webmanifest' }],
["link", { rel: "mask-icon", href: "/safari-pinned-tab.svg", color: "#818CF8" }], ['link', { rel: 'mask-icon', href: '/safari-pinned-tab.svg', color: '#818CF8' }],
[ [
"link", 'link',
{ {
rel: "apple-touch-icon", rel: 'apple-touch-icon',
type: "image/x-icon", type: 'image/x-icon',
sizes: "180x180", sizes: '180x180',
href: "/favicon.ico", href: '/favicon.ico',
}, },
], ],
["meta", { name: "twitter:card", content: "summary" }], ['meta', { name: 'twitter:card', content: 'summary' }],
["meta", { name: "twitter:site", content: "@tachiyomiorg" }], ['meta', { name: 'twitter:site', content: '@tachiyomiorg' }],
["meta", { name: "twitter:creator", content: "@tachiyomiorg" }], ['meta', { name: 'twitter:creator', content: '@tachiyomiorg' }],
["meta", { property: "og:site_name", content: "Tachiyomi" }], ['meta', { property: 'og:site_name', content: 'Tachiyomi' }],
[ [
"meta", 'meta',
{ {
property: "og:description", property: 'og:description',
content: "Discover and read manga, webtoons, comics, and more – easier than ever on your Android device.", content: 'Discover and read manga, webtoons, comics, and more – easier than ever on your Android device.',
}, },
], ],
["meta", { property: "og:locale", content: "en_US" }], ['meta', { property: 'og:locale', content: 'en_US' }],
["meta", { property: "og:type", content: "website" }], ['meta', { property: 'og:type', content: 'website' }],
] ]
export default headConfig export default headConfig

28
website/src/.vitepress/config/hooks/generateFeed.ts
View File

@ -1,7 +1,7 @@
import path from "node:path" import path from 'node:path'
import { writeFileSync } from "node:fs" import { writeFileSync } from 'node:fs'
import { Feed, type Item } from "feed" import { Feed, type Item } from 'feed'
import { type SiteConfig, createContentLoader } from "vitepress" import { type SiteConfig, createContentLoader } from 'vitepress'
async function generateFeed(config: SiteConfig, hostname: string) { async function generateFeed(config: SiteConfig, hostname: string) {
const feed = new Feed({ const feed = new Feed({
@ -9,21 +9,21 @@ async function generateFeed(config: SiteConfig, hostname: string) {
description: config.site.description, description: config.site.description,
id: hostname, id: hostname,
link: hostname, link: hostname,
language: "en", language: 'en',
image: `${hostname}/img/logo.png`, image: `${hostname}/img/logo.png`,
favicon: `${hostname}/favicon.ico`, favicon: `${hostname}/favicon.ico`,
copyright: `Copyright © 2015 - ${new Date().getFullYear()} Javier Tomás`, copyright: `Copyright © 2015 - ${new Date().getFullYear()} Javier Tomás`,
}) })
const json: Item[] = [] const json: Item[] = []
const posts = await createContentLoader("news/*.md", { const posts = await createContentLoader('news/*.md', {
excerpt: true, excerpt: true,
render: true, render: true,
includeSrc: true, includeSrc: true,
}).load() }).load()
// Filter everything that"s not of type `article` (e.g. index.md) // Filter everything that"s not of type `article` (e.g. index.md)
const filteredPosts = posts.filter((post) => post.frontmatter.type === "article") const filteredPosts = posts.filter(post => post.frontmatter.type === 'article')
filteredPosts.sort((a, b) => +new Date(b.frontmatter.date as string) - +new Date(a.frontmatter.date as string)) filteredPosts.sort((a, b) => +new Date(b.frontmatter.date as string) - +new Date(a.frontmatter.date as string))
@ -31,14 +31,14 @@ async function generateFeed(config: SiteConfig, hostname: string) {
const fullUrl = `${hostname}${url}` const fullUrl = `${hostname}${url}`
// Strip `​` from `html` string // Strip `​` from `html` string
const content = (html ?? "") const content = (html ?? '')
.replace(/​/g, "") .replace(/​/g, '')
.replace(/<a href="(\/.*?)">/g, `<a href="${hostname}$1">`) .replace(/<a href="(\/.*?)">/g, `<a href="${hostname}$1">`)
const markdown = (src ?? "") const markdown = (src ?? '')
.replace(/^---.*---/s, "") .replace(/^---.*---/s, '')
.replace(/]\((\/.*?)\)/g, `](${hostname}$1)`) .replace(/]\((\/.*?)\)/g, `](${hostname}$1)`)
.replace(/^# .*$/m, "") .replace(/^# .*$/m, '')
.trim() .trim()
const post = { const post = {
@ -54,8 +54,8 @@ async function generateFeed(config: SiteConfig, hostname: string) {
json.push({ ...post, content: markdown }) json.push({ ...post, content: markdown })
} }
writeFileSync(path.join(config.outDir, "feed.rss"), feed.rss2()) writeFileSync(path.join(config.outDir, 'feed.rss'), feed.rss2())
writeFileSync(path.join(config.outDir, "news.json"), JSON.stringify(json)) writeFileSync(path.join(config.outDir, 'news.json'), JSON.stringify(json))
} }
export default generateFeed export default generateFeed

118
website/src/.vitepress/config/hooks/generateMeta.ts
View File

@ -1,125 +1,127 @@
import type { HeadConfig, TransformContext } from "vitepress" import type { HeadConfig, TransformContext } from 'vitepress'
function generateMeta(context: TransformContext, hostname: string) { function generateMeta(context: TransformContext, hostname: string) {
const head: HeadConfig[] = [] const head: HeadConfig[] = []
const { pageData } = context const { pageData } = context
const url = `${hostname}/${pageData.relativePath.replace(/((^|\/)index)?\.md$/, "$2")}` const url = `${hostname}/${pageData.relativePath.replace(/((^|\/)index)?\.md$/, '$2')}`
head.push(["link", { rel: "canonical", href: url }]) head.push(['link', { rel: 'canonical', href: url }])
head.push(["meta", { property: "og:url", content: url }]) head.push(['meta', { property: 'og:url', content: url }])
head.push(["meta", { name: "twitter:url", content: url }]) head.push(['meta', { name: 'twitter:url', content: url }])
head.push(["meta", { name: "twitter:card", content: "summary_large_image" }]) head.push(['meta', { name: 'twitter:card', content: 'summary_large_image' }])
if (pageData.frontmatter.theme)
head.push(['meta', { name: 'theme-color', content: pageData.frontmatter.theme }])
if (pageData.frontmatter.type)
head.push(['meta', { property: 'og:type', content: pageData.frontmatter.type }])
if (pageData.frontmatter.theme) {
head.push(["meta", { name: "theme-color", content: pageData.frontmatter.theme }])
}
if (pageData.frontmatter.type) {
head.push(["meta", { property: "og:type", content: pageData.frontmatter.type }])
}
if (pageData.frontmatter.customMetaTitle) { if (pageData.frontmatter.customMetaTitle) {
head.push([ head.push([
"meta", 'meta',
{ {
property: "og:title", property: 'og:title',
content: pageData.frontmatter.customMetaTitle, content: pageData.frontmatter.customMetaTitle,
}, },
]) ])
head.push([ head.push([
"meta", 'meta',
{ {
name: "twitter:title", name: 'twitter:title',
content: pageData.frontmatter.customMetaTitle, content: pageData.frontmatter.customMetaTitle,
}, },
]) ])
head.push(["meta", { property: "og:site_name", content: "" }]) head.push(['meta', { property: 'og:site_name', content: '' }])
} else { }
head.push(["meta", { property: "og:title", content: pageData.frontmatter.title }]) else {
head.push(["meta", { name: "twitter:title", content: pageData.frontmatter.title }]) head.push(['meta', { property: 'og:title', content: pageData.frontmatter.title }])
head.push(['meta', { name: 'twitter:title', content: pageData.frontmatter.title }])
} }
if (pageData.frontmatter.description) { if (pageData.frontmatter.description) {
head.push([ head.push([
"meta", 'meta',
{ {
property: "og:description", property: 'og:description',
content: pageData.frontmatter.description, content: pageData.frontmatter.description,
}, },
]) ])
head.push([ head.push([
"meta", 'meta',
{ {
name: "twitter:description", name: 'twitter:description',
content: pageData.frontmatter.description, content: pageData.frontmatter.description,
}, },
]) ])
} }
if (pageData.frontmatter.image) { if (pageData.frontmatter.image) {
head.push([ head.push([
"meta", 'meta',
{ {
property: "og:image", property: 'og:image',
content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, "")}`, content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, '')}`,
}, },
]) ])
head.push([ head.push([
"meta", 'meta',
{ {
name: "twitter:image", name: 'twitter:image',
content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, "")}`, content: `${hostname}/${pageData.frontmatter.image.replace(/^\//, '')}`,
}, },
]) ])
} else { }
const url = pageData.filePath.replace("index.md", "").replace(".md", "") else {
const imageUrl = `${url}/__og_image__/og.png`.replace(/\/\//g, "/").replace(/^\//, "") const url = pageData.filePath.replace('index.md', '').replace('.md', '')
const imageUrl = `${url}/__og_image__/og.png`.replace(/\/\//g, '/').replace(/^\//, '')
head.push(["meta", { property: "og:image", content: `${hostname}/${imageUrl}` }]) head.push(['meta', { property: 'og:image', content: `${hostname}/${imageUrl}` }])
head.push(["meta", { property: "og:image:width", content: "1200" }]) head.push(['meta', { property: 'og:image:width', content: '1200' }])
head.push(["meta", { property: "og:image:height", content: "628" }]) head.push(['meta', { property: 'og:image:height', content: '628' }])
head.push(["meta", { property: "og:image:type", content: "image/png" }]) head.push(['meta', { property: 'og:image:type', content: 'image/png' }])
head.push(["meta", { property: "og:image:alt", content: pageData.frontmatter.title }]) head.push(['meta', { property: 'og:image:alt', content: pageData.frontmatter.title }])
head.push(["meta", { name: "twitter:image", content: `${hostname}/${imageUrl}` }]) head.push(['meta', { name: 'twitter:image', content: `${hostname}/${imageUrl}` }])
head.push(["meta", { name: "twitter:image:width", content: "1200" }]) head.push(['meta', { name: 'twitter:image:width', content: '1200' }])
head.push(["meta", { name: "twitter:image:height", content: "628" }]) head.push(['meta', { name: 'twitter:image:height', content: '628' }])
head.push(["meta", { name: "twitter:image:alt", content: pageData.frontmatter.title }]) head.push(['meta', { name: 'twitter:image:alt', content: pageData.frontmatter.title }])
}
if (pageData.frontmatter.tag) {
head.push(["meta", { property: "article:tag", content: pageData.frontmatter.tag }])
} }
if (pageData.frontmatter.tag)
head.push(['meta', { property: 'article:tag', content: pageData.frontmatter.tag }])
if (pageData.frontmatter.date) { if (pageData.frontmatter.date) {
head.push([ head.push([
"meta", 'meta',
{ {
property: "article:published_time", property: 'article:published_time',
content: pageData.frontmatter.date, content: pageData.frontmatter.date,
}, },
]) ])
} }
if (pageData.lastUpdated && pageData.frontmatter.lastUpdated !== false) { if (pageData.lastUpdated && pageData.frontmatter.lastUpdated !== false) {
head.push([ head.push([
"meta", 'meta',
{ {
property: "article:modified_time", property: 'article:modified_time',
content: new Date(pageData.lastUpdated).toISOString(), content: new Date(pageData.lastUpdated).toISOString(),
}, },
]) ])
} }
if (pageData.filePath === "news/index.md") { if (pageData.filePath === 'news/index.md') {
head.push([ head.push([
"link", 'link',
{ {
rel: "alternate", rel: 'alternate',
type: "application/rss+xml", type: 'application/rss+xml',
title: "RSS feed for the news archive", title: 'RSS feed for the news archive',
href: `${hostname}/feed.rss`, href: `${hostname}/feed.rss`,
}, },
]) ])
head.push([ head.push([
"link", 'link',
{ {
rel: "alternate", rel: 'alternate',
type: "application/json", type: 'application/json',
title: "JSON of the news archive", title: 'JSON of the news archive',
href: `${hostname}/news.json`, href: `${hostname}/news.json`,
}, },
]) ])

73
website/src/.vitepress/config/hooks/generateOgImages.ts
View File

@ -1,46 +1,46 @@
import { mkdir, readFile, writeFile } from "node:fs/promises" import { mkdir, readFile, writeFile } from 'node:fs/promises'
import { dirname, resolve } from "node:path" import { dirname, resolve } from 'node:path'
import { fileURLToPath } from "node:url" import { fileURLToPath } from 'node:url'
import { createContentLoader } from "vitepress" import { createContentLoader } from 'vitepress'
import type { ContentData, SiteConfig } from "vitepress" import type { ContentData, SiteConfig } from 'vitepress'
import { type SatoriOptions, satoriVue } from "x-satori/vue" import { type SatoriOptions, satoriVue } from 'x-satori/vue'
import { renderAsync } from "@resvg/resvg-js" import { renderAsync } from '@resvg/resvg-js'
const __dirname = dirname(fileURLToPath(import.meta.url)) const __dirname = dirname(fileURLToPath(import.meta.url))
const __fonts = resolve(__dirname, "../../fonts") const __fonts = resolve(__dirname, '../../fonts')
async function generateOgImages(config: SiteConfig) { async function generateOgImages(config: SiteConfig) {
const pages = await createContentLoader("**/*.md", { excerpt: true }).load() const pages = await createContentLoader('**/*.md', { excerpt: true }).load()
const template = await readFile(resolve(__dirname, "../../theme/components/OgImageTemplate.vue"), "utf-8") const template = await readFile(resolve(__dirname, '../../theme/components/OgImageTemplate.vue'), 'utf-8')
const fonts: SatoriOptions["fonts"] = [ const fonts: SatoriOptions['fonts'] = [
{ {
name: "Inter", name: 'Inter',
data: await readFile(resolve(__fonts, "Inter-Regular.otf")), data: await readFile(resolve(__fonts, 'Inter-Regular.otf')),
weight: 400, weight: 400,
style: "normal", style: 'normal',
}, },
{ {
name: "Inter", name: 'Inter',
data: await readFile(resolve(__fonts, "Inter-Medium.otf")), data: await readFile(resolve(__fonts, 'Inter-Medium.otf')),
weight: 500, weight: 500,
style: "normal", style: 'normal',
}, },
{ {
name: "Inter", name: 'Inter',
data: await readFile(resolve(__fonts, "Inter-SemiBold.otf")), data: await readFile(resolve(__fonts, 'Inter-SemiBold.otf')),
weight: 600, weight: 600,
style: "normal", style: 'normal',
}, },
{ {
name: "Inter", name: 'Inter',
data: await readFile(resolve(__fonts, "Inter-Bold.otf")), data: await readFile(resolve(__fonts, 'Inter-Bold.otf')),
weight: 700, weight: 700,
style: "normal", style: 'normal',
}, },
] ]
const filteredPages = pages.filter((p) => p.frontmatter.image === undefined) const filteredPages = pages.filter(p => p.frontmatter.image === undefined)
for (const page of filteredPages) { for (const page of filteredPages) {
await generateImage({ await generateImage({
@ -58,17 +58,16 @@ interface GenerateImagesOptions {
page: ContentData page: ContentData
template: string template: string
outDir: string outDir: string
fonts: SatoriOptions["fonts"] fonts: SatoriOptions['fonts']
} }
function getDir(url: string) { function getDir(url: string) {
if (url.startsWith("/docs/faq/")) { if (url.startsWith('/docs/faq/'))
return "FAQ" return 'FAQ'
} else if (url.startsWith("/docs/guides/")) { else if (url.startsWith('/docs/guides/'))
return "Guide" return 'Guide'
} else if (url.startsWith("/news/") && url !== "/news/") { else if (url.startsWith('/news/') && url !== '/news/')
return "News" return 'News'
}
return undefined return undefined
} }
@ -82,11 +81,11 @@ async function generateImage({ page, template, outDir, fonts }: GenerateImagesOp
fonts, fonts,
props: { props: {
title: title:
frontmatter.layout === "home" frontmatter.layout === 'home'
? frontmatter.hero.name ?? frontmatter.title ? frontmatter.hero.name ?? frontmatter.title
: frontmatter.customMetaTitle ?? frontmatter.title, : frontmatter.customMetaTitle ?? frontmatter.title,
description: description:
frontmatter.layout === "home" frontmatter.layout === 'home'
? frontmatter.hero.tagline ?? frontmatter.description ? frontmatter.hero.tagline ?? frontmatter.description
: frontmatter.description, : frontmatter.description,
dir: getDir(url), dir: getDir(url),
@ -97,13 +96,13 @@ async function generateImage({ page, template, outDir, fonts }: GenerateImagesOp
const render = await renderAsync(svg, { const render = await renderAsync(svg, {
fitTo: { fitTo: {
mode: "width", mode: 'width',
value: 1200, value: 1200,
}, },
}) })
const outputFolder = resolve(outDir, url.substring(1), "__og_image__") const outputFolder = resolve(outDir, url.substring(1), '__og_image__')
const outputFile = resolve(outputFolder, "og.png") const outputFile = resolve(outputFolder, 'og.png')
await mkdir(outputFolder, { recursive: true }) await mkdir(outputFolder, { recursive: true })

22
website/src/.vitepress/config/markdownConfig.ts
View File

@ -1,14 +1,14 @@
import type { MarkdownOptions } from "vitepress" import type { MarkdownOptions } from 'vitepress'
import { attrs } from "@mdit/plugin-attrs" import { attrs } from '@mdit/plugin-attrs'
import { figure } from "@mdit/plugin-figure" import { figure } from '@mdit/plugin-figure'
import { imgLazyload } from "@mdit/plugin-img-lazyload" import { imgLazyload } from '@mdit/plugin-img-lazyload'
import { imgMark } from "@mdit/plugin-img-mark" import { imgMark } from '@mdit/plugin-img-mark'
import { imgSize } from "@mdit/plugin-img-size" import { imgSize } from '@mdit/plugin-img-size'
import { include } from "@mdit/plugin-include" import { include } from '@mdit/plugin-include'
import { tabsMarkdownPlugin } from "vitepress-plugin-tabs" import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'
import shortcode_plugin from "markdown-it-shortcode-tag" import shortcode_plugin from 'markdown-it-shortcode-tag'
import shortcodes from "./shortcodes" import shortcodes from './shortcodes'
const markdownConfig: MarkdownOptions = { const markdownConfig: MarkdownOptions = {
config: (md) => { config: (md) => {
@ -19,7 +19,7 @@ const markdownConfig: MarkdownOptions = {
.use(imgMark) .use(imgMark)
.use(imgSize) .use(imgSize)
.use(include, { .use(include, {
currentPath: (env) => env.filePath, currentPath: env => env.filePath,
}) })
.use(tabsMarkdownPlugin) .use(tabsMarkdownPlugin)
.use(shortcode_plugin, shortcodes) .use(shortcode_plugin, shortcodes)

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

@ -1,29 +1,29 @@
import type { DefaultTheme } from "vitepress" import type { DefaultTheme } from 'vitepress'
const nav: DefaultTheme.NavItem[] = [ const nav: DefaultTheme.NavItem[] = [
{ {
text: "Get v{app_version}", text: 'Get v{app_version}',
activeMatch: "^/*?(download|changelogs)/*?$", activeMatch: '^/*?(download|changelogs)/*?$',
items: [ items: [
{ {
text: "Download", text: 'Download',
link: "/download/", link: '/download/',
}, },
{ {
text: "Changelogs", text: 'Changelogs',
link: "/changelogs/", link: '/changelogs/',
}, },
], ],
}, },
{ {
text: "Docs", text: 'Docs',
link: "/docs/guides/getting-started", link: '/docs/guides/getting-started',
activeMatch: "/docs/", activeMatch: '/docs/',
}, },
{ {
text: "News", text: 'News',
link: "/news/", link: '/news/',
activeMatch: "/news/", activeMatch: '/news/',
}, },
] ]

114
website/src/.vitepress/config/navigation/sidebar.ts
View File

@ -1,13 +1,13 @@
import type { DefaultTheme } from "vitepress" import type { DefaultTheme } from 'vitepress'
const sidebar: DefaultTheme.SidebarMulti = { const sidebar: DefaultTheme.SidebarMulti = {
"/download/": defaultSidebar(), '/download/': defaultSidebar(),
"/extensions/": defaultSidebar(), '/extensions/': defaultSidebar(),
"/docs/": defaultSidebar(), '/docs/': defaultSidebar(),
"/forks/": defaultSidebar(), '/forks/': defaultSidebar(),
"/changelogs/": defaultSidebar(), '/changelogs/': defaultSidebar(),
"/news/": defaultSidebar(), '/news/': defaultSidebar(),
"/sandbox/": defaultSidebar(), '/sandbox/': defaultSidebar(),
} }
function defaultSidebar(): DefaultTheme.SidebarItem[] { function defaultSidebar(): DefaultTheme.SidebarItem[] {
@ -15,112 +15,112 @@ function defaultSidebar(): DefaultTheme.SidebarItem[] {
{ {
items: [ items: [
{ {
text: "Download", text: 'Download',
link: "/download/", link: '/download/',
}, },
{ {
text: "Extensions", text: 'Extensions',
link: "/extensions/", link: '/extensions/',
}, },
{ {
text: "Changelogs", text: 'Changelogs',
link: "/changelogs/", link: '/changelogs/',
}, },
{ {
text: "Forks", text: 'Forks',
link: "/forks/", link: '/forks/',
}, },
{ {
text: "Contribute", text: 'Contribute',
link: "/docs/contribute", link: '/docs/contribute',
}, },
], ],
}, },
{ {
text: "Frequently Asked Questions", text: 'Frequently Asked Questions',
items: [ items: [
{ text: "General", link: "/docs/faq/general" }, { text: 'General', link: '/docs/faq/general' },
{ {
text: "Library", text: 'Library',
link: "/docs/faq/library", link: '/docs/faq/library',
}, },
{ {
text: "Browse", text: 'Browse',
link: "/docs/faq/browse/", link: '/docs/faq/browse/',
collapsed: true, collapsed: true,
items: [ items: [
{ text: "Extensions", link: "/docs/faq/browse/extensions" }, { text: 'Extensions', link: '/docs/faq/browse/extensions' },
{ {
text: "Local source", text: 'Local source',
link: "/docs/faq/browse/local-source", link: '/docs/faq/browse/local-source',
}, },
], ],
}, },
{ {
text: "Downloads", text: 'Downloads',
link: "/docs/faq/downloads", link: '/docs/faq/downloads',
}, },
{ {
text: "Reader", text: 'Reader',
link: "/docs/faq/reader", link: '/docs/faq/reader',
}, },
{ {
text: "Settings", text: 'Settings',
link: "/docs/faq/settings", link: '/docs/faq/settings',
}, },
{ {
text: "Android 11+", text: 'Android 11+',
link: "/docs/faq/android-11+", link: '/docs/faq/android-11+',
}, },
], ],
}, },
{ {
text: "Guides", text: 'Guides',
items: [ items: [
{ {
text: "Getting started", text: 'Getting started',
link: "/docs/guides/getting-started", link: '/docs/guides/getting-started',
}, },
{ {
text: "Troubleshooting", text: 'Troubleshooting',
link: "/docs/guides/troubleshooting/", link: '/docs/guides/troubleshooting/',
collapsed: true, collapsed: true,
items: [ items: [
{ {
text: "Common issues", text: 'Common issues',
link: "/docs/guides/troubleshooting/common-issues", link: '/docs/guides/troubleshooting/common-issues',
}, },
{ {
text: "Diagnosis", text: 'Diagnosis',
link: "/docs/guides/troubleshooting/diagnosis", link: '/docs/guides/troubleshooting/diagnosis',
}, },
], ],
}, },
{ {
text: "Source migration", text: 'Source migration',
link: "/docs/guides/source-migration", link: '/docs/guides/source-migration',
}, },
{ text: "Backups", link: "/docs/guides/backups" }, { text: 'Backups', link: '/docs/guides/backups' },
{ text: "Tracking", link: "/docs/guides/tracking" }, { text: 'Tracking', link: '/docs/guides/tracking' },
{ text: "Categories", link: "/docs/guides/categories" }, { text: 'Categories', link: '/docs/guides/categories' },
{ {
text: "Local source", text: 'Local source',
link: "/docs/guides/local-source/", link: '/docs/guides/local-source/',
collapsed: true, collapsed: true,
items: [ items: [
{ {
text: "Advanced editing", text: 'Advanced editing',
link: "/docs/guides/local-source/advanced", link: '/docs/guides/local-source/advanced',
}, },
], ],
}, },
{ {
text: "Reader settings", text: 'Reader settings',
link: "/docs/guides/reader-settings", link: '/docs/guides/reader-settings',
}, },
{ {
text: "Shizuku", text: 'Shizuku',
link: "/docs/guides/shizuku", link: '/docs/guides/shizuku',
}, },
], ],
}, },

21
website/src/.vitepress/config/scripts/languages.ts
View File

@ -1,19 +1,18 @@
export function simpleLangName(code: string) { export function simpleLangName(code: string) {
if (code === "all") { if (code === 'all')
return "All" return 'All'
}
const namesInEnglish = new Intl.DisplayNames(["en"], { type: "language" }) const namesInEnglish = new Intl.DisplayNames(['en'], { type: 'language' })
return capitalize(namesInEnglish.of(code)!, "en") return capitalize(namesInEnglish.of(code)!, 'en')
} }
export function langName(code: string) { export function langName(code: string) {
if (code === "all") { if (code === 'all')
return "All" return 'All'
}
const namesInEnglish = new Intl.DisplayNames(["en"], { type: "language" }) const namesInEnglish = new Intl.DisplayNames(['en'], { type: 'language' })
const namesInNative = new Intl.DisplayNames([code], { type: "language" }) const namesInNative = new Intl.DisplayNames([code], { type: 'language' })
return `${capitalize(namesInEnglish.of(code)!, "en")} - ${capitalize(namesInNative.of(code)!, code)}` return `${capitalize(namesInEnglish.of(code)!, 'en')} - ${capitalize(namesInNative.of(code)!, code)}`
} }
function capitalize(string: string, locale: string) { function capitalize(string: string, locale: string) {

60
website/src/.vitepress/config/shortcodes.ts
View File

@ -28,54 +28,52 @@ interface Navigation {
const navigationMappings: Record<string, Navigation> = { const navigationMappings: Record<string, Navigation> = {
// Main menus // Main menus
"main_library": { name: "Library", icon: iconMappings.bookmarkBoxOutline }, 'main_library': { name: 'Library', icon: iconMappings.bookmarkBoxOutline },
"main_updates": { name: "Updates", icon: iconMappings.alertDecagramOutline }, 'main_updates': { name: 'Updates', icon: iconMappings.alertDecagramOutline },
"main_history": { name: "History", icon: iconMappings.history }, 'main_history': { name: 'History', icon: iconMappings.history },
"main_browse": { name: "Browse", icon: iconMappings.compassOutline }, 'main_browse': { name: 'Browse', icon: iconMappings.compassOutline },
"main_more": { name: "More", icon: iconMappings.dotsHorizontal }, 'main_more': { name: 'More', icon: iconMappings.dotsHorizontal },
// Browse menu // Browse menu
"sources": { name: "Sources", dependsOn: "main_browse" }, 'sources': { name: 'Sources', dependsOn: 'main_browse' },
"extensions": { name: "Extensions", dependsOn: "main_browse" }, 'extensions': { name: 'Extensions', dependsOn: 'main_browse' },
"migrate": { name: "Migrate", dependsOn: "main_browse" }, 'migrate': { name: 'Migrate', dependsOn: 'main_browse' },
// More menu // More menu
"downloaded-only": { name: "Downloaded only", icon: iconMappings.cloudOffOutline, dependsOn: "main_more" }, 'downloaded-only': { name: 'Downloaded only', icon: iconMappings.cloudOffOutline, dependsOn: 'main_more' },
"incognito-mode": { name: "Incognito mode", icon: iconMappings.glasses, dependsOn: "main_more" }, 'incognito-mode': { name: 'Incognito mode', icon: iconMappings.glasses, dependsOn: 'main_more' },
"download-queue": { name: "Download queue", icon: iconMappings.downloadOutline, dependsOn: "main_more" }, 'download-queue': { name: 'Download queue', icon: iconMappings.downloadOutline, dependsOn: 'main_more' },
"categories": { name: "Categories", icon: iconMappings.labelOutline, dependsOn: "main_more" }, 'categories': { name: 'Categories', icon: iconMappings.labelOutline, dependsOn: 'main_more' },
"statistics": { name: "Statistics", icon: iconMappings.queryStats, dependsOn: "main_more" }, 'statistics': { name: 'Statistics', icon: iconMappings.queryStats, dependsOn: 'main_more' },
"backup-and-restore": { name: "Backup and restore", icon: iconMappings.backupRestore, dependsOn: "main_more" }, 'backup-and-restore': { name: 'Backup and restore', icon: iconMappings.backupRestore, dependsOn: 'main_more' },
"settings": { name: "Settings", icon: iconMappings.cog, dependsOn: "main_more" }, 'settings': { name: 'Settings', icon: iconMappings.cog, dependsOn: 'main_more' },
"about": { name: "About", icon: iconMappings.informationOutline, dependsOn: "main_more" }, 'about': { name: 'About', icon: iconMappings.informationOutline, dependsOn: 'main_more' },
"help": { name: "Help", icon: iconMappings.helpCircleOutline, dependsOn: "main_more" }, 'help': { name: 'Help', icon: iconMappings.helpCircleOutline, dependsOn: 'main_more' },
// Settings submenu // Settings submenu
"appearance": { name: "Appearance", icon: iconMappings.paletteOutline, dependsOn: "settings" }, 'appearance': { name: 'Appearance', icon: iconMappings.paletteOutline, dependsOn: 'settings' },
"library": { name: "Library", icon: iconMappings.bookmarkBoxOutline, dependsOn: "settings" }, 'library': { name: 'Library', icon: iconMappings.bookmarkBoxOutline, dependsOn: 'settings' },
"downloads": { name: "Downloads", icon: iconMappings.downloadOutline, dependsOn: "settings" }, 'downloads': { name: 'Downloads', icon: iconMappings.downloadOutline, dependsOn: 'settings' },
"tracking": { name: "Tracking", icon: iconMappings.sync, dependsOn: "settings" }, 'tracking': { name: 'Tracking', icon: iconMappings.sync, dependsOn: 'settings' },
"browse": { name: "Browse", icon: iconMappings.compassOutline, dependsOn: "settings" }, 'browse': { name: 'Browse', icon: iconMappings.compassOutline, dependsOn: 'settings' },
"security-and-privacy": { name: "Security and privacy", icon: iconMappings.security, dependsOn: "settings" }, 'security-and-privacy': { name: 'Security and privacy', icon: iconMappings.security, dependsOn: 'settings' },
"reader": { name: "Reader", icon: iconMappings.bookOpenOutline, dependsOn: "settings" }, 'reader': { name: 'Reader', icon: iconMappings.bookOpenOutline, dependsOn: 'settings' },
"advanced": { name: "Advanced", icon: iconMappings.codeTags, dependsOn: "settings" }, 'advanced': { name: 'Advanced', icon: iconMappings.codeTags, dependsOn: 'settings' },
} }
function generateNavigationHtml(navKey: string) { function generateNavigationHtml(navKey: string) {
const navData = navigationMappings[navKey] const navData = navigationMappings[navKey]
if (!navData) { if (!navData)
return "<strong style='color:var(--vp-c-danger-1)'>Unsupported Navigation!</strong>" return '<strong style=\'color:var(--vp-c-danger-1)\'>Unsupported Navigation!</strong>'
}
const { name, icon, dependsOn } = navData const { name, icon, dependsOn } = navData
const iconHtml = icon ?? "" const iconHtml = icon ?? ''
let html = `<span class='shortcode navigation ${navKey}'>${iconHtml}<span class="name">${name}</span></span>` let html = `<span class='shortcode navigation ${navKey}'>${iconHtml}<span class="name">${name}</span></span>`
if (dependsOn) { if (dependsOn)
html = `${generateNavigationHtml(dependsOn)} -> ${html}` html = `${generateNavigationHtml(dependsOn)} -> ${html}`
}
return html return html
} }

56
website/src/.vitepress/config/themeConfig.ts
View File

@ -1,11 +1,11 @@
import type { DefaultTheme } from "vitepress" import type { DefaultTheme } from 'vitepress'
import nav from "./navigation/navbar" import nav from './navigation/navbar'
import sidebar from "./navigation/sidebar" import sidebar from './navigation/sidebar'
const themeConfig: DefaultTheme.Config = { const themeConfig: DefaultTheme.Config = {
logo: { logo: {
src: "/img/logo-128px.png", src: '/img/logo-128px.png',
width: 24, width: 24,
height: 24, height: 24,
}, },
@ -17,60 +17,60 @@ const themeConfig: DefaultTheme.Config = {
socialLinks: [ socialLinks: [
{ {
icon: "github", icon: 'github',
link: "https://github.com/tachiyomiorg/tachiyomi", link: 'https://github.com/tachiyomiorg/tachiyomi',
ariaLabel: "Project GitHub", ariaLabel: 'Project GitHub',
}, },
{ {
icon: "discord", icon: 'discord',
link: "https://discord.gg/tachiyomi", link: 'https://discord.gg/tachiyomi',
ariaLabel: "Discord Server", ariaLabel: 'Discord Server',
}, },
{ {
icon: "x", icon: 'x',
link: "https://twitter.com/tachiyomiorg", link: 'https://twitter.com/tachiyomiorg',
ariaLabel: "X Page", ariaLabel: 'X Page',
}, },
{ {
icon: "facebook", icon: 'facebook',
link: "https://facebook.com/tachiyomiorg", link: 'https://facebook.com/tachiyomiorg',
ariaLabel: "Facebook Page", ariaLabel: 'Facebook Page',
}, },
{ {
icon: { icon: {
svg: '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z"/></svg>', svg: '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z"/></svg>',
}, },
link: "https://reddit.com/r/Tachiyomi", link: 'https://reddit.com/r/Tachiyomi',
ariaLabel: "Support subreddit", ariaLabel: 'Support subreddit',
}, },
// { icon: "instagram", link: "https://instagram.com/tachiyomiorg", ariaLabel: "Instagram Page" }, // { icon: "instagram", link: "https://instagram.com/tachiyomiorg", ariaLabel: "Instagram Page" },
], ],
footer: { footer: {
message: "<a href=\"https://www.apache.org/licenses/LICENSE-2.0\" target=\"_blank\">Open-source Apache Licensed</a> <span class=\"divider\">|</span> <a href=\"/privacy/\">Privacy policy</a> <span class=\"divider\">|</span> Powered by <a target=\"_blank\" href=\"https://www.netlify.com/\">Netlify <img src=\"/img/logo-netlify.svg\" alt=\"Netlify Logo\" height=\"12px\" width=\"12px\" style=\"display: inline-block\"></a>", message: '<a href="https://www.apache.org/licenses/LICENSE-2.0" target="_blank">Open-source Apache Licensed</a> <span class="divider">|</span> <a href="/privacy/">Privacy policy</a> <span class="divider">|</span> Powered by <a target="_blank" href="https://www.netlify.com/">Netlify <img src="/img/logo-netlify.svg" alt="Netlify Logo" height="12px" width="12px" style="display: inline-block"></a>',
copyright: `Copyright © 2015 - ${new Date().getFullYear()} Javier Tomás`, copyright: `Copyright © 2015 - ${new Date().getFullYear()} Javier Tomás`,
}, },
editLink: { editLink: {
pattern: "https://github.com/tachiyomiorg/website/edit/main/website/src/:path", pattern: 'https://github.com/tachiyomiorg/website/edit/main/website/src/:path',
text: "Help us improve this page", text: 'Help us improve this page',
}, },
lastUpdated: { lastUpdated: {
text: "Last updated", text: 'Last updated',
formatOptions: { formatOptions: {
forceLocale: true, forceLocale: true,
dateStyle: "long", dateStyle: 'long',
timeStyle: "short", timeStyle: 'short',
}, },
}, },
search: { search: {
provider: "algolia", provider: 'algolia',
options: { options: {
appId: "2C8EHFTRW7", appId: '2C8EHFTRW7',
apiKey: "ee38c6e04295e4d206399ab59a58ea9a", apiKey: 'ee38c6e04295e4d206399ab59a58ea9a',
indexName: "tachiyomi", indexName: 'tachiyomi',
}, },
}, },
} }

16
website/src/.vitepress/theme/Layout.vue
View File

@ -1,16 +1,16 @@
<script setup lang="ts"> <script setup lang="ts">
import { useData } from "vitepress" import { useData } from 'vitepress'
import DefaultTheme from "vitepress/theme" import DefaultTheme from 'vitepress/theme'
import { nextTick, provide } from "vue" import { nextTick, provide } from 'vue'
const { isDark } = useData() const { isDark } = useData()
function shouldEnableTransitions() { function shouldEnableTransitions() {
return "startViewTransition" in document return 'startViewTransition' in document
&& window.matchMedia("(prefers-reduced-motion: no-preference)").matches && window.matchMedia('(prefers-reduced-motion: no-preference)').matches
} }
provide("toggle-appearance", async ({ clientX: x, clientY: y }: MouseEvent) => { provide('toggle-appearance', async ({ clientX: x, clientY: y }: MouseEvent) => {
if (!shouldEnableTransitions()) { if (!shouldEnableTransitions()) {
isDark.value = !isDark.value isDark.value = !isDark.value
return return
@ -34,8 +34,8 @@ provide("toggle-appearance", async ({ clientX: x, clientY: y }: MouseEvent) => {
{ clipPath: isDark.value ? clipPath.reverse() : clipPath }, { clipPath: isDark.value ? clipPath.reverse() : clipPath },
{ {
duration: 300, duration: 300,
easing: "ease-in", easing: 'ease-in',
pseudoElement: `::view-transition-${isDark.value ? "old" : "new"}(root)`, pseudoElement: `::view-transition-${isDark.value ? 'old' : 'new'}(root)`,
}, },
) )
}) })

14
website/src/.vitepress/theme/components/Changelog.vue
View File

@ -1,8 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, toRefs } from "vue" import { computed, toRefs } from 'vue'
import MarkdownIt from "markdown-it" import MarkdownIt from 'markdown-it'
import { type AppRelease, data as release } from "../data/release.data" import { type AppRelease, data as release } from '../data/release.data'
import Contributors from "./Contributors.vue" import Contributors from './Contributors.vue'
const props = defineProps<{ type: keyof AppRelease }>() const props = defineProps<{ type: keyof AppRelease }>()
const { type } = toRefs(props) const { type } = toRefs(props)
@ -10,9 +10,9 @@ const { type } = toRefs(props)
const md = new MarkdownIt() const md = new MarkdownIt()
const changelog = computed(() => { const changelog = computed(() => {
const flavoredString = (release[type.value].body ?? "") const flavoredString = (release[type.value].body ?? '')
.replace(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g, "[@$2](https://github.com/$2)") .replace(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g, '[@$2](https://github.com/$2)')
.replace("https://github.com/tachiyomiorg/tachiyomi/releases", "/changelogs/") .replace('https://github.com/tachiyomiorg/tachiyomi/releases', '/changelogs/')
return md.render(flavoredString) return md.render(flavoredString)
}) })

20
website/src/.vitepress/theme/components/ChangelogsList.vue
View File

@ -1,25 +1,25 @@
<script setup lang="ts"> <script setup lang="ts">
import MarkdownIt from "markdown-it" import MarkdownIt from 'markdown-it'
import { data as changelogs } from "../data/changelogs.data" import { data as changelogs } from '../data/changelogs.data'
import Contributors from "./Contributors.vue" import Contributors from './Contributors.vue'
const md = new MarkdownIt() const md = new MarkdownIt()
function renderMarkdown(string: string | null | undefined) { function renderMarkdown(string: string | null | undefined) {
const body = string ?? "No changelog provided." const body = string ?? 'No changelog provided.'
const flavoredString = body const flavoredString = body
.split(/---\r\n\r\n### Checksums|---\r\n\r\nMD5/)[0] .split(/---\r\n\r\n### Checksums|---\r\n\r\nMD5/)[0]
.replace(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g, "[@$2](https://github.com/$2)") .replace(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g, '[@$2](https://github.com/$2)')
.replace(/#(\d+)/g, "[#$1](https://github.com/tachiyomiorg/tachiyomi/issues/$1)") .replace(/#(\d+)/g, '[#$1](https://github.com/tachiyomiorg/tachiyomi/issues/$1)')
.replace(/^Check out the .*past release notes.* if you're.*$/m, "") .replace(/^Check out the .*past release notes.* if you're.*$/m, '')
.replace(/https\:\/\/github.com\/tachiyomiorg\/tachiyomi\/releases\/tag\/(.*?)/g, "#$1") .replace(/https\:\/\/github.com\/tachiyomiorg\/tachiyomi\/releases\/tag\/(.*?)/g, '#$1')
.trim() .trim()
return md.render(flavoredString) return md.render(flavoredString)
} }
const dateFormatter = new Intl.DateTimeFormat("en", { const dateFormatter = new Intl.DateTimeFormat('en', {
dateStyle: "medium", dateStyle: 'medium',
}) })
</script> </script>

24
website/src/.vitepress/theme/components/Contributors.vue
View File

@ -1,38 +1,37 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, ref, toRefs } from "vue" import { computed, ref, toRefs } from 'vue'
const props = defineProps<{ body: string; author: string; tag: string }>() const props = defineProps<{ body: string; author: string; tag: string }>()
const { body, author, tag } = toRefs(props) const { body, author, tag } = toRefs(props)
function isHigherThan(tagName: string, reference: string) { function isHigherThan(tagName: string, reference: string) {
return reference.localeCompare(tagName, undefined, { numeric: true, sensitivity: "base" }) >= 0 return reference.localeCompare(tagName, undefined, { numeric: true, sensitivity: 'base' }) >= 0
} }
const notMentioned = computed(() => { const notMentioned = computed(() => {
return isHigherThan("v0.8.5", tag.value) ? ["arkon"] : [] return isHigherThan('v0.8.5', tag.value) ? ['arkon'] : []
}) })
const nonExistent = ref<string[]>([]) const nonExistent = ref<string[]>([])
const contributors = computed(() => { const contributors = computed(() => {
const list = [...body.value.matchAll(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g)] const list = [...body.value.matchAll(/(?<=\(|(, ))@(.*?)(?=\)|(, ))/g)]
.map((match) => match[2]) .map(match => match[2])
const uncredited = author.value.includes("[bot]") const uncredited = author.value.includes('[bot]')
? notMentioned.value ? notMentioned.value
: [author.value, ...notMentioned.value] : [author.value, ...notMentioned.value]
return [...new Set([...uncredited, ...list])].filter((user) => !nonExistent.value.includes(user)) return [...new Set([...uncredited, ...list])].filter(user => !nonExistent.value.includes(user))
}) })
const listFormatter = new Intl.ListFormat("en", { const listFormatter = new Intl.ListFormat('en', {
style: "long", style: 'long',
type: "conjunction", type: 'conjunction',
}) })
const contributorsText = computed(() => { const contributorsText = computed(() => {
if (contributors.value.length <= 3) { if (contributors.value.length <= 3)
return listFormatter.format(contributors.value) return listFormatter.format(contributors.value)
}
return listFormatter.format([ return listFormatter.format([
...contributors.value.slice(0, 2), ...contributors.value.slice(0, 2),
@ -41,9 +40,8 @@ const contributorsText = computed(() => {
}) })
function addToNonExistent(user: string) { function addToNonExistent(user: string) {
if (!nonExistent.value.includes(user)) { if (!nonExistent.value.includes(user))
nonExistent.value.push(user) nonExistent.value.push(user)
}
} }
</script> </script>

20
website/src/.vitepress/theme/components/CustomNavBarMenu.vue
View File

@ -1,12 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, onMounted, ref } from "vue" import { computed, onMounted, ref } from 'vue'
import { useData } from "vitepress" import { useData } from 'vitepress'
import type { DefaultTheme } from "vitepress/theme" import type { DefaultTheme } from 'vitepress/theme'
import VPNavBarMenuLink from "vitepress/dist/client/theme-default/components/VPNavBarMenuLink.vue" import VPNavBarMenuLink from 'vitepress/dist/client/theme-default/components/VPNavBarMenuLink.vue'
import VPNavBarMenuGroup from "vitepress/dist/client/theme-default/components/VPNavBarMenuGroup.vue" import VPNavBarMenuGroup from 'vitepress/dist/client/theme-default/components/VPNavBarMenuGroup.vue'
import { data as release } from "../data/release.data" import { data as release } from '../data/release.data'
const { theme } = useData<DefaultTheme.Config>() const { theme } = useData<DefaultTheme.Config>()
@ -22,20 +22,18 @@ onMounted(() => {
* and navbar doesn't support using the VitePress data loading. * and navbar doesn't support using the VitePress data loading.
*/ */
const nav = computed(() => { const nav = computed(() => {
if (!replace.value) { if (!replace.value)
return theme.value.nav return theme.value.nav
}
return theme.value.nav?.map((item) => { return theme.value.nav?.map((item) => {
if (!item.text.includes("{app_version}")) { if (!item.text.includes('{app_version}'))
return item return item
}
const appVersion = release.stable.tag_name.substring(1) const appVersion = release.stable.tag_name.substring(1)
return { return {
...item, ...item,
text: item.text.replace("{app_version}", appVersion), text: item.text.replace('{app_version}', appVersion),
} satisfies DefaultTheme.NavItem } satisfies DefaultTheme.NavItem
}) })
}) })

18
website/src/.vitepress/theme/components/CustomNavScreenMenu.vue
View File

@ -1,11 +1,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, onMounted, ref } from "vue" import { computed, onMounted, ref } from 'vue'
import { type DefaultTheme, useData } from "vitepress" import { type DefaultTheme, useData } from 'vitepress'
import VPNavScreenMenuLink from "vitepress/dist/client/theme-default/components/VPNavScreenMenuLink.vue" import VPNavScreenMenuLink from 'vitepress/dist/client/theme-default/components/VPNavScreenMenuLink.vue'
import VPNavScreenMenuGroup from "vitepress/dist/client/theme-default/components/VPNavScreenMenuGroup.vue" import VPNavScreenMenuGroup from 'vitepress/dist/client/theme-default/components/VPNavScreenMenuGroup.vue'
import { data as release } from "../data/release.data" import { data as release } from '../data/release.data'
const { theme } = useData<DefaultTheme.Config>() const { theme } = useData<DefaultTheme.Config>()
@ -21,20 +21,18 @@ onMounted(() => {
* and navbar doesn't support using the VitePress data loading. * and navbar doesn't support using the VitePress data loading.
*/ */
const nav = computed(() => { const nav = computed(() => {
if (!replace.value) { if (!replace.value)
return theme.value.nav return theme.value.nav
}
return theme.value.nav?.map((item) => { return theme.value.nav?.map((item) => {
if (!item.text.includes("{app_version}")) { if (!item.text.includes('{app_version}'))
return item return item
}
const appVersion = release.stable.tag_name.substring(1) const appVersion = release.stable.tag_name.substring(1)
return { return {
...item, ...item,
text: item.text.replace("{app_version}", appVersion), text: item.text.replace('{app_version}', appVersion),
} satisfies DefaultTheme.NavItem } satisfies DefaultTheme.NavItem
}) })
}) })

22
website/src/.vitepress/theme/components/DownloadButtons.vue
View File

@ -1,19 +1,19 @@
<script setup lang="ts"> <script setup lang="ts">
/// <reference types="@types/gtag.js" /> /// <reference types="@types/gtag.js" />
import { computed, onMounted, ref } from "vue" import { computed, onMounted, ref } from 'vue'
import { data as release } from "../data/release.data" import { data as release } from '../data/release.data'
const downloadInformation = computed(() => ({ const downloadInformation = computed(() => ({
preview: { preview: {
tagName: release.preview.tag_name ?? "r0000", tagName: release.preview.tag_name ?? 'r0000',
asset: (release.preview.assets ?? []) asset: (release.preview.assets ?? [])
.find((a) => /^tachiyomi-r\d{4,}.apk/.test(a.name)), .find(a => /^tachiyomi-r\d{4,}.apk/.test(a.name)),
}, },
stable: { stable: {
tagName: release.stable.tag_name ?? "v0.00.0", tagName: release.stable.tag_name ?? 'v0.00.0',
asset: (release.stable.assets ?? []) asset: (release.stable.assets ?? [])
.find((a) => /^tachiyomi-v\d+\.\d+\.\d+.apk/.test(a.name)), .find(a => /^tachiyomi-v\d+\.\d+\.\d+.apk/.test(a.name)),
}, },
})) }))
@ -23,11 +23,11 @@ onMounted(() => {
isAndroid.value = !!navigator.userAgent.match(/android/i) isAndroid.value = !!navigator.userAgent.match(/android/i)
}) })
function handleAnalytics(type: "preview" | "stable") { function handleAnalytics(type: 'preview' | 'stable') {
window.gtag?.("event", "Download", { window.gtag?.('event', 'Download', {
event_category: "App", event_category: 'App',
event_label: type === "stable" ? "Stable" : "Preview", event_label: type === 'stable' ? 'Stable' : 'Preview',
version: type === "stable" version: type === 'stable'
? release.stable.tag_name ? release.stable.tag_name
: release.preview.tag_name, : release.preview.tag_name,
}) })

26
website/src/.vitepress/theme/components/Extensions/ExtensionFilters.vue
View File

@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, toRefs } from "vue" import { computed, toRefs } from 'vue'
import { useMediaQuery } from "@vueuse/core" import { useMediaQuery } from '@vueuse/core'
import { import {
ElForm, ElForm,
@ -10,13 +10,13 @@ import {
ElRadio, ElRadio,
ElRadioGroup, ElRadioGroup,
ElSelect, ElSelect,
} from "element-plus" } from 'element-plus'
import { langName, simpleLangName } from "../../../config/scripts/languages" import { langName, simpleLangName } from '../../../config/scripts/languages'
import type { Extension } from "../../queries/useExtensionsRepositoryQuery" import type { Extension } from '../../queries/useExtensionsRepositoryQuery'
export type Nsfw = "Show all" | "NSFW" | "SFW" export type Nsfw = 'Show all' | 'NSFW' | 'SFW'
export type Sort = "Ascending" | "Descending" export type Sort = 'Ascending' | 'Descending'
const props = defineProps<{ const props = defineProps<{
extensions: Extension[][] extensions: Extension[][]
@ -27,16 +27,16 @@ const props = defineProps<{
}>() }>()
defineEmits<{ defineEmits<{
(e: "update:search", search: string): void (e: 'update:search', search: string): void
(e: "update:lang", lang: string[]): void (e: 'update:lang', lang: string[]): void
(e: "update:nsfw", nsfw: Nsfw): void (e: 'update:nsfw', nsfw: Nsfw): void
(e: "update:sort", sort: Sort): void (e: 'update:sort', sort: Sort): void
}>() }>()
const { extensions } = toRefs(props) const { extensions } = toRefs(props)
const isSmallScreen = useMediaQuery("(max-width: 767px)") const isSmallScreen = useMediaQuery('(max-width: 767px)')
const labelPosition = computed(() => isSmallScreen.value ? "top" : "right") const labelPosition = computed(() => isSmallScreen.value ? 'top' : 'right')
</script> </script>
<template> <template>

10
website/src/.vitepress/theme/components/Extensions/ExtensionGroup.vue
View File

@ -1,8 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, toRefs } from "vue" import { computed, toRefs } from 'vue'
import { langName, simpleLangName } from "../../../config/scripts/languages" import { langName, simpleLangName } from '../../../config/scripts/languages'
import type { Extension } from "../../queries/useExtensionsRepositoryQuery" import type { Extension } from '../../queries/useExtensionsRepositoryQuery'
import ExtensionItem from "./ExtensionItem.vue" import ExtensionItem from './ExtensionItem.vue'
const props = defineProps<{ list: Extension[]; totalCount: number }>() const props = defineProps<{ list: Extension[]; totalCount: number }>()
const { list } = toRefs(props) const { list } = toRefs(props)
@ -10,7 +10,7 @@ const { list } = toRefs(props)
const groupName = computed(() => { const groupName = computed(() => {
const firstItem = list.value[0] const firstItem = list.value[0]
return firstItem.lang === "en" return firstItem.lang === 'en'
? simpleLangName(firstItem.lang) ? simpleLangName(firstItem.lang)
: langName(firstItem.lang) : langName(firstItem.lang)
}) })

12
website/src/.vitepress/theme/components/Extensions/ExtensionItem.vue
View File

@ -1,17 +1,17 @@
<script setup lang="ts"> <script setup lang="ts">
/// <reference types="@types/gtag.js" /> /// <reference types="@types/gtag.js" />
import { computed, toRefs } from "vue" import { computed, toRefs } from 'vue'
import type { Extension } from "../../queries/useExtensionsRepositoryQuery" import type { Extension } from '../../queries/useExtensionsRepositoryQuery'
const props = defineProps<{ item: Extension }>() const props = defineProps<{ item: Extension }>()
const { item } = toRefs(props) const { item } = toRefs(props)
const pkgId = computed(() => { const pkgId = computed(() => {
return item.value.pkg.replace("eu.kanade.tachiyomi.extension.", "") return item.value.pkg.replace('eu.kanade.tachiyomi.extension.', '')
}) })
const pkgName = computed(() => item.value.name.split(": ")[1]) const pkgName = computed(() => item.value.name.split(': ')[1])
const pkgIsNsfw = computed(() => item.value.nsfw === 1) const pkgIsNsfw = computed(() => item.value.nsfw === 1)
const iconUrl = computed(() => { const iconUrl = computed(() => {
@ -23,8 +23,8 @@ const apkUrl = computed(() => {
}) })
function handleAnalytics() { function handleAnalytics() {
window.gtag?.("event", "Download", { window.gtag?.('event', 'Download', {
event_category: "Extension", event_category: 'Extension',
event_label: pkgName.value, event_label: pkgName.value,
version: item.value.version, version: item.value.version,
}) })

6
website/src/.vitepress/theme/components/Extensions/ExtensionList.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, toRefs } from "vue" import { computed, toRefs } from 'vue'
import type { Extension } from "../../queries/useExtensionsRepositoryQuery" import type { Extension } from '../../queries/useExtensionsRepositoryQuery'
import ExtensionGroup from "./ExtensionGroup.vue" import ExtensionGroup from './ExtensionGroup.vue'
const props = defineProps<{ extensions: Extension[][] }>() const props = defineProps<{ extensions: Extension[][] }>()
const { extensions } = toRefs(props) const { extensions } = toRefs(props)

76
website/src/.vitepress/theme/components/Extensions/ExtensionsWrapper.vue
View File

@ -1,18 +1,18 @@
<script setup lang="ts"> <script setup lang="ts">
import groupBy from "lodash.groupby" import groupBy from 'lodash.groupby'
import { ElLoading } from "element-plus" import { ElLoading } from 'element-plus'
import { computed, nextTick, onMounted, reactive, ref, watch } from "vue" import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue'
import { simpleLangName } from "../../../config/scripts/languages" import { simpleLangName } from '../../../config/scripts/languages'
import useExtensionsRepositoryQuery from "../../queries/useExtensionsRepositoryQuery" import useExtensionsRepositoryQuery from '../../queries/useExtensionsRepositoryQuery'
import type { Extension } from "../../queries/useExtensionsRepositoryQuery" import type { Extension } from '../../queries/useExtensionsRepositoryQuery'
import ExtensionFilters from "./ExtensionFilters.vue" import ExtensionFilters from './ExtensionFilters.vue'
import ExtensionList from "./ExtensionList.vue" import ExtensionList from './ExtensionList.vue'
import type { Nsfw, Sort } from "./ExtensionFilters.vue" import type { Nsfw, Sort } from './ExtensionFilters.vue'
const { data: extensions, isLoading } = useExtensionsRepositoryQuery({ const { data: extensions, isLoading } = useExtensionsRepositoryQuery({
select: (response) => { select: (response) => {
const values: Extension[][] = Object.values(groupBy(response, "lang")) const values: Extension[][] = Object.values(groupBy(response, 'lang'))
values.sort(languageComparator) values.sort(languageComparator)
return values return values
@ -20,33 +20,33 @@ const { data: extensions, isLoading } = useExtensionsRepositoryQuery({
}) })
const filters = reactive({ const filters = reactive({
search: "", search: '',
lang: [] as string[], lang: [] as string[],
nsfw: "Show all" as Nsfw, nsfw: 'Show all' as Nsfw,
sort: "Ascending" as Sort, sort: 'Ascending' as Sort,
}) })
function languageComparator(a: Extension[], b: Extension[]) { function languageComparator(a: Extension[], b: Extension[]) {
const langA = simpleLangName(a[0].lang) const langA = simpleLangName(a[0].lang)
const langB = simpleLangName(b[0].lang) const langB = simpleLangName(b[0].lang)
if (langA === "All" && langB === "English") { if (langA === 'All' && langB === 'English')
return -1 return -1
}
if (langA === "English" && langB === "All") { if (langA === 'English' && langB === 'All')
return 1 return 1
}
if (langA === "English") { if (langA === 'English')
return -1 return -1
}
if (langB === "English") { if (langB === 'English')
return 1 return 1
}
if (langA < langB) { if (langA < langB)
return -1 return -1
}
if (langA > langB) { if (langA > langB)
return 1 return 1
}
return 0 return 0
} }
@ -60,33 +60,32 @@ const filteredExtensions = computed(() => {
if (filters.search) { if (filters.search) {
filteredGroup = filteredGroup.filter( filteredGroup = filteredGroup.filter(
(ext) => ext =>
ext.name.toLowerCase().includes(filters.search.toLowerCase()) ext.name.toLowerCase().includes(filters.search.toLowerCase())
|| ext.sources.some((source) => source.id.includes(filters.search)), || ext.sources.some(source => source.id.includes(filters.search)),
) )
} }
filteredGroup = filteredGroup.filter((ext) => filteredGroup = filteredGroup.filter(ext =>
filters.nsfw === "Show all" ? true : ext.nsfw === (filters.nsfw === "NSFW" ? 1 : 0), filters.nsfw === 'Show all' ? true : ext.nsfw === (filters.nsfw === 'NSFW' ? 1 : 0),
) )
if (filters.sort && filters.sort === "Descending") { if (filters.sort && filters.sort === 'Descending')
filteredGroup = filteredGroup.reverse() filteredGroup = filteredGroup.reverse()
}
if (filteredGroup.length) { if (filteredGroup.length)
filtered.push(filteredGroup) filtered.push(filteredGroup)
} }
}
return filtered return filtered
}) })
const loadingInstance = ref<ReturnType<typeof ElLoading["service"]>>() const loadingInstance = ref<ReturnType<typeof ElLoading['service']>>()
onMounted(() => { onMounted(() => {
loadingInstance.value = ElLoading.service({ loadingInstance.value = ElLoading.service({
target: ".extensions", target: '.extensions',
fullscreen: false, fullscreen: false,
background: "transparent", background: 'transparent',
}) })
}) })
@ -95,15 +94,14 @@ watch(extensions, async () => {
await nextTick() await nextTick()
const extElement = document.getElementById(window.location.hash.substring(1)) const extElement = document.getElementById(window.location.hash.substring(1))
extElement?.scrollIntoView({ behavior: "smooth" }) extElement?.scrollIntoView({ behavior: 'smooth' })
extElement?.focus({ preventScroll: true }) extElement?.focus({ preventScroll: true })
} }
}) })
watch([isLoading, loadingInstance], async ([newIsLoading]) => { watch([isLoading, loadingInstance], async ([newIsLoading]) => {
if (!newIsLoading) { if (!newIsLoading)
loadingInstance.value?.close() loadingInstance.value?.close()
}
}) })
</script> </script>

14
website/src/.vitepress/theme/components/News.vue
View File

@ -1,17 +1,17 @@
<script setup lang="ts"> <script setup lang="ts">
import { IconChevronRight } from "@iconify-prerendered/vue-mdi" import { IconChevronRight } from '@iconify-prerendered/vue-mdi'
import { data as newsList } from "../data/news.data" import { data as newsList } from '../data/news.data'
const dateFormatter = new Intl.DateTimeFormat("en", { const dateFormatter = new Intl.DateTimeFormat('en', {
dateStyle: "medium", dateStyle: 'medium',
timeZone: "UTC", timeZone: 'UTC',
}) })
function formatDate(date: string) { function formatDate(date: string) {
const [year, month, day] = date const [year, month, day] = date
.substring(0, 10) .substring(0, 10)
.split("-") .split('-')
.map((number) => Number.parseInt(number, 10)) .map(number => Number.parseInt(number, 10))
const utcDate = Date.UTC(year, month - 1, day) const utcDate = Date.UTC(year, month - 1, day)
return dateFormatter.format(utcDate) return dateFormatter.format(utcDate)
} }

8
website/src/.vitepress/theme/components/ReleaseDate.vue
View File

@ -1,14 +1,14 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, onMounted, ref, toRefs } from "vue" import { computed, onMounted, ref, toRefs } from 'vue'
import moment from "moment" import moment from 'moment'
import { type AppRelease, data as release } from "../data/release.data" import { type AppRelease, data as release } from '../data/release.data'
const props = defineProps<{ type: keyof AppRelease }>() const props = defineProps<{ type: keyof AppRelease }>()
const { type } = toRefs(props) const { type } = toRefs(props)
const momentInfo = computed(() => ({ const momentInfo = computed(() => ({
relative: moment(release[type.value].published_at).fromNow(), relative: moment(release[type.value].published_at).fromNow(),
exact: moment(release[type.value].published_at).format("dddd, MMMM Do YYYY [at] HH:mm"), exact: moment(release[type.value].published_at).format('dddd, MMMM Do YYYY [at] HH:mm'),
iso: release[type.value].published_at ?? undefined, iso: release[type.value].published_at ?? undefined,
})) }))

10
website/src/.vitepress/theme/data/changelogs.data.ts
View File

@ -1,6 +1,6 @@
import { defineLoader } from "vitepress" import { defineLoader } from 'vitepress'
import { Octokit } from "@octokit/rest" import { Octokit } from '@octokit/rest'
import type { GetResponseDataTypeFromEndpointMethod } from "@octokit/types" import type { GetResponseDataTypeFromEndpointMethod } from '@octokit/types'
const octokit = new Octokit() const octokit = new Octokit()
@ -12,8 +12,8 @@ export { data }
export default defineLoader({ export default defineLoader({
async load(): Promise<GitHubReleaseList> { async load(): Promise<GitHubReleaseList> {
const releases = await octokit.paginate(octokit.repos.listReleases, { const releases = await octokit.paginate(octokit.repos.listReleases, {
owner: "tachiyomiorg", owner: 'tachiyomiorg',
repo: "tachiyomi", repo: 'tachiyomi',
per_page: 100, per_page: 100,
}) })

6
website/src/.vitepress/theme/data/news.data.ts
View File

@ -1,4 +1,4 @@
import { createContentLoader } from "vitepress" import { createContentLoader } from 'vitepress'
export interface News { export interface News {
title: string title: string
@ -10,11 +10,11 @@ export interface News {
declare const data: News[] declare const data: News[]
export { data } export { data }
export default createContentLoader("news/*.md", { export default createContentLoader('news/*.md', {
excerpt: true, excerpt: true,
transform(articles) { transform(articles) {
return articles return articles
.filter(({ url }) => url !== "/news/") .filter(({ url }) => url !== '/news/')
.map( .map(
({ frontmatter, url }) => ({ frontmatter, url }) =>
<News>{ <News>{

14
website/src/.vitepress/theme/data/release.data.ts
View File

@ -1,6 +1,6 @@
import { defineLoader } from "vitepress" import { defineLoader } from 'vitepress'
import { Octokit } from "@octokit/rest" import { Octokit } from '@octokit/rest'
import type { GetResponseDataTypeFromEndpointMethod } from "@octokit/types" import type { GetResponseDataTypeFromEndpointMethod } from '@octokit/types'
const octokit = new Octokit() const octokit = new Octokit()
@ -17,13 +17,13 @@ export { data }
export default defineLoader({ export default defineLoader({
async load(): Promise<AppRelease> { async load(): Promise<AppRelease> {
const { data: stable } = await octokit.repos.getLatestRelease({ const { data: stable } = await octokit.repos.getLatestRelease({
owner: "tachiyomiorg", owner: 'tachiyomiorg',
repo: "tachiyomi", repo: 'tachiyomi',
}) })
const { data: preview } = await octokit.repos.getLatestRelease({ const { data: preview } = await octokit.repos.getLatestRelease({
owner: "tachiyomiorg", owner: 'tachiyomiorg',
repo: "tachiyomi-preview", repo: 'tachiyomi-preview',
}) })
return { stable, preview } return { stable, preview }

24
website/src/.vitepress/theme/index.ts
View File

@ -1,31 +1,31 @@
// https://vitepress.dev/guide/custom-theme // https://vitepress.dev/guide/custom-theme
import DefaultTheme from "vitepress/theme" import DefaultTheme from 'vitepress/theme'
// Import Stylus files // Import Stylus files
import "./styles/base.styl" import './styles/base.styl'
// Import Global plugins // Import Global plugins
import "element-plus/theme-chalk/dark/css-vars.css" import 'element-plus/theme-chalk/dark/css-vars.css'
import { VueQueryPlugin } from "@tanstack/vue-query" import { VueQueryPlugin } from '@tanstack/vue-query'
import { enhanceAppWithTabs } from "vitepress-plugin-tabs/client" import { enhanceAppWithTabs } from 'vitepress-plugin-tabs/client'
// Import icon components // Import icon components
import { IconBugReport, IconDownload, IconNewspaperVariant } from "@iconify-prerendered/vue-mdi" import { IconBugReport, IconDownload, IconNewspaperVariant } from '@iconify-prerendered/vue-mdi'
import analytics from "./plugin/analytics" import analytics from './plugin/analytics'
import Layout from "./Layout.vue" import Layout from './Layout.vue'
export default { export default {
extends: DefaultTheme, extends: DefaultTheme,
enhanceApp({ app }) { enhanceApp({ app }) {
app.use(VueQueryPlugin) app.use(VueQueryPlugin)
enhanceAppWithTabs(app) enhanceAppWithTabs(app)
app.component("IconDownload", IconDownload) app.component('IconDownload', IconDownload)
app.component("IconNewspaperVariant", IconNewspaperVariant) app.component('IconNewspaperVariant', IconNewspaperVariant)
app.component("IconBugReport", IconBugReport) app.component('IconBugReport', IconBugReport)
analytics({ id: "G-2CBXXM1Y86" }) analytics({ id: 'G-2CBXXM1Y86' })
}, },
Layout, Layout,
} }

16
website/src/.vitepress/theme/plugin/analytics.ts
View File

@ -3,13 +3,12 @@
// https://github.com/ZhongxuYang/vitepress-plugin-google-analytics // https://github.com/ZhongxuYang/vitepress-plugin-google-analytics
function mountGoogleAnalytics(id: string) { function mountGoogleAnalytics(id: string) {
if (("dataLayer" in window && window.gtag) || window.location.hostname === "localhost") { if (('dataLayer' in window && window.gtag) || window.location.hostname === 'localhost')
return return
}
const analyticsScript = document.createElement("script") const analyticsScript = document.createElement('script')
analyticsScript.addEventListener("load", () => { analyticsScript.addEventListener('load', () => {
// @ts-expect-error Missing types // @ts-expect-error Missing types
window.dataLayer = window.dataLayer || [] window.dataLayer = window.dataLayer || []
function gtag(..._args: any[]) { function gtag(..._args: any[]) {
@ -18,8 +17,8 @@ function mountGoogleAnalytics(id: string) {
window.dataLayer.push(arguments) window.dataLayer.push(arguments)
} }
gtag("js", new Date()) gtag('js', new Date())
gtag("config", id) gtag('config', id)
window.gtag = gtag window.gtag = gtag
}) })
@ -30,8 +29,7 @@ function mountGoogleAnalytics(id: string) {
} }
export default function ({ id }: { id: string }) { export default function ({ id }: { id: string }) {
// eslint-disable-next-line n/prefer-global/process // eslint-disable-next-line node/prefer-global/process
if (process.env.NODE_ENV === "production" && id && typeof window !== "undefined") { if (process.env.NODE_ENV === 'production' && id && typeof window !== 'undefined')
mountGoogleAnalytics(id) mountGoogleAnalytics(id)
}
} }

12
website/src/.vitepress/theme/queries/useExtensionsRepositoryQuery.ts
View File

@ -1,9 +1,9 @@
import type { UseQueryOptions } from "@tanstack/vue-query" import type { UseQueryOptions } from '@tanstack/vue-query'
import { useQuery } from "@tanstack/vue-query" import { useQuery } from '@tanstack/vue-query'
import axios from "axios" import axios from 'axios'
import { GITHUB_EXTENSION_JSON } from "../../config/constants" import { GITHUB_EXTENSION_JSON } from '../../config/constants'
export type ReleaseType = "stable" | "preview" export type ReleaseType = 'stable' | 'preview'
export interface Extension { export interface Extension {
name: string name: string
@ -31,7 +31,7 @@ type UseExtensionsRepositoryQueryOptions<S = Extension[]> =
export default function useExtensionsRepositoryQuery<S = Extension[]>(options: UseExtensionsRepositoryQueryOptions<S> = {}) { export default function useExtensionsRepositoryQuery<S = Extension[]>(options: UseExtensionsRepositoryQueryOptions<S> = {}) {
return useQuery<Extension[], Error, S>({ return useQuery<Extension[], Error, S>({
queryKey: ["extensions"], queryKey: ['extensions'],
queryFn: async () => { queryFn: async () => {
const { data } = await axios.get<Extension[]>(GITHUB_EXTENSION_JSON) const { data } = await axios.get<Extension[]>(GITHUB_EXTENSION_JSON)

4
website/src/.vitepress/vue-shim.d.ts vendored
View File

@ -1,5 +1,5 @@
declare module "*.vue" { declare module '*.vue' {
import type { Component } from "vue" import type { Component } from 'vue'
const _default: Component const _default: Component
export default _default export default _default