From 15dc9bd4abaa2737d7637dc1a54e5ca954a38bd9 Mon Sep 17 00:00:00 2001
From: Misode <Misoloo64@gmail.com>
Date: Mon, 9 May 2022 03:38:07 +0200
Subject: [PATCH] Improve versions in title

---
 src/app/contexts/Title.tsx | 26 ++++++++++++++++++--------
 src/app/pages/Versions.tsx |  5 ++++-
 vite.config.js             |  4 ++--
 3 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/src/app/contexts/Title.tsx b/src/app/contexts/Title.tsx
index 583f76c1..33982e9c 100644
--- a/src/app/contexts/Title.tsx
+++ b/src/app/contexts/Title.tsx
@@ -9,20 +9,20 @@ const VERSIONS_IN_TITLE = 3
 
 interface Title {
 	title: string,
-	changeTitle: (title: string, versions?: VersionId[]) => unknown,
+	changeTitle: (title: string, versions?: VersionId[], suffix?: string) => unknown,
 }
 const Title = createContext<Title>({
 	title: '',
 	changeTitle: () => {},
 })
 
-export function useTitle(title?: string, versions?: VersionId[]) {
+export function useTitle(title?: string, versions?: VersionId[], suffix?: string) {
 	const context = useContext(Title)
 	useEffect(() => {
 		if (title) {
-			context.changeTitle(title, versions)
+			context.changeTitle(title, versions, suffix)
 		}
-	}, [title, versions])
+	}, [title, versions, suffix])
 	return context
 }
 
@@ -30,10 +30,20 @@ export function TitleProvider({ children }: { children: ComponentChildren }) {
 	const { locale } = useLocale()
 	const [title, setTitle] = useState<string>(locale('title.home'))
 
-	const changeTitle = useCallback((title: string, versions?: VersionId[]) => {
-		versions ??= config.versions.map(v => v.id as VersionId)
-		const titleVersions = versions.slice(-VERSIONS_IN_TITLE)
-		document.title = `${title} Minecraft ${titleVersions.join(', ')}`
+	const changeTitle = useCallback((title: string, versionIds?: VersionId[], suffix?: string) => {
+		let versions = config.versions
+		if (versionIds !== undefined) {
+			versions = config.versions.filter(v => versionIds?.includes(v.id as VersionId))
+		}
+		let titleSuffix = ''
+		if (suffix) {
+			titleSuffix = ` - ${suffix}`
+		}
+		if (!(versionIds?.length === 0)) {
+			const titleVersions = versions.map(v => v.id).slice(-VERSIONS_IN_TITLE)
+			titleSuffix = ` - Minecraft ${titleVersions.join(', ')}`
+		}
+		document.title = title + titleSuffix
 		setTitle(title)
 	}, [])
 
diff --git a/src/app/pages/Versions.tsx b/src/app/pages/Versions.tsx
index 319f365b..203dd96e 100644
--- a/src/app/pages/Versions.tsx
+++ b/src/app/pages/Versions.tsx
@@ -16,7 +16,10 @@ export function Versions({}: Props) {
 	const [selectedId] = useSearchParam('id')
 	const selected = (versions ?? []).find(v => v.id === selectedId)
 
-	useTitle(selected ? selected.name : 'Versions Explorer', selected ? [] : undefined)
+	useTitle(
+		selected ? `Minecraft ${selected.name}` : 'Versions Explorer',
+		selected ? [] : undefined,
+		selected ? 'Changes and metadata' : undefined)
 
 	const nextVersion = selected && getOffsetVersion(versions ?? [], selected, -1)
 	const previousVersion = selected && getOffsetVersion(versions ?? [], selected, 1)
diff --git a/vite.config.js b/vite.config.js
index e8ae38de..1e93f0aa 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -62,7 +62,7 @@ export default defineConfig({
 				...guides.map(g => {
 					return html({
 						fileName: `guides/${g.id}/index.html`,
-						title: `${g.title} Minecraft${g.versions ? ` ${g.versions.join(' ')}` : ''}`,
+						title: `${g.title} - Minecraft${g.versions ? ` ${g.versions.join(' ')}` : ''}`,
 						template,
 					})
 				}),
@@ -95,7 +95,7 @@ function getTitle(m) {
 	const minVersion = Math.max(0, config.versions.findIndex(v => m.minVersion === v.id))
 	const versions = config.versions.slice(minVersion).map(v => v.id)
 	versions.splice(0, versions.length - 3)
-	return `${English[m.id] ?? ''}${m.page ? '' : ` Generator${m.category === true ? 's' : ''}`} Minecraft ${versions.join(', ')}`
+	return `${English[m.id] ?? ''}${m.page ? '' : ` Generator${m.category === true ? 's' : ''}`} - Minecraft ${versions.join(', ')}`
 }
 
 function template({ files, title }) {