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

machine.js

const UploaderMachine = Machine(
   {
      strict: true,
      id: "uploader-machine",
      context: {
         progress: false,
         progressDataModel: {
            progressMsg: "",
            infoMsg: "",
            progressPercent: "",
            retryCount: 0,
            maxRetries: 3,
         },
      },
      initial: "idle",
      states: {
         idle: {
            type: "atomic",
            on: {
               VALIDATE: {
                  target: "validate",
               },
               POLL: {
                  target: "poll",
               },
            },
         },
         validate: {
            type: "atomic",
            on: {
               "": [{ target: "upload", cond: "isValid" }, { target: "idle" }],
            },
         },
         upload: {
            type: "compound",
            initial: "trigger",
            states: {
               trigger: {},
               start: {
                  on: {
                     UPLOAD_ERROR: {
                        target: "error",
                     },
                     UPLOAD_TIMEOUT: {
                        target: "timeout",
                     },
                     UPLOAD_PROGRESS: {
                        target: "progress",
                     },
                  },
               },
               progress: {
                  on: {
                     UPLOAD_SUCCESS: {
                        target: "success",
                     },
                     UPLOAD_ERROR: {
                        target: "error",
                     },
                     UPLOAD_TIMEOUT: {
                        target: "timeout",
                     },
                     UPLOAD_PROGRESS: {},
                  },
               },
               success: {
                  on: {
                     POLL_START: {
                        target: "#uploader-machine.poll",
                     },
                  },
               },
               error: {
                  on: {
                     "": [
                        { target: "trigger", cond: "shouldRetryUpload" },
                        { target: "#uploader-machine.idle" },
                     ],
                  },
               },
               timeout: {
                  on: {
                     "": [
                        { target: "trigger", cond: "shouldRetryUpload" },
                        { target: "#uploader-machine.idle" },
                     ],
                  },
               },
            },
         },
         poll: {
            type: "compound",
            initial: "trigger",
            states: {
               trigger: {},
               success: {},
               error: {
                  on: {
                     "": [
                        { target: "trigger", cond: "shouldRetryPoll" },
                        { target: "#uploader-machine.idle" },
                     ],
                  },
               },
               timeout: {
                  on: {
                     "": [
                        { target: "trigger", cond: "shouldRetryPoll" },
                        { target: "#uploader-machine.idle" },
                     ],
                  },
               },
            },
         },
      },
   },
   {
      actions: {},
      guards: {
         isValid: (ctx, evt) => {},
         shouldRetryUpload: (ctx, evt) => {},
         shouldRetryUpload: (ctx, evt) => {},
      },
   }
);