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 app = Machine({
  id: 'root',
  states: {
    Shell: {
      id: 'Shell',
      states: {
        Dashboard: {
          id: 'Dashboard',
          states: {
            Loading: {
              id: 'Loading',
              states: {},
              on: { Failure: '#Unable to Load', Success: '#Authenticating' },
            },
            'Unable to Load': {
              id: 'Unable to Load',
              states: {},
              on: { Retry: '#Loading' },
            },
            Authenticating: {
              id: 'Authenticating',
              states: {
                'Checking Credentials': {
                  id: 'Checking Credentials',
                  states: {},
                  on: {
                    'Credentials Exist': '#Verify Credentials',
                    'No Credentials': '#Login',
                  },
                },
                'Verify Credentials': {
                  id: 'Verify Credentials',
                  states: {},
                  on: { 'Invalid or expired': '#Login', Valid: '#Dashboard' },
                },
                Login: {
                  id: 'Login',
                  states: {
                    'Needs Credentials': {
                      id: 'Needs Credentials',
                      states: {},
                      on: { 'Valid email': '#Ready?' },
                    },
                    'Ready?': {
                      id: 'Ready?',
                      states: {},
                      on: {
                        'Email and password not ready?': '#Needs Credentials',
                        'Email and password valid?': '#Ready',
                      },
                    },
                    Ready: {
                      id: 'Ready',
                      states: {},
                      on: { Submit: '#Submitting' },
                    },
                    Submitting: {
                      id: 'Submitting',
                      states: {},
                      on: {
                        'Login Failure': '#Login Error',
                        'Login Success': '#Authenticated',
                      },
                    },
                    'Login Error': {
                      id: 'Login Error',
                      states: {},
                      on: {
                        'Clear Error': '#Needs Credentials',
                        Retry: '#Submitting',
                      },
                    },
                    Email: {
                      id: 'Email',
                      states: {
                        'Content email': {
                          id: 'Content email',
                          states: {
                            'Empty email': {
                              id: 'Empty email',
                              states: {},
                              on: { 'Input email': '#Validating email?' },
                            },
                            'Validating email?': {
                              id: 'Validating email?',
                              states: {},
                              on: {
                                'Invalid email': '#Invalid email',
                                'Valid email': '#Valid email',
                              },
                            },
                            'Valid email': {
                              id: 'Valid email',
                              states: {},
                              on: {
                                'Clear email': '#Empty email',
                                'Input email': '#Validating email?',
                              },
                            },
                            'Invalid email': {
                              id: 'Invalid email',
                              states: {},
                              on: {
                                'Clear email': '#Empty email',
                                'Input email': '#Validating email?',
                              },
                            },
                          },
                          initial: 'Empty email',
                          on: {},
                        },
                        'Focus email': {
                          id: 'Focus email',
                          states: {
                            'Unfocused email': {
                              id: 'Unfocused email',
                              states: {},
                              on: { 'Focus email': '#Focused email' },
                            },
                            'Active email': {
                              id: 'Active email',
                              states: {},
                              on: { 'Idle email': '#Focused email' },
                            },
                            'Focused email': {
                              id: 'Focused email',
                              states: {},
                              on: {
                                'Blur email': '#Unfocused email',
                                'Input email': '#Active email',
                              },
                            },
                          },
                          initial: 'Unfocused email',
                          on: {},
                        },
                      },
                      parallel: true,
                      on: {},
                    },
                    Password: {
                      id: 'Password',
                      states: {
                        'Content password': {
                          id: 'Content password',
                          states: {
                            'Empty password': {
                              id: 'Empty password',
                              states: {},
                              on: { 'Input password': '#Validating password?' },
                            },
                            'Validating password?': {
                              id: 'Validating password?',
                              states: {},
                              on: {
                                'Invalid password': '#Invalid password',
                                'Valid password': '#Valid password',
                              },
                            },
                            'Valid password': {
                              id: 'Valid password',
                              states: {},
                              on: {
                                'Clear password': '#Empty password',
                                'Input password': '#Validating password?',
                              },
                            },
                            'Invalid password': {
                              id: 'Invalid password',
                              states: {},
                              on: {
                                'Clear password': '#Empty password',
                                'Input password': '#Validating password?',
                              },
                            },
                          },
                          initial: 'Empty password',
                          on: {},
                        },
                        'Focus password': {
                          id: 'Focus password',
                          states: {
                            'Unfocused password': {
                              id: 'Unfocused password',
                              states: {},
                              on: { 'Focus password': '#Focused password' },
                            },
                            'Active password': {
                              id: 'Active password',
                              states: {},
                              on: { 'Idle password': '#Focused password' },
                            },
                            'Focused password': {
                              id: 'Focused password',
                              states: {},
                              on: {
                                'Blur password': '#Unfocused password',
                                'Input password': '#Active password',
                              },
                            },
                          },
                          initial: 'Unfocused password',
                          on: {},
                        },
                      },
                      initial: 'Content password',
                      on: {},
                    },
                  },
                  parallel: true,
                  on: {},
                },
              },
              initial: 'Checking Credentials',
              on: {},
            },
            Authenticated: {
              id: 'Authenticated',
              states: {
                Notes: {
                  id: 'Notes',
                  states: {
                    'Editing note': { id: 'Editing note', states: {} },
                    'Notes Content': {
                      id: 'Notes Content',
                      states: {
                        'No note content': {
                          id: 'No note content',
                          states: {},
                          on: { 'Add note content': '#Some note content' },
                        },
                        'Some note content': {
                          id: 'Some note content',
                          states: {},
                          on: { 'Remove note content': '#Any note content?' },
                        },
                        'Any note content?': {
                          id: 'Any note content?',
                          states: {},
                          on: {
                            'No note content?': '#No note content',
                            'Some note content?': '#Some note content',
                          },
                        },
                      },
                      initial: 'No note content',
                      on: {},
                    },
                    'Note Fetch': {
                      id: 'Note Fetch',
                      states: {
                        Pending: { id: 'Pending', states: {} },
                        Fetching: { id: 'Fetching', states: {} },
                        Idle: { id: 'Idle', states: {} },
                        Error: { id: 'Error', states: {} },
                      },
                      initial: 'Pending',
                      on: {},
                    },
                  },
                  parallel: true,
                  on: {},
                },
                'First Run Experience': {
                  id: 'First Run Experience',
                  states: {
                    'Required?': {
                      id: 'Required?',
                      states: {},
                      on: {
                        'First run?': '#Introduction',
                        'Previously completed?': '#Done',
                      },
                    },
                    Introduction: {
                      id: 'Introduction',
                      states: {},
                      on: {
                        'Consent to prompts': '#Prompts',
                        'Decline prompts': '#Done',
                      },
                    },
                    Prompts: {
                      id: 'Prompts',
                      states: {
                        'Drafts Prompt': { id: 'Drafts Prompt', states: {} },
                        'Collections Prompt': {
                          id: 'Collections Prompt',
                          states: {},
                        },
                        'Products Prompt': {
                          id: 'Products Prompt',
                          states: {},
                        },
                        'Feed Prompt': { id: 'Feed Prompt', states: {} },
                        'Accounts Prompt': {
                          id: 'Accounts Prompt',
                          states: {},
                        },
                        'Connections Prompt': {
                          id: 'Connections Prompt',
                          states: {},
                        },
                      },
                      parallel: true,
                      on: {},
                    },
                    Done: { id: 'Done', states: {} },
                  },
                  initial: 'Required?',
                  on: {},
                },
                Inbox: {
                  id: 'Inbox',
                  states: {
                    'New messages': { id: 'New messages', states: {} },
                    'No new messages': { id: 'No new messages', states: {} },
                    Zero: { id: 'Zero', states: {} },
                  },
                  initial: 'New messages',
                  on: {},
                },
                Notifications: {
                  id: 'Notifications',
                  states: {
                    None: { id: 'None', states: {} },
                    Some: { id: 'Some', states: {} },
                  },
                  initial: 'None',
                  on: {},
                },
              },
              parallel: true,
              on: {},
            },
          },
          initial: 'Loading',
          on: {},
        },
      },
      parallel: true,
      initial: 'Dashboard',
      on: {},
    },
  },
  initial: 'Shell',
  on: {},
});