microwave machine

index.js

const openMic = {
  initial: 'idle',
  states: {
    idle: {
      on: {
        ADD_THIRTY_SEC: { actions: 'addThirtySec', target: 'running' },
        ADD_TIME: { actions: 'addTime' },
        SET_TIME: { actions: 'setTime' },
        START: { target: 'running', cond: ({ countdown }) => countdown !== 0 },
      },
    },
    running: {
      invoke: {
        id: 'startCountdown',
        src: () => callback => {
          const id = setInterval(() => callback('DEC'), 1000);
          return () => clearInterval(id);
        },
      },
      on: {
        '': [{ target: 'done', cond: 'isZero' }],
        DEC: { actions: 'dec' },
        ADD_THIRTY_SEC: { actions: 'addThirtySec' },
        PAUSE: 'paused',
        OFF: 'done',
      },
    },
    paused: { on: { START: 'running', OFF: 'done' } },
    done: {
      activities: ['beep'],
      on: {
        CLEAR: { target: 'idle', actions: 'reset' },
      },
    },
  },
};

const microwave = new Machine(
  {
    id: 'microwave',
    initial: 'open',
    context: { countdown: 0 },
    states: {
      closed: {
        ...openMic,
        on: {
          OPEN: '#microwave.open',
          CLEAR: { target: '.idle', actions: 'reset' },
        },
      },
      open: {
        on: {
          CLOSE: 'closed',
          CLEAR: {
            target: '',
            actions: 'reset',
            cond: ({ countdown }) => countdown !== 0,
          },
        },
      },
    },
  },
  {
    actions: {
      addThirtySec: assign({ countdown: ({ countdown }) => countdown + 30000 }),
      addTime: assign({
        countdown: ({ countdown }, { time }) => countdown + (time ? time : 0),
      }),
      dec: assign({ countdown: ({ countdown }) => countdown - 1000 }),
      reset: assign({ countdown: () => 0 }),
      setTime: assign({ countdown: (_, { time }) => (time ? time : 0) }),
    },
    activities: {
      beep: () => {
        const id = setInterval(() => console.log('BEEP'), 2000);
        return () => clearInterval(id);
      },
    },
    guards: { isZero: ({ countdown }) => countdown <= 0 },
  },
);