Skip to content

Instantly share code, notes, and snippets.

@alexandrugheorghe
Last active March 31, 2020 09:03
Show Gist options
  • Save alexandrugheorghe/b1c6b6cde5946f87350c8e6140b66230 to your computer and use it in GitHub Desktop.
Save alexandrugheorghe/b1c6b6cde5946f87350c8e6140b66230 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)
const MODAL = {
CHAT_CREATOR: 'CHAT_CREATOR',
CHAT_EDITOR: 'CHAT_EDITOR',
BING_IMAGE_SELECTOR: 'BING_IMAGE_SELECTOR',
IMAGE_CROPPER: 'IMAGE_CROPPER',
MEMBER_LIST: 'MEMBER_LIST',
NONE: 'NONE',
}
const EVENTS = {
OPEN_MEMBER_LIST: 'OPEN_MEMBER_LIST',
OPEN_BING_IMAGE_SELECTOR: 'OPEN_BING_IMAGE_SELECTOR',
OPEN_IMAGE_CROPPER: 'OPEN_IMAGE_CROPPER',
OPEN_CHAT_CREATOR: 'OPEN_CHAT_CREATOR',
OPEN_CHAT_EDITOR: 'OPEN_CHAT_EDITOR',
CLOSE_CHAT_EDITOR: 'CLOSE_CHAT_EDITOR',
CLOSE_CHAT_CREATOR: 'CLOSE_CHAT_CREATOR'
}
const initialContext = {
selectedMemberIds: [],
selectedImage: '',
isImageLoading: false,
isPrivate: false,
title: '',
}
const chatFlow = Machine(
{
id: 'ChatFlow',
context: initialContext,
initial: MODAL.NONE,
states: {
[MODAL.NONE]: {
entry: ['clearContext'],
on: {
[EVENTS.OPEN_CHAT_EDITOR]: {
target: MODAL.CHAT_EDITOR,
},
[EVENTS.OPEN_CHAT_CREATOR]: {
target: MODAL.CHAT_CREATOR,
},
},
},
[MODAL.CHAT_CREATOR]: {
on: {
[EVENTS.OPEN_MEMBER_LIST]: {
target: MODAL.MEMBER_LIST,
},
[EVENTS.OPEN_BING_IMAGE_SELECTOR]: {
target: MODAL.BING_IMAGE_SELECTOR,
},
[EVENTS.OPEN_IMAGE_CROPPER]: {
target: MODAL.IMAGE_CROPPER,
},
[EVENTS.CLOSE_CHAT_CREATOR]: {
target: MODAL.NONE,
},
},
},
[MODAL.CHAT_EDITOR]: {
entry: ['assignContext'],
on: {
[EVENTS.OPEN_BING_IMAGE_SELECTOR]: {
target: MODAL.BING_IMAGE_SELECTOR,
},
[EVENTS.OPEN_IMAGE_CROPPER]: {
target: MODAL.IMAGE_CROPPER,
},
[EVENTS.CLOSE_CHAT_EDITOR]: {
target: MODAL.NONE,
},
},
},
[MODAL.MEMBER_LIST]: {
entry: ['assignContext'],
on: {
[EVENTS.OPEN_CHAT_CREATOR]: {
target: MODAL.CHAT_CREATOR,
},
},
},
[MODAL.IMAGE_CROPPER]: {
entry: ['assignContext'],
on: {
[EVENTS.OPEN_CHAT_CREATOR]: {
target: MODAL.CHAT_CREATOR,
},
[EVENTS.OPEN_CHAT_EDITOR]: {
target: MODAL.CHAT_EDITOR,
},
},
},
[MODAL.BING_IMAGE_SELECTOR]: {
entry: ['assignContext'],
on: {
[EVENTS.OPEN_CHAT_CREATOR]: {
target: MODAL.CHAT_CREATOR,
},
[EVENTS.OPEN_CHAT_EDITOR]: {
target: MODAL.CHAT_EDITOR,
},
},
},
},
},
{
actions: {
clearContext: () => {
assign(initialContext)
},
assignContext: assign(
(
context,
{
selectedImage,
selectedMemberIds,
isImageLoading,
isPrivate,
title,
}
) => ({
selectedMemberIds: selectedMemberIds || context.selectedMemberIds,
selectedImage: selectedImage || context.selectedImage,
isImageLoading: !!isImageLoading,
isPrivate: !!isPrivate,
title: title || context.title,
})
),
},
}
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment