X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftournament%2FSettingsDialog.js;h=af4d664efe0d2f60c435e169c9a000a395b39bd6;hb=f446d5bcf3b87bd9443a060e27e9c0601c96fbb9;hp=995c07b8250ee4388a267b26bac67c0b0880ad62;hpb=d566d913c251fbb05e6bd314cc51f8b5ca49fe57;p=alttp.git

diff --git a/resources/js/components/tournament/SettingsDialog.js b/resources/js/components/tournament/SettingsDialog.js
index 995c07b..af4d664 100644
--- a/resources/js/components/tournament/SettingsDialog.js
+++ b/resources/js/components/tournament/SettingsDialog.js
@@ -1,10 +1,11 @@
 import axios from 'axios';
 import PropTypes from 'prop-types';
 import React from 'react';
-import { Button, Modal } from 'react-bootstrap';
+import { Button, Col, Modal, Row } from 'react-bootstrap';
 import { withTranslation } from 'react-i18next';
 import toastr from 'toastr';
 
+import DiscordForm from './DiscordForm';
 import DiscordSelect from '../common/DiscordSelect';
 import Icon from '../common/Icon';
 import ToggleSwitch from '../common/ToggleSwitch';
@@ -55,52 +56,72 @@ const setDiscord = async (tournament, guild_id) => {
 	}
 };
 
+const inviteUrl = 'https://discordapp.com/oauth2/authorize?client_id=951113702839549982&scope=bot';
+
 const SettingsDialog = ({
 	onHide,
 	show,
 	tournament,
 }) =>
-<Modal className="settings-dialog" onHide={onHide} show={show}>
+<Modal
+	className="settings-dialog"
+	onHide={onHide}
+	show={show}
+	size={tournament.discord ? 'lg' : 'md'}
+>
 	<Modal.Header closeButton>
 		<Modal.Title>
 			{i18n.t('tournaments.settings')}
 		</Modal.Title>
 	</Modal.Header>
 	<Modal.Body>
-		<div className="d-flex align-items-center justify-content-between mb-3">
-			<span>{i18n.t('tournaments.open')}</span>
-			<ToggleSwitch
-				onChange={({ target: { value } }) => value ? open(tournament) : close(tournament)}
-				value={tournament.accept_applications}
-			/>
-		</div>
-		<div className="d-flex align-items-center justify-content-between mb-3">
-			<span>{i18n.t('tournaments.locked')}</span>
-			<ToggleSwitch
-				onChange={({ target: { value } }) => value ? lock(tournament) : unlock(tournament)}
-				value={tournament.locked}
-			/>
-		</div>
-		<div className="d-flex align-items-center justify-content-between">
-			<div>
-				<p>{i18n.t('tournaments.discord')}</p>
-				<div>
-					<Button
-						href="https://discordapp.com/oauth2/authorize?client_id=951113702839549982&scope=bot"
-						target="_blank"
-						variant="discord"
-					>
-						<Icon.DISCORD />
-						{' '}
-						{i18n.t('tournaments.inviteBot')}
-					</Button>
+		<Row>
+			<Col sm={tournament.discord ? 6 : 12}>
+				<div className="d-flex align-items-center justify-content-between mb-3">
+					<span>{i18n.t('tournaments.open')}</span>
+					<ToggleSwitch
+						onChange={({ target: { value } }) => value
+							? open(tournament) : close(tournament)}
+						value={tournament.accept_applications}
+					/>
+				</div>
+				<div className="d-flex align-items-center justify-content-between mb-3">
+					<span>{i18n.t('tournaments.locked')}</span>
+					<ToggleSwitch
+						onChange={({ target: { value } }) => value
+							? lock(tournament) : unlock(tournament)}
+						value={tournament.locked}
+					/>
+				</div>
+				<div className="d-flex align-items-center justify-content-between">
+					<div>
+						<p>{i18n.t('tournaments.discord')}</p>
+						{!tournament.discord ?
+							<div>
+								<Button
+									href={inviteUrl}
+									target="_blank"
+									variant="discord"
+								>
+									<Icon.DISCORD />
+									{' '}
+									{i18n.t('tournaments.inviteBot')}
+								</Button>
+							</div>
+						: null}
+					</div>
+					<DiscordSelect
+						onChange={({ target: { value } }) => setDiscord(tournament, value)}
+						value={tournament.discord}
+					/>
 				</div>
-			</div>
-			<DiscordSelect
-				onChange={({ target: { value } }) => setDiscord(tournament, value)}
-				value={tournament.discord}
-			/>
-		</div>
+			</Col>
+			{tournament.discord ?
+				<Col sm={6}>
+					<DiscordForm tournament={tournament} />
+				</Col>
+			: null}
+		</Row>
 	</Modal.Body>
 	<Modal.Footer>
 		<Button onClick={onHide} variant="secondary">