Flow JS Type Definition
All of Frigade’s Javascript SDKs share the same Flow type definition which is defined in the Frigade JS SDK.
The Flow object is the main object that models a Flow’s static metadata (title, subtitle, steps, etc.) as well as the current user’s state in this flow.
It contains all the data and methods needed to build custom components with Frigade and to interact with the Frigade API without writing a single custom network call.
Properties
Accessors
config
config: FrigadeConfig
id
id: string
The Flow’s ID.
isCompleted
isCompleted: boolean
Whether the Flow is completed or not.
isSkipped
isSkipped: boolean
Whether the Flow has been skipped or not.
isStarted
isStarted: boolean
Whether the Flow is started or not.
rawData
rawData: StatefulFlow
The raw metadata of the Flow. Contains all properties defined in the Flow’s YAML config as well as the current state of the Flow. Generally this should only be used when building custom components to access custom high-level props on the Flow.
steps
steps: Map<string, FlowStep>
Ordered map of the Steps in the Flow. See Flow Step Definition for more information.
subtitle
Optional subtitle: string
The user-facing description of the Flow, if defined at the top level of the YAML config.
title
Optional title: string
The user-facing title of the Flow, if defined at the top level of the YAML config.
type
type: FlowType
The type of the Flow such as TOUR or CHECKLIST.
Accessors
isVisible
get isVisible(): boolean
Whether the Flow is visible to the user based on the current user/group’s state.
This function will return false if the user has already completed or dismissed the Flow or if the user
does not match the Flow’s targeting/audience.
set isVisible(visible): void
| Name | Type |
|---|---|
visible | boolean |
Methods
applyVariables
▸ applyVariables(variables): void
Apply variables to the flow. This will replace any ${variable} in the title, subtitle, and step fields with the value of the variable.
| Name | Type | Description |
|---|---|---|
variables | Record<string, any> | A record of variables to apply to the flow. |
back
▸ back(properties?): Promise<void>
Navigates the flow to the previous step if one exists. This will mark that step started, but will not complete the previous step.
Parameters| Name | Type |
|---|---|
properties? | PropertyPayload |
complete
▸ complete(properties?): Promise<void>
Marks the flow completed
Parameters| Name | Type |
|---|---|
properties? | PropertyPayload |
forward
▸ forward(properties?): Promise<void>
Navigates the flow to the next step if one exists. This will mark that step started, but will not complete the previous step.
Parameters| Name | Type |
|---|---|
properties? | PropertyPayload |
getCurrentStep
▸ getCurrentStep(): FlowStep
Gets current step. If the current step is not visible, it will return the first visible step after it. If no steps are visible, it will return undefined.
getCurrentStepIndex
▸ getCurrentStepIndex(): number
Get the index of the current step. Starts at 0
getCurrentStepOrder
▸ getCurrentStepOrder(): number
Returns the current step’s order based on the number of available steps. Works similar to getCurrentStepIndex but takes into account hidden steps due to visibilityCriteria.
getNumberOfAvailableSteps
▸ getNumberOfAvailableSteps(): number
Get the number of available steps for the current user in the current flow. This is the number of steps that are not hidden.
getNumberOfCompletedSteps
▸ getNumberOfCompletedSteps(): number
Get the number of completed steps for the current user in the current flow
getProgress
▸ getProgress(): number
Get the progress of the flow as a number between 0 and 1. Useful when rendering a progress bar.
getStepByIndex
▸ getStepByIndex(index): FlowStep
Get a step by index
Parameters| Name | Type |
|---|---|
index | number |
register
▸ register(callback?): void
| Name | Type |
|---|---|
callback? | CollectionsRegistryCallback |
reload
▸ reload(): void
Reload the Flow data from the server
restart
▸ restart(): Promise<void>
Restarts the flow/marks it not started
sendFlowStateToAPI
▸ sendFlowStateToAPI(action, data?, stepId?): Promise<void>
| Name | Type |
|---|---|
action | FlowActionType |
data? | PropertyPayload |
stepId? | string |
skip
▸ skip(properties?): Promise<void>
Marks the flow skipped
Parameters| Name | Type |
|---|---|
properties? | PropertyPayload |
start
▸ start(properties?): Promise<void>
Marks the flow started
Parameters| Name | Type |
|---|---|
properties? | PropertyPayload |
unregister
▸ unregister(): void