Generated by XState Viz: https://xstate.js.org/viz

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  const fetchMachine = Machine({
     id: 'sessionSchedule',
        initial: 'loading',
        context: {},
        states: {
          loading: {
            invoke: {
              id: 'loadSegments',
              src: async () => await load?.({ variables: { id: eventId } }),
              onDone: { target: 'idle', actions: 'writeDataToContext' },
            },
          },
          idle: {
            on: {
              OPEN_DELETE_SEGMENT_DIALOG: {
                target: 'deleteSegmentDialog',
                actions: 'writeSegmentIdToContext',
              },
              OPEN_CREATE_CUSTOM_SEGMENT_DIALOG: {
                target: 'createCustomSegmentDialog',
                actions: 'writeEmptyVariablesToContext',
              },
              OPEN_EDIT_CUSTOM_SEGMENT_DIALOG: {
                target: 'editCustomSegmentDialog',
              },
              OPEN_CREATE_ROW_SEGMENT_DIALOG: 'createRowSegmentDialog',
              OPEN_EDIT_ROW_SEGMENT_DIALOG: 'editRowSegmentDialog',
            },
          },
          deleteSegmentDialog: {
            on: {
              DELETE_SEGMENT: 'deleting',
              CANCEL: { target: 'idle', actions: 'clearContext' },
            },
          },
          deleting: {
            invoke: {
              id: 'deleteSegment',
              src: async ({ segmentId }) => {
                if (segmentId) {
                  await deleteSegment({ variables: { id: segmentId } });
                }
              },
              onDone: 'idle',
            },
            entry: 'removeSegmentFromContext',
            exit: 'removeSegmentIdFromContext',
          },
          createCustomSegmentDialog: {
            on: {
              CANCEL: { target: 'idle', actions: 'clearContext' },
              CREATE_CUSTOM_SEGMENT: {
                target: 'creatingCustomSegment',
                actions: 'writeVariablesToContext',
              },
            },
          },
          creatingCustomSegment: {
            invoke: {
              id: 'createSegment',
              src: async ({ variables }) => {
                // TODO: use actual start value
                if (variables) {
                  return (
                    await createSegment({
                      variables: {
                        ...variables,
                        startTime: new Date(),
                      },
                    })
                  ).data;
                }
              },
              onDone: { target: 'idle', actions: 'appendSegment' },
            },
          },
          editCustomSegmentDialog: {
            on: {
              CANCEL: { target: 'idle', actions: 'clearContext' },
            },
          },
          createRowSegmentDialog: {
            on: {
              CANCEL: { target: 'idle', actions: 'clearContext' },
            },
          },
          editRowSegmentDialog: {
            on: {
              CANCEL: { target: 'idle', actions: 'clearContext' },
            },
          },
        },
  });