TI-Client App
Last updated
Was this helpful?
Last updated
Was this helpful?
Client App creates a Flow that the Customer App uses to provide End-User experiences. This guided Flow - experience is made possible by TI-Framework SDK in the Customer App and TI-Server.
TI-Client app is implemented in Angular. Please refer to the individual sections below to understand the design. are used to define and implement the behavior needed for creating Task/Stage/Flow and initiating Flow. are designed to abstract and simplify the signaling between the app, SDK and server. declares interfaces to enforce data types when the Components and Services interact with each other or with the SDK/TI-Server. are passed when delegating the functionality from app to SDK, so that app can receive updates(app listens to updates).
Components implement all the functionality to create client app's UI, without communicating directly with SDK or TI-Server. Read below to get a quick understading of different components available in TI-Client app.
TaskComponent is responsible for creating a new Task and retrieving all the existing Tasks from TI-Server.
StageComponent is responsible for creating a new Stage. Some useful methods when creating a new Stage like the addition or removal of Tasks are implemented here. StageComponent is also responsible for retrieving all the existing Stages and all the existing Tasks in each Stage from TI-Server.
FlowComponent s responsible for creating a new Flow. Some useful methods when creating a new Flow like the addition or removal of Stages are implemented here. FlowComponent is also responsible for retrieving all the existing Flows and all the existing Stages in each Flow from TI-Server.
The InitiateComponent is responsible for starting a Flow and other UI experience related to Flow updates until the Flow is completed. it depends on appservice to perform all operations that need communication with the TI-Server.
DatadisplayComponent is a child view available as part of InitiateComponent and displays all the interaction data received from the TI-Customer app.
AlertComponent is used throughout the app to display useful alerts or notifications on client app. It is usually consumed by other components as a child view. It accepts string parameters to display a custom message and AlertType.
NavbarComponent contains a user experience implementation that persists across all the client app screens, and provides access to all the other components involved in creating Task/Stage/Flow or InitiateComponent.
FlowComplete component to display an alert that active Flow is now completed and that session no longer exists.
AppService is a single stop for all the components that need to communicate with SDK or TI-Server. Eg: creating or fetching Tasks/Stages/Flows, connecting to SDK to bring up communication channels with the TI-Server to initiate a Flow, receive Flow updates, and send/receive interaction data.
ClientFlowListener is sent by InitiateComponent to AppService, to receive updates on Flow. Eg; when Session has an update or completed etc. AppService sends this to the SDK to be called above mentioned update events.
ClientDataInterface is sent by AppService to SDK to receive interaction updates, like when the interaction is available, disconnected, data received from customer app, etc.
All the data types needed in the client app related to Flow functionality are directly imported from the t SDK.
As mentioned in the customer app guide, use client app to create the Task. It's important to note that the ControllerName you input for Task creation must be the class name of your custom component. Once Task is created, add to any of the desirable Stages in the Flow.
Use as an example of how to create and fetch required data. Always use AppService to talk to the SDK and pass to receive Flow and interaction updates.