🗡️
ConanJs
  • What is ConanJs?
  • Why ConanJs...
    • ... if coming from Redux
    • ... if using vanilla React
    • ... if learning React
    • ... if not using React
  • How to install/use ConanJs
  • About us / Github / Contact us
  • Demos
    • Demo Gallery
    • Conan State Demos
      • Hello World
      • Todos
        • Todos - Basic
        • Todos - Async
        • Todos - Optimistic
      • Github issues viewer
    • Conan Flow Demos
      • Authentication
  • CONAN DATA
    • General Concepts
    • Conan State
      • Actions & Reducers
        • Reducers
        • Actions
      • Creating State
      • Observing State
        • Live rendering
        • Connecting
      • Composing State
      • Scaling State
      • Orchestrating State
      • Life cycle
        • Async handling
        • Introspection
      • Testing state
    • Conan Flow
      • Creating Flows
      • Serialising Flows
      • Observing Flows
  • CONAN Runtime
  • Dependency Injection
    • General Concepts
    • Creating the Context
    • Using the Context
  • ASAPs
  • Logging
  • API
    • Main Classes
      • Conan
        • StateDef
      • ConanState
      • ConanFlow
        • UserFlowDef
        • UserStatusDef
        • Status
    • Conan State Classes
      • Thread
      • ConnectedState
      • MonitorInfo
      • MetaInfo
    • Dependency Injection
      • DiContextFactory
    • ASAPS
      • Asaps
      • Asap
Powered by GitBook
On this page
  • Introduction
  • Statuses
  • Definition
  • Reactions / Steps / Transitions
  • Initial Status

Was this helpful?

  1. CONAN DATA
  2. Conan Flow

Creating Flows

PreviousConan FlowNextSerialising Flows

Last updated 4 years ago

Was this helpful?

Introduction

You can create a object, by using the method which takes a .

In summary a UserFlowDef receives:

  • name: The name of the flow.

  • statuses: A JS object where each key represents the name of the status, and each value represents the status definition (). In the status definition we can optionally specify any of these properties:

    • Reactions. An array of callbacks to execute as soon as this status is reached.

    • Transitions: The available functions that can be executed while the Flow is on this status and that will cause the flow to move to a different status (Transitions and is explained below in detail). Note that you always can transition to a different status using the default transition $toStatus.

    • Steps.The available functions that can be executed while the Flow is on this status and that will cause the flow to move to a different state (this is explained below in detail)

Conan.flow({
    name: 'authentication',
    statuses: {
        notAuthenticated: {},
        authenticated: {},
        authenticating: {
            reactions: [
                onAuthenticating => {
                    let valid = DummyAuthenticator.authenticate(onAuthenticating.getData()[1]);
                    const nextStatus = valid ? {
                        name: "authenticated" as any,
                        data: "TOKEN"
                    } : {name: "authenticationFailed"};
                    setTimeout(() => onAuthenticating.do.$toStatus(nextStatus), 2000);
                }
            ],
        },
        authenticationFailed: {
            reactions: [
                onAuthenticationFailed => setTimeout(() => onAuthenticationFailed.do.$toStatus("notAuthenticated"), 2000)
            ],
        }
    },
    initialStatus: {
        name: 'notAuthenticated',
    }
})

Statuses

Definition

The key element for a flow is the statuses that defines it. In the case of the example for the authentication flow, the statuses are:

notAuthenticated, authenticated, authenticating, authenticationFailed

The initial status (the status the flow starts with after it has been created is)

notAuthenticated

Reactions / Steps / Transitions

Each status can also receive:

  • Reactions: Logic to execute every time a new state is provided on this status.

  • Steps. The available methods to generate new states for this status

  • Transitions. The available methods to transition to different status from this status.

You can also decide to only pass an empty object as the configuration for the status, when you do this, the status will be created with no reactions/steps or transitions.

This is the case in the example for the statuses: notAuthenticated and authenticated.

Initial Status

A flow also has an initial status.

You need to specify two things for the initial status:

  • name: [mandatory] It should match the name of one of the defined statuses

  • data: [optional] The initial state for that status.

You can see this in our

We would recommend reading about the for Conan Data before deep diving into understanding the statuses for a flow.

To define all the statuses, you need to provide a key value pair to the property where each key is the name of the status.

To see how to use Conan Flows after they have been created, check our next section to see how to .

Conan Flow
Conan.flow
UserFlowDef
UserStatusDef
Authentication demo
general concepts
UserFlowDef.statuses
serialise them into different Conan States