There's a hole in my bucket song as a state chart

there-is-a-hole-in-my-bucket.js

  const bucketMachine = Machine({
    id: 'fetch',
    initial: "There's a hole in my bucket",
    
    states: {
      "There's a hole in my bucket": {
        on: {
          THEN_FIX_IT: 'With what should I fix it?'
        }
      },
      'With what should I fix it?': {
        on: {
          WITH_A_STRAW: 'But the straw is too long'
        }
      },
      'But the straw is too long': {
        on: {
          THEN_CUT_IT: "With what shall I cut it?"
        }
      },
      "With what shall I cut it?": {
        on: {
          WITH_AN_AXE: "But the axe is too dull"
        }
      },
      "But the axe is too dull": {
        on: {
          THEN_SHARPEN_IT: "With what should I sharpen it?"
        }
      },
      "With what should I sharpen it?": {
        on: {
          WITH_A_STONE: "But the stone is too dry"
        }
      },
      "But the stone is too dry": {
        on: {
          THEN_WET_IT: "With what should I wet it?"
        }
      },
      "With what should I wet it?": {
        on: {
          WITH_WATER: "But how shall I get it?"
        }
      },
      "But how shall I get it?": {
        on: {
          IN_THE_BUCKET: "There's a hole in my bucket"
        }
      }
    }
  });

Paste it in https://xstate.js.org/viz/ and click "update" to see the flow