1import {useState, useReducer} from 'react';
 2import {ProfileDocument, useCreateEventMutation} from '../../generated/graphql';
 3import useAddToEvents from '../../hooks/useAddToEvents';
 4import Step1 from './Step1';
 5import Step2 from './Step2';
 6
 7const STEPS = [Step1, Step2];
 8
 9const CreateEvent = () => {
10  const [step, setStep] = useState(0);
11  const [event, addToEvent] = useReducer(eventReducer, {});
12  const [sendEvent] = useCreateEventMutation();
13  const {addToEvent: addToUserEvents} = useAddToEvents();
14  const Step = STEPS[step];
15
16  const createEvent = async eventData => {
17    try {
18      const variables = {...event, ...eventData};
19      const {data} = await sendEvent({
20        variables,
21        refetchQueries: [ProfileDocument],
22      });
23      const {id, attributes} = data.createEvent.data;
24      addToUserEvents(id);
25      return {id, ...attributes};
26    } catch (err) {
27      console.error(err);
28      return false;
29    }
30  };
31
32  return (
33    <Step
34      event={event}
35      addToEvent={addToEvent}
36      createEvent={createEvent}
37      nextStep={() => setStep(step + 1)}
38      previousStep={() => setStep(step - 1)}
39      id="NewEvent"
40    />
41  );
42};
43
44const eventReducer = (state, item) => ({...state, ...item});
45
46export default CreateEvent;