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

machine.js

// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
// - XState (all XState exports)

const CurrentStep = Object.freeze({
	START: 1,
	INDUSTRY: 2,
	OBJECTIVE: 3,
	CONFIRM: 4,
	FINALIZING: 4,
	PREVIEW: 5
});

const TOTAL_STEPS = 4;

let machine = Machine({
	id: "CampaignAssistant",

	context: {
		component: null,
		isTemporary: true,
		hasIndustry: false,
		hasInfo: false,
		locale: "en",
		_hasBeenSniffed: false,
		_hasBeenFinalized: false,
		_templatesLocale: null
	},

	type: "parallel",

	states: {
		flow: {
			id: "flow",
			initial: "uninitialized",

			states: {
				uninitialized: {
					on: {
						"": [
							{
								target: "start",
								cond: "isTemporary"
							},
							{
								target: "industry",
								cond: "hasNoIndustry",
								actions: [raise("CHECK_WEBSITE")]
							},
							{
								target: "objective",
								cond: "hasNoInfo",
								actions: [raise("CHECK_WEBSITE")]
							},
							{
								target: "objective"
							}
						]
					}
				},

				start: {
					on: {
						START: "industry"
					},
					meta: {
						route: "start",
						signup: {
							step: CurrentStep.START,
							steps: TOTAL_STEPS
						}
					}
				},

				industry: {
					on: {
						BACK: [{
							target: "start",
							cond: "isTemporary"
						}],
						NEXT: "objective",
						INFO_CHANGED: [{
							actions: [assign({
								_hasBeenFinalized: false
							})]
						}]
					},
					meta: {
						route: "industry",
						signup: {
							step: CurrentStep.INDUSTRY,
							steps: TOTAL_STEPS
						}
					}
				},

				objective: {
					on: {
						BACK: [
							{
								target: "industry",
								cond: "isTemporary"
							},
							{
								target: "industry",
								cond: "hasNoIndustry"
							}
						],
						NEXT: [
							{
								target: "confirm",
								cond: "hasNoInfo"
							},
							{
								target: "finalizing",
								cond: "needFinalizing"
							},
							{
								target: "preview"
							}
						],
						BROWSE_ALL_TEMPLATES: [{
							target: "template manager",
							cond: "isNotTemporary"
						}],
						OBJECTIVE_CHANGED: [{
							actions: [assign({
								_hasBeenFinalized: false
							})]
						}]
					},
					meta: {
						route: "objective",
						signup: {
							step: CurrentStep.OBJECTIVE,
							steps: TOTAL_STEPS
						}
					}
				},

				confirm: {
					initial: "uninitialized",
					states: {
						uninitialized: {
							on: {
								"": [
									{
										target: "loading",
										cond: "hasNotBeenSniffed"
									},
									{
										target: "display"
									}
								]
							}
						},

						loading: {
							on: {
								WEBSITE_LOADED: "display",
								WEBSITE_ERROR: "display"
							}
						},

						display: {
							on: {
								NEXT: [
									{
										target: "#flow.finalizing",
										cond: "needFinalizing"
									},
									{
										target: "#flow.preview"
									}
								]
							}
						}
					},
					on: {
						BACK: "objective",
						INFO_CHANGED: [{
							actions: [assign({
								_hasBeenFinalized: false
							})]
						}],
						BROWSE_ALL_TEMPLATES: [{
							target: "template manager",
							cond: "isNotTemporary"
						}]
					},
					meta: {
						route: "confirm",
						signup: {
							step: CurrentStep.CONFIRM,
							steps: TOTAL_STEPS
						}
					}
				},

				finalizing: {
					on: {
						DONE: [{
							target: "preview",
							actions: [assign({
								_hasBeenFinalized: true
							})]
						}],
						ERROR: [
							{
								target: "ready",
								cond: "isTemporary"
							},
							{
								target: "create"
							}
						]
					},
					entry: [assign({
						_templatesLocale: (context) => context.locale
					})],
					meta: {
						route: "finalizing",
						signup: {
							step: CurrentStep.FINALIZING,
							steps: TOTAL_STEPS
						}
					}
				},

				preview: {
					on: {
						BACK: [
							{
								target: "confirm",
								cond: "hasNoInfo"
							},
							{
								target: "objective"
							}
						],
						NEXT: [
							{
								target: "ready",
								cond: "isTemporary"
							},
							{
								target: "create"
							}
						],
						BROWSE_ALL_TEMPLATES: [{
							target: "template manager",
							cond: "isNotTemporary"
						}]
					},
					meta: {
						route: "preview",
						signup: {
							step: CurrentStep.PREVIEW,
							steps: TOTAL_STEPS
						}
					}
				},

				ready: {
					on: {
						BACK: [
							{
								target: "confirm",
								cond: "hasNotBeenFinalized"
							},
							{
								target: "preview"
							}
						],
						CREATE: [{
							target: "campaign"
						}]
					},
					meta: {
						route: "ready"
					}
				},

				create: {
					on: {
						BACK: [
							{
								target: "objective",
								cond: "hasNotBeenFinalizedAndHasInfo"
							},
							{
								target: "confirm",
								cond: "hasNotBeenFinalized"
							},
							{
								target: "preview"
							}
						],
						CREATE: [{
							target: "campaign"
						}]
					},
					meta: {
						route: "create"
					}
				},

				campaign: {
					type: "final",
					entry: ["finalizeFlow"]
				},

				"template manager": {
					type: "final",
					entry: ["redirectToTemplateManager"]
				}
			},
			on: {
				SWITCH_LOCALE: [{
					target: undefined,
					actions: ["switchLocale"]
				}]
			}
		},

		sniffer: {
			initial: "idle",

			states: {
				idle: {
					on: {
						WEBSITE_CHANGED: "loading",
						CHECK_WEBSITE: [{
							target: "loading",
							cond: "hasNotBeenSniffed"
						}]
					}
				},

				loading: {
					on: {
						WEBSITE_LOADED: [{
							target: "idle",
							actions: [assign({
								_hasBeenSniffed: true
							})]
						}],
						WEBSITE_ERROR: [{
							target: "idle",
							actions: [assign({
								_hasBeenSniffed: true
							})]
						}],
						WEBSITE_CHANGED: "loading"
					},
					entry: [
						"sniffWebsite",
						assign({
							_hasBeenSniffed: false
						})
					]
				}
			}
		}
	}
}, {
	actions: {
		finalizeFlow: (context) => {
			if (context.component) {
				context.component.finalizeFlow();
			}
		},
		redirectToTemplateManager: (context) => {
			if (context.component) {
				context.component.redirectToTemplateManager();
			}
		},
		sniffWebsite: (context) => {
			if (context.component) {
				context.component.sniffWebsite();
			}
		},
		switchLocale: assign({
			locale: (context, event) => {
				if (event.locale) {
					return event.locale;
				}

				if (context.locale === "fr") {
					return "en";
				}

				return "fr";
			}
		})
	},
	guards: {
		isTemporary: (context) => context.isTemporary,
		isNotTemporary: (context) => !context.isTemporary,
		hasIndustry: (context) => context.hasIndustry,
		hasNoIndustry: (context) => !context.hasIndustry,
		hasInfo: (context) => context.hasInfo,
		hasNoInfo: (context) => !context.hasInfo,
		hasBeenSniffed: (context) => context._hasBeenSniffed,
		hasNotBeenSniffed: (context) => !context._hasBeenSniffed,
		hasBeenFinalized: (context) => context._hasBeenFinalized,
		hasNotBeenFinalized: (context) => !context._hasBeenFinalized,
		needFinalizing: (context) => !context._hasBeenFinalized || context.locale !== context._templatesLocale,
		hasNotBeenFinalizedAndHasInfo: (context) => !context._hasBeenFinalized && context.hasInfo
	}
});