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 requestMachine = Machine({
  id: 'request',
  initial: 'idle',
  context: {
    form: null
  },
  states: {
    idle: {},
    selected: {} // no invocations!
  },
  on: {
    SELECT: {
      target: '.selected',
      actions: assign({
        subreddit: (context, event) => event.name
      })
    }
  }
});

async function invokeFetchForm(context) {
  const {formId} = context
  
  console.log(`GET api.passfort.com/4.0/forms/${formId}`)
  
  // throw new Error('blah')
  
  await new Promise((resolve) => setTimeout(resolve, 1000));
  
  return {data: {}, state: 'SENT', etag: 'a'}
}

const createFormMachine = (formId) => {
  return Machine({
    id: 'form',
    initial: 'loading',
    context: {
      formId, // form id passed in
      form: null,
      state: null,
      etag: null,
    },
    states: {
      loading: {
        invoke: {
          id: 'fetch-form',
          src: invokeFetchForm,
          onDone: {
            target: 'loaded',
            actions: assign({
              form: (_, event) => event.data.data,
              state: (_, event) => event.data.state,
              etag: (_, event) => event.data.etag,
            })
          },
          onError: 'failure'
        },
      },
      loaded: {
        on: {
          REFRESH: 'loading',
          ANSWER: 'submitAnswer',
        }
      },
      submitAnswer: {
        invoke: {
          id: 'set-form-answer',
          src: invokeFetchForm,
          onDone: {
            target: 'loaded',
            actions: assign({
              state: (_, event) => event.data.state,
              etag: (_, event) => event.data.etag,
            })
          },
          onError: 'failure'
        },
      },
      failure: {
        on: {
          RETRY: 'loading'
        }
      }
    }
  });
};

const form = createFormMachine('0000000-0000-0000-0000-000000000000')