From eb2e929e2188ccfd9f575a5aa425024bf1fec67f Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 15 Nov 2020 02:32:34 +0300
Subject: feat: add Event Form

---
 .../BsuFantomSection/BsuFantomSection.tsx          |  4 ++
 src/containers/BsuFantomSection/EventForm.tsx      | 83 ++++++++++++++++++++++
 2 files changed, 87 insertions(+)
 create mode 100644 src/containers/BsuFantomSection/EventForm.tsx

diff --git a/src/containers/BsuFantomSection/BsuFantomSection.tsx b/src/containers/BsuFantomSection/BsuFantomSection.tsx
index a05d180..496c210 100644
--- a/src/containers/BsuFantomSection/BsuFantomSection.tsx
+++ b/src/containers/BsuFantomSection/BsuFantomSection.tsx
@@ -3,6 +3,7 @@ import { ContentSection } from 'react-benzin';
 import { Grid, Link } from '@material-ui/core';
 import EventCard from '../../components/EventCard/EventCard';
 import { useEvents } from '../../hooks/APIClient';
+import EventForm from './EventForm';
 
 
 const BsuFantomSection: React.FC = () => {
@@ -13,6 +14,9 @@ const BsuFantomSection: React.FC = () => {
       <p>
         Schedule your offline <Link href="https://edufpmi.bsu.by">EDUFPMI</Link> conference attendance
       </p>
+      <ContentSection sectionName="Schedule an event" level={2}>
+        <EventForm mutate={mutate} />
+      </ContentSection>
       <ContentSection sectionName="Upcoming events" level={2}>
         <Grid container spacing={2}>
           {events?.map((event, index) => (
diff --git a/src/containers/BsuFantomSection/EventForm.tsx b/src/containers/BsuFantomSection/EventForm.tsx
new file mode 100644
index 0000000..64ea46b
--- /dev/null
+++ b/src/containers/BsuFantomSection/EventForm.tsx
@@ -0,0 +1,83 @@
+import React, { useState } from 'react';
+import { Grid, TextField, Button } from '@material-ui/core';
+import { post } from '../../requests';
+import { Event } from '../../types';
+
+interface PropTypes {
+  mutate: () => void;
+}
+
+const EventForm: React.FC<PropTypes> = ({ mutate }) => {
+  const [name, setName] = useState<string>('');
+  const [date, setDate] = useState<string>('');
+  const [attendanceId, setAttendanceId] = useState<string>('');
+  const [conferenceId, setConferenceId] = useState<string>('');
+
+  const createHandler = (setter: any) => (event: React.ChangeEvent<HTMLInputElement>) => {
+    setter(event.target.value);
+  };
+
+  const handleSubmit = () => {
+    if (date && conferenceId) {
+      const event: Event["data"] = {
+        name,
+        date,
+        attendanceId,
+        conferenceId,
+        participants: []
+      }
+      return post('/events', event).then(() => mutate());
+    }
+  }
+
+  return (
+    <Grid container spacing={2}>
+      <Grid item>
+        <TextField
+          value={name}
+          onChange={createHandler(setName)}
+          variant="outlined"
+          label="Name"
+        />
+      </Grid>
+      <Grid item>
+        <TextField
+          value={date}
+          onChange={createHandler(setDate)}
+          variant="outlined"
+          label="When"
+          required
+        />
+      </Grid>
+      <Grid item>
+        <TextField
+          value={attendanceId}
+          onChange={createHandler(setAttendanceId)}
+          variant="outlined"
+          label="Attendance ID"
+        />
+      </Grid>
+      <Grid item>
+        <TextField
+          value={conferenceId}
+          onChange={createHandler(setConferenceId)}
+          variant="outlined"
+          label="Conference ID"
+          required
+        />
+      </Grid>
+      <Grid item xs={12}>
+        <Button
+          onClick={handleSubmit}
+          variant="contained"
+          size="large"
+          color="primary"
+        >
+          CREATE JOB
+        </Button>
+      </Grid>
+    </Grid>
+  );
+};
+
+export default EventForm;
-- 
cgit v1.2.3