Skip to content

Instantly share code, notes, and snippets.

@kuroski
Last active October 6, 2020 14:14
Show Gist options
  • Save kuroski/a76f1b7c211550d383933d530c3eea5d to your computer and use it in GitHub Desktop.
Save kuroski/a76f1b7c211550d383933d530c3eea5d to your computer and use it in GitHub Desktop.
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
// - XState (all XState exports)
function uploadMovie(_context, fileList) {
return Promise.resolve('HELLO WORLD')
}
const fetchMachine = Machine({
id: "gif",
type: "parallel",
states: {
upload: {
id: "upload",
initial: "idle",
context: {
file: null
},
states: {
idle: {},
uploading: {
entry: assign(() => ({
file: null
})),
invoke: {
id: "upload-file",
src: uploadMovie,
onDone: {
target: "uploaded",
actions: assign((_context, { data }) => ({
file: data
}))
},
onError: "failure"
}
},
uploaded: {
on: {
REFRESH: "uploading",
RESET: "idle"
}
},
failure: {
on: {
RETRY: "uploading",
CANCEL: "idle"
}
}
}
},
drag: {
id: "drag",
initial: "idle",
states: {
idle: {
on: {
DRAGOVER: "dragover"
}
},
dragover: {
on: {
DRAGLEAVE: "dragleave",
DROP: "drop"
}
},
dragleave: {
on: {
DRAGOVER: "dragover",
DROP: "idle"
}
},
drop: {
entry: raise("UPLOAD"),
on: {
DRAGOVER: "dragover",
}
}
}
}
},
on: {
UPLOAD: {
target: ".upload.uploading"
}
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment