X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Fpages%2FAosFront.js;h=9651110d3c80e134e88cb73e4de8472ea09c0019;hb=18cd02860ba7889360ce3547b44faa0daa807a5e;hp=8ae6d8b912737b0cb3993fae563b081d1dad1ab2;hpb=0a5adf255129188e9bdb9e7fc9db31a75123669b;p=alttp.git

diff --git a/resources/js/components/pages/AosFront.js b/resources/js/components/pages/AosFront.js
index 8ae6d8b..9651110 100644
--- a/resources/js/components/pages/AosFront.js
+++ b/resources/js/components/pages/AosFront.js
@@ -1,74 +1,87 @@
 import React from 'react';
 import { Button, Col, Container, Row } from 'react-bootstrap';
-import { withTranslation } from 'react-i18next';
+import { Helmet } from 'react-helmet';
+import { useTranslation } from 'react-i18next';
 
 import Icon from '../common/Icon';
-import i18n from '../../i18n';
 
-const AosFront = () => <Container>
-	<div className="my-5 text-center">
-		<h1>Castlevania: Aria of Sorrow</h1>
-	</div>
-	<Row>
-		<Col className="text-center mb-3" sm={6} md={4}>
-			<Button
-				href="https://discord.gg/VEtVYNr"
-				size="lg"
-				target="_blank"
-				variant="discord"
-			>
-				<Icon.DISCORD />
-				{' '}
-				{i18n.t('aos.randoDiscord')}
-			</Button>
-		</Col>
-		<Col className="text-center mb-3" sm={6} md={4}>
-			<Button
-				href="https://aosrando.surge.sh/"
-				size="lg"
-				target="_blank"
-				variant="primary"
-			>
-				{i18n.t('aos.randoWeb')}
-			</Button>
-		</Col>
-		<Col className="text-center mb-3" sm={6} md={4}>
-			<Button
-				href="https://discord.gg/ApVyJnd"
-				size="lg"
-				target="_blank"
-				variant="discord"
-			>
-				<Icon.DISCORD />
-				{' '}
-				{i18n.t('aos.tourneyDiscord')}
-			</Button>
-		</Col>
-		<Col className="text-center mb-3" sm={6} md={4}>
-			<Button
-				href="https://discord.com/oauth2/authorize?client_id=951113702839549982&scope=bot%20applications.commands"
-				size="lg"
-				target="_blank"
-				variant="discord"
-			>
-				<Icon.DISCORD />
-				{' '}
-				{i18n.t('aos.inviteBot')}
-			</Button>
-		</Col>
-		<Col className="text-center mb-3" sm={6} md={4}>
-			<Button
-				href="https://discord.com/oauth2/authorize?client_id=951113702839549982&scope=applications.commands"
-				size="lg"
-				target="_blank"
-				variant="discord"
-			>
-				<Icon.DISCORD />
-				{' '}
-				{i18n.t('aos.inviteCommand')}
-			</Button>
-		</Col>
-	</Row>
-</Container>;
+const authEndpoint = 'https://discord.com/oauth2/authorize';
+const clientId = '951113702839549982';
+const botUrl = `${authEndpoint}?client_id=${clientId}&scope=bot%20applications.commands`;
+const commandUrl = `${authEndpoint}?client_id=${clientId}&scope=applications.commands`;
 
-export default withTranslation()(AosFront);
+const AosFront = () => {
+	const { t } = useTranslation();
+
+	return <Container>
+		<Helmet>
+			<title>AoS</title>
+			<meta name="description" content="Castlevania: Aria of Sorrow" />
+		</Helmet>
+		<div className="my-5 text-center">
+			<h1>Castlevania: Aria of Sorrow</h1>
+		</div>
+		<Row>
+			<Col className="text-center mb-3" sm={6} md={4}>
+				<Button
+					href="https://discord.gg/VEtVYNr"
+					size="lg"
+					target="_blank"
+					variant="discord"
+				>
+					<Icon.DISCORD />
+					{' '}
+					{t('aos.randoDiscord')}
+				</Button>
+			</Col>
+			<Col className="text-center mb-3" sm={6} md={4}>
+				<Button
+					href="https://aosrando.surge.sh/"
+					size="lg"
+					target="_blank"
+					variant="primary"
+				>
+					{t('aos.randoWeb')}
+				</Button>
+			</Col>
+			<Col className="text-center mb-3" sm={6} md={4}>
+				<Button
+					href="https://discord.gg/ApVyJnd"
+					size="lg"
+					target="_blank"
+					variant="discord"
+				>
+					<Icon.DISCORD />
+					{' '}
+					{t('aos.tourneyDiscord')}
+				</Button>
+			</Col>
+			<Col className="text-center mb-3" sm={6} md={4}>
+				<Button
+					href={botUrl}
+					size="lg"
+					target="_blank"
+					variant="discord"
+				>
+					<Icon.DISCORD />
+					{' '}
+					{t('aos.inviteBot')}
+				</Button>
+			</Col>
+			<Col className="text-center mb-3" sm={6} md={4}>
+				<Button
+					href={commandUrl}
+					size="lg"
+					target="_blank"
+					variant="discord"
+				>
+					<Icon.DISCORD />
+					{' '}
+					{t('aos.inviteCommand')}
+				</Button>
+			</Col>
+		</Row>
+	</Container>;
+};
+
+export default AosFront;