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

machine.js

const spawnFetch = assign({
  fetchService: () => spawn(false, "fetch")
});

const toCurrent = () => send({type:"get"}, {to: "fetch"});

const update = assign((ctx, {data}) => ({
  ...ctx,
  ...data
}));

const skip = ((ctx, event) => {
  // in middle?
  return {seek}
  // at edge?
  let req = {type: "get", turn: false};
  return [
    assign(({
      req: () => req
    })),
    send(req, {to: "fetch"})
  ];
});

const setTick = () => 1;

const seek = () => 1;

const isHistory = () => 1;
const isCurrent = () => 1;

const turnMachine = Machine({
  initial: 'init',
  context: {
    //fetchService: fn,
    //req: {},
    //prevTurn: 1,
    //tick: 0,
    //data: { turn, initialState, ticks, states }
  },
  states: {
    init: {
      entry: [spawnFetch, raise("toCurrent")]
    },
    waiting: {
      on: {
        skip: { actions: skip }
      }
    },
    unknown: {
      on: {
        "": [
          {cond: isHistory, target: "history"},
          {target: "current"}
        ]
      }
    },
    current: {
      on: {
        skip: {},
        next: {}
      }
    },
    history: {
      entry: setTick,
      states: {
        idle: {
          on: {
            seek: { actions: seek },
            skip: { actions: skip },
            togglePlay: "animating"
          }
        },
        animating: {
          invoke: {},
          on: {
            seek: { actions: seek, target: "idle" },
            skip: { actions: skip, target: "idle" },
            togglePlay: "idle"
          }
        }
      },
      on: {
        toCurrent: {
        }
      }
    }
  },
  on: {
    wait: {
      action: update,
      target: "waiting"
    },
    update: {
      action: update,
      target: "unknown"
    }
  }
});