Add a wiki page button to versions (#470)

* Add a wiki page button to versions

* Wrap tabs and change tab to "Wiki"

---------

Co-authored-by: Misode <misoloo64@gmail.com>

src/app/components/versions/VersionDetail.tsx

@@ -9,6 +9,7 @@ import { Octicon } from '../Octicon.js'
 import { ChangelogList, IssueList, VersionDiff, VersionMetaData } from './index.js'
 
 const Tabs = ['changelog', 'diff', 'fixes']
+const WIKI_PAGE_PREFIX = 'https://minecraft.wiki/w/Java_Edition_'
 
 interface Props {
 	id: string,
@@ -31,6 +32,7 @@ export function VersionDetail({ id, version }: Props) {
 	[id, changes])
 
 	const articleLink = version && getArticleLink(version.id)
+	const wikiPageLink = version && WIKI_PAGE_PREFIX + version.name
 
 	return <>
 		<div class="version-detail">
@@ -57,6 +59,10 @@ export function VersionDetail({ id, version }: Props) {
 					{locale('versions.article')}
 					{Octicon.link_external}
 				</a>}
+				{wikiPageLink && <a href={wikiPageLink} target="_blank">
+					{locale('versions.wiki')}
+					{Octicon.link_external}
+				</a>}
 			</div>
 			<div class="version-tab">
 				{tab === 'changelog' && <ChangelogList changes={filteredChangelogs} defaultOrder="asc" />}

src/locales/en.json

@@ -269,6 +269,7 @@
   "versions.minecraft_versions": "Minecraft Versions",
   "versions.latest_snapshot": "Latest snapshot",
   "versions.latest_release": "Latest release",
+  "versions.wiki": "Wiki",
   "version_diff.word_wrap": "Word wrap",
   "weight": "Weight",
   "whats_new": "What's new?",

src/locales/fr.json

@@ -198,6 +198,7 @@
     "versions.resource_pack_format": "Format du pack de ressources",
     "versions.search": "Rechercher des versions",
     "versions.changelog": "Modifications techniques",
+    "versions.wiki": "Wiki",
     "world": "Paramètres du monde",
     "worldgen": "Générateur de monde",
     "worldgen/biome": "Biome",

src/styles/global.css

@@ -2462,6 +2462,7 @@ hr {
 
 .tabs {
 	display: flex;
+	flex-wrap: wrap;
 	margin-bottom: 10px;
 	box-shadow: inset 0 -1px 0 var(--background-4);
 }