Solving the autosubmit problem

src/Components/Event/Create/Tabs/Basic.js

@@ -19,7 +19,9 @@ import styles from '../styles';
 
 class Basic extends React.Component {
   render() {
-    const { classes, event, edit } = this.props;
+    const {
+      classes, event, edit, create,
+    } = this.props;
     return (
       <React.Fragment>
         <Typography className={classes.typography} variant='body1' gutterBottom align='left'>
@@ -102,7 +104,7 @@ class Basic extends React.Component {
             >
               Go to technical tab
             </Button>
-            <Button className={classes.bottomButton} type='submit' variant='contained' color='secondary'>
+            <Button className={classes.bottomButton} onClick={() => create()} variant='contained' color='secondary'>
               Or Create event
             </Button>
           </Grid>

src/Components/Event/Create/Tabs/Technical/index.js

@@ -58,7 +58,9 @@ class Technical extends React.Component {
   }
 
   render() {
-    const { classes, event, edit } = this.props;
+    const {
+      classes, event, edit, create,
+    } = this.props;
     const {
       isNewPlotterOpen, isNewFormulaOpen, isNewRuleOpen, isNewPrizeOpen,
     } = this.state;
@@ -182,7 +184,7 @@ class Technical extends React.Component {
 
         <Grid container justify='center' >
           <Grid item>
-            <Button className={classes.bottomButton} type='submit' variant='contained' color='secondary'>
+            <Button className={classes.bottomButton} onClick={() => create()} variant='contained' color='secondary'>
               Create the event
             </Button>
           </Grid>

src/Components/Event/Create/index.js

@@ -125,10 +125,17 @@ class Create extends React.Component {
                   <Typography className={classes.typography} variant='h5' gutterBottom>
                     Create a new event
                   </Typography>
-                  <form
-                    onSubmit={(e) => {
-                      e.preventDefault();
-                      hostEvent({
+                  {value === 0 && <TabContainer>
+                    <Basic
+                      event={{
+                        title,
+                        subtitle,
+                        description,
+                        startDatetime,
+                        finishDatetime,
+                      }}
+                      edit={(newType, newVal) => this.handleEventChange(newType, newVal)}
+                      create={() => hostEvent({
                         variables: {
                           event: {
                             title,
@@ -140,35 +147,35 @@ class Create extends React.Component {
                             plotterId,
                           },
                         },
-                      });
-                    }}
-                  >
-                    {value === 0 && <TabContainer>
-                      <Basic
-                        event={{
-                          title,
-                          subtitle,
-                          description,
-                          startDatetime,
-                          finishDatetime,
-                        }}
-                        edit={(newType, newVal) => this.handleEventChange(newType, newVal)}
-                      />
-                    </TabContainer>}
-                    {value === 1 && <TabContainer>
-                      <Technical
-                        event={{
-                          formulaId,
-                          plotterId,
-                          prizes,
-                          rules,
-                        }}
-                        edit={(newType, newVal) => this.handleEventChange(newType, newVal)}
-                      />
-                    </TabContainer>}
-                    {value === 2 && <TabContainer><TeamsServer /></TabContainer>}
-                    {value === 3 && <TabContainer><PresentationPage /></TabContainer>}
-                  </form>
+                      })}
+                    />
+                  </TabContainer>}
+                  {value === 1 && <TabContainer>
+                    <Technical
+                      event={{
+                        formulaId,
+                        plotterId,
+                        prizes,
+                        rules,
+                      }}
+                      edit={(newType, newVal) => this.handleEventChange(newType, newVal)}
+                      create={() => hostEvent({
+                        variables: {
+                          event: {
+                            title,
+                            subtitle,
+                            description,
+                            startDatetime: startDatetime.valueOf() / 1000,
+                            finishDatetime: finishDatetime.valueOf() / 1000,
+                            formulaId,
+                            plotterId,
+                          },
+                        },
+                      })}
+                    />
+                  </TabContainer>}
+                  {value === 2 && <TabContainer><TeamsServer /></TabContainer>}
+                  {value === 3 && <TabContainer><PresentationPage /></TabContainer>}
                 </Paper>
               </div>
             </div>

src/GraphQL/Calls/hostedEvents.js

@@ -4,7 +4,7 @@ import { eventFullInfo } from '../Fragments';
 const EVENTS_CREATEEVENT = gql`
   mutation Events_CreateEvent($event: events_EventInput!) {
     events_CreateEvent(event: $event) {
-      ...eventFullInfo
+      ...EventFullInfo
     }
   }
   ${eventFullInfo}
@@ -13,7 +13,7 @@ const EVENTS_CREATEEVENT = gql`
 const EVENTS_EDITEVENT = gql`
   mutation Events_EditEvent($eventId:  ID!, $event: events_EventInput!) {
     events_EditEvent(eventId: $eventId, event: $event) {
-      ...eventFullInfo
+      ...EventFullInfo
     }
   }
   ${eventFullInfo}
@@ -22,7 +22,7 @@ const EVENTS_EDITEVENT = gql`
 const EVENTS_EVENTSBYHOST = gql`
   query Events_EventsByHost{
     events_EventsByHost {
-      ...eventFullInfo
+      ...EventFullInfo
     }
   }
   ${eventFullInfo}