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

machine.js

const appMachine = Machine({
  id: 'app',
  initial: 'unauthenticated',
  states: {
    unauthenticated: {
      on: {
        LOGIN: 'authenticated',
      },
    },
    authenticated: {
      on: {
        LOGOUT: {
          target: 'unauthenticated',
        },
      },
      type: 'parallel',
      states: {
        playback: {
          initial: 'stopped',
          states: {
            playing: {
              on: {
                PAUSE: 'paused',
                STOP: 'stopped',
              },
            },
            paused: {
              on: {
                PLAY: 'playing',
                STOP: 'stopped',
              },
            },
            stopped: {
              on: {
                PLAY: 'playing',
              },
            },
          },
        },
        repeat: {
          initial: 'off',
          states: {
            off: {
              on: {
                TOGGLE_REPEAT_MODE: 'all',
              },
            },
            all: {
              on: {
                TOGGLE_REPEAT_MODE: 'one',
              },
            },
            one: {
              on: {
                TOGGLE_REPEAT_MODE: 'off',
              },
            },
          }
        }
      },
    },
  },
});