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 addPlayer = assign({
  playerCount: (context, event) => context.playerCount + 1,
});

const removePlayer = assign({
  playerCount: (context, event) => context.playerCount - 1,
});

const game = Machine(
  {
    id: 'game',
    initial: 'waitingForPlayers',
    context: {
      playerCount: 0,
    },
    states: {
      waitingForPlayers: {
        on: {
          '': {target: 'ready', cond: 'hasMinimumPlayers'},
          CONNECT:{
              target: 'waitingForPlayers',
              actions: 'addPlayer',
            }
          ,
          DISCONNECT: {
            target: 'waitingForPlayers',
            actions: 'removePlayer',
          },
        },
      },
      ready: {
        on: {
          '': [
            {target: 'waitingForPlayers', cond: 'requireMorePlayers'}
          ],
          CONNECT:             {
              target: 'ready', 
              actions: 'addPlayer',
            },
          DISCONNECT: {
              target: 'ready', 
              actions: 'removePlayer',
            },
          START: 'started',
        },
      },
      started: {
        on: {
          END: 'ended'
        }
      },
      ended: {}
    },
  },
  {
    actions: {addPlayer, removePlayer},
    guards: {
      hasMinimumPlayers: (context, event) => {
        return context.playerCount >= 3
      },
      requireMorePlayers: (context, event) => {
        return context.playerCount < 3
      },
      hasPlaceLeft: (context, event) => {
        return context.playerCount < 6;
      }
    }
  }
);