X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;ds=sidebyside;f=resources%2Fjs%2Fpages%2FDiscordBot.js;fp=resources%2Fjs%2Fpages%2FDiscordBot.js;h=6796a9445e4b67e88837b43546cd25ec55588658;hb=b45c183b7ba39080b6438c6238bad614c4d3953e;hp=0000000000000000000000000000000000000000;hpb=16662be0b3432d67307ae8c2bb798362d77bab99;p=alttp.git

diff --git a/resources/js/pages/DiscordBot.js b/resources/js/pages/DiscordBot.js
new file mode 100644
index 0000000..6796a94
--- /dev/null
+++ b/resources/js/pages/DiscordBot.js
@@ -0,0 +1,34 @@
+import React from 'react';
+import { Button, Container } from 'react-bootstrap';
+import { useTranslation } from 'react-i18next';
+
+import Icon from '../components/common/Icon';
+import Controls from '../components/discord-bot/Controls';
+
+const authEndpoint = 'https://discord.com/oauth2/authorize';
+const clientId = process.env.MIX_DISCORD_CLIENT_ID;
+
+const DiscordBot = () => {
+	const { t } = useTranslation();
+
+	return <Container>
+		<h1>{t('discordBot.heading')}</h1>
+		<p>
+			<span className="button-bar">
+				<Button
+					href={`${authEndpoint}?client_id=${clientId}&scope=bot%20applications.commands`}
+					target="_blank"
+					variant="discord"
+				>
+					<Icon.DISCORD title="" />
+					{' '}
+					{t('discordBot.invite')}
+				</Button>
+			</span>
+		</p>
+		<h2>{t('discordBot.controls')}</h2>
+		<Controls />
+	</Container>;
+};
+
+export default DiscordBot;