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

machine.js

const quizMachine = Machine({
    id: 'question',
    initial: 'idle',
    context: {
      questions: [{title: "question 1", title: "question 2", id: 'question-1'}],
      currentQuestionId: 'question-1',
      answers: []
    },
    states: {
      idle: {
        on: {
          SUBMIT: {
            target: "answering",
             actions: assign({answers: (context, event) => {
              const {answers} = context
              return [...answers, event.answer]
          }})
          }
        }
      },
      answering: {
        // invoke: {
        //   id: 'postingAnswer',
        //   src: (context, _event) => {
        //     const {ansers, currentQuestionId} = context
        //     // find(answers, {questionId: currentQuestionId}) 
        //     // return axios.post()
        //   }
        //   onDone: {target: 'answered'},
        //   onError: {target: 'failure'}
        // }
        on: {'': [{target: 'answered'}]},
      },
      answered: {
        on: {
          NEXT_QUESTION: {target: 'idle', actions: assign({currentQuestionId: (context, event) => {
            return event.currentQuestionId
          }})}
        }
      }
    }
  });