Skip to content

Instantly share code, notes, and snippets.

@adriantoine

adriantoine/machine.js

Created May 13, 2020 09:22
Show Gist options
  • Save adriantoine/0dd0e92e8ebc67b288e9c4ed2cfe6932 to your computer and use it in GitHub Desktop.
Save adriantoine/0dd0e92e8ebc67b288e9c4ed2cfe6932 to your computer and use it in GitHub Desktop.
Download ZIP
Generated by XState Viz: https://xstate.js.org/viz
Raw
machine.js
const fetchMachine = Machine({
id: 'applicant-details',
initial: 'loading',
context: {
applicationId: '',
applicantId: '',
fields: {},
checked: {},
originalIncomeData: [],
},
states: {
loading: {
invoke: {
src: 'load',
id: 'load',
onDone: {
target: 'editing',
actions: 'updateInitial',
},
},
},
editing: {
type: 'parallel',
states: {
open_panel: {
initial: 'initial_check',
on: {
TOGGLE_INCOME: '.income',
TOGGLE_EXPENDITURE: '.expenditure',
TOGGLE_DEBTS: '.debts',
},
states: {
initial_check: {
on: {
'': [
{
cond: 'hasInitialData',
target: 'none',
},
{target: 'income'},
],
},
},
none: {},
income: {
on: {
TOGGLE_INCOME: 'none',
COMPLETE_INCOME: 'expenditure',
},
},
expenditure: {
on: {
TOGGLE_EXPENDITURE: 'none',
COMPLETE_EXPENDITURE: 'debts',
},
},
debts: {
on: {
TOGGLE_DEBTS: 'none',
COMPLETE_DEBTS: 'none',
},
},
},
},
income: {
type: 'parallel',
states: {
validation: {
initial: 'check',
on: {
CHECK: {target: '.check', actions: 'checkSection'},
CHECK_NONE: {target: '.check', actions: 'checkSection'},
CHANGE_FIELD: {target: '.check', actions: 'fieldChange'},
},
states: {
check: {
on: {
'': [
{target: 'valid', cond: 'isIncomeValid'},
{target: 'not_valid'},
],
},
},
valid: {},
not_valid: {},
},
},
completion: {
initial: 'initial_check',
states: {
initial_check: {
on: {
'': [
{
cond: 'hasInitialData',
target: 'done',
},
{target: 'not_done'},
],
},
},
not_done: {
on: {
COMPLETE_INCOME: 'done',
},
},
done: {},
},
},
},
},
expenditure: {
type: 'parallel',
states: {
validation: {
initial: 'check',
on: {
CHECK: '.check',
CHECK_NONE: '.check',
CHANGE_FIELD: '.check',
},
states: {
check: {
on: {
'': [
{target: 'valid', cond: 'isExpenditureValid'},
{target: 'not_valid'},
],
},
},
valid: {},
not_valid: {},
},
},
completion: {
initial: 'initial_check',
states: {
initial_check: {
on: {
'': [
{
cond: 'hasInitialData',
target: 'done',
},
{target: 'not_done'},
],
},
},
not_done: {on: {COMPLETE_EXPENDITURE: 'done'}},
done: {},
},
},
},
},
debts: {
type: 'parallel',
states: {
validation: {
initial: 'initial',
on: {
HAS_DEBTS_YES: '.has_debts',
HAS_DEBTS_NO: '.no_debts',
},
states: {
initial: {},
no_debts: {},
has_debts: {
initial: 'check',
on: {
DEBTS_FIELD_CHANGE: {
target: '.check',
actions: 'updateDebtsField',
},
},
states: {
check: {
on: {
'': [
{target: 'valid', cond: 'isDebtFieldValid'},
'not_valid',
],
},
},
valid: {},
not_valid: {},
},
},
},
},
completion: {
initial: 'not_done',
on: {COMPLETE_DEBTS: '.done'},
states: {not_done: {}, done: {}},
},
},
},
},
},
saving: {},
},
},
{
actions: {
updateInitial: () => {},
},
guards: {
hasInitialData: () => false,
isIncomeValid: () => false,
isExpenditureValid: () => false
},
services: {
load: () => Promise.resolve()
},
},
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment