resources/js/pages/DiscordBot.js

   1 import React from 'react';
   2 import { Button, Container } from 'react-bootstrap';
   3 import { Helmet } from 'react-helmet';
   4 import { useTranslation } from 'react-i18next';
   5
   6 import Icon from '../components/common/Icon';
   7 import Controls from '../components/discord-bot/Controls';
   8
   9 const authEndpoint = 'https://discord.com/oauth2/authorize';
  10 const clientId = process.env.MIX_DISCORD_CLIENT_ID;
  11
  12 export const Component = () => {
  13         const { t } = useTranslation();
  14
  15         return <Container>
  16                 <h1>{t('discordBot.heading')}</h1>
  17                 <Helmet>
  18                         <title>{t('discordBot.heading')}</title>
  19                 </Helmet>
  20                 <p>
  21                         <span className="button-bar">
  22                                 <Button
  23                                         href={`${authEndpoint}?client_id=${clientId}&scope=bot%20applications.commands`}
  24                                         target="_blank"
  25                                         variant="discord"
  26                                 >
  27                                         <Icon.DISCORD title="" />
  28                                         {' '}
  29                                         {t('discordBot.invite')}
  30                                 </Button>
  31                         </span>
  32                 </p>
  33                 <h2>{t('discordBot.controls')}</h2>
  34                 <Controls />
  35         </Container>;
  36 };