crew management

[alttp.git] / resources / js / components / episodes / RestreamEditForm.js

diff --git a/resources/js/components/episodes/RestreamEditForm.js b/resources/js/components/episodes/RestreamEditForm.js
index e4cbe134fe5e8980dd60065196601555b221de77..84a3ea2f6f0c59405935f06780c03a8b11e61e9d 100644 (file)
--- a/resources/js/components/episodes/RestreamEditForm.js
+++ b/resources/js/components/episodes/RestreamEditForm.js
@@ -1,18 +1,30 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import { Button, Modal } from 'react-bootstrap';
+import { Button, Col, Form, Modal, Row } from 'react-bootstrap';
 import { useTranslation } from 'react-i18next';
 
+import CrewManagement from './CrewManagement';
+import ToggleSwitch from '../common/ToggleSwitch';
 import { getName } from '../../helpers/Crew';
 
 const RestreamEditForm = ({
        channel,
+       editRestream,
        episode,
+       manageCrew,
        onCancel,
        onRemoveRestream,
 }) => {
        const { t } = useTranslation();
 
+       const acceptToggle = React.useCallback(e => {
+               editRestream({
+                       channel_id: channel.id,
+                       episode_id: episode.id,
+                       [e.target.name]: e.target.value,
+               });
+       }, [channel, editRestream, episode]);
+
        return <>
                <Modal.Body>
                        {channel ?
@@ -31,6 +43,52 @@ const RestreamEditForm = ({
                                        {episode.players.map(p => getName(p)).join(', ')}
                                </div>
                        </> : null}
+                       {channel && episode && editRestream ?
+                               <Row>
+                                       <Form.Group as={Col} sm={6} controlId="episodes.accept_comms">
+                                               <Form.Label className="d-block">
+                                                       {t('episodes.restreamDialog.acceptComms')}
+                                               </Form.Label>
+                                               <Form.Control
+                                                       as={ToggleSwitch}
+                                                       name="accept_comms"
+                                                       onChange={acceptToggle}
+                                                       value={!!channel.pivot.accept_comms}
+                                               />
+                                       </Form.Group>
+                                       <Form.Group as={Col} sm={6} controlId="episodes.accept_tracker">
+                                               <Form.Label className="d-block">
+                                                       {t('episodes.restreamDialog.acceptTracker')}
+                                               </Form.Label>
+                                               <Form.Control
+                                                       as={ToggleSwitch}
+                                                       name="accept_tracker"
+                                                       onChange={acceptToggle}
+                                                       value={!!channel.pivot.accept_tracker}
+                                               />
+                                       </Form.Group>
+                               </Row>
+                       : null}
+                       {channel && episode && manageCrew ? <>
+                               <CrewManagement
+                                       channel={channel}
+                                       episode={episode}
+                                       manageCrew={manageCrew}
+                                       role="commentary"
+                               />
+                               <CrewManagement
+                                       channel={channel}
+                                       episode={episode}
+                                       manageCrew={manageCrew}
+                                       role="tracking"
+                               />
+                               <CrewManagement
+                                       channel={channel}
+                                       episode={episode}
+                                       manageCrew={manageCrew}
+                                       role="setup"
+                               />
+                       </> : null}
                </Modal.Body>
                <Modal.Footer className="justify-content-between">
                        {onRemoveRestream ?
@@ -49,16 +107,28 @@ const RestreamEditForm = ({
 
 RestreamEditForm.propTypes = {
        channel: PropTypes.shape({
+               id: PropTypes.number,
+               pivot: PropTypes.shape({
+                       accept_comms: PropTypes.bool,
+                       accept_tracker: PropTypes.bool,
+               }),
                title: PropTypes.string,
        }),
+       editRestream: PropTypes.func,
        episode: PropTypes.shape({
+               crew: PropTypes.arrayOf(PropTypes.shape({
+                       channel_id: PropTypes.number,
+                       role: PropTypes.string,
+               })),
                event: PropTypes.shape({
                        title: PropTypes.string,
                }),
+               id: PropTypes.number,
                players: PropTypes.arrayOf(PropTypes.shape({
                })),
                start: PropTypes.string,
        }),
+       manageCrew: PropTypes.func,
        onCancel: PropTypes.func,
        onRemoveRestream: PropTypes.func,
 };