Design pattern –- Routing between flows

  

OVERVIEW

You can route your user to a different flow, from within a flow.

Here is the design pattern in action: https://flow.boomi.com/36f7b1b2-81b1-4806-a5af-820c0e9a764e/play/default/?flow-id=be311e1b-a1fd-4c3c-90b4-4f06289a2e57

Here is a use case… Say, you want to build an app for employee on-boarding. Once a new employee joins, there are several things that need to happen simultaneously; she needs to be given an email/password and entered into the company email system, she needs to be assigned a desk, she needs to be requisitioned a telephone/new computer, payroll needs to add her, her benefit details need to be confirmed, and so on, and so forth. If you create a new flow for each of these processes, it becomes easier to manage dependencies; HR can complete their part without waiting for IT, for example.

BUILDING THE APP

Building an app that routes control between two flows is easy. If you have around 20 minutes, you can see right now how to do this! Let’s build the app together.

You will build two flows, and connect them with a message action. The routing between the flows will be done via outcomes

This is what the canvas will look like when you are done:

What you will need:

Let’s get building then!


WORKING ON THE SECOND FLOW

You will start with creating the second flow first; so you can use the Flow ID of this flow in the first flow.

  1. Create a new flow called Second flow.
  2. Create a step with the name Welcome to the new flow and content This is the second flow.
  3. Create an outcome called Go connecting the Start element with the Step element.
  4.  Go ahead and import the ManyWho Runtime service to your flow.
  5. You are going to be publishing the flow next.
  6. Copy-paste the Flow ID of the flow to your favorite editor. You are going to be using this in two shakes of a lamb’s tail.

WORKING ON THE FIRST FLOW

  1. Create a new flow called First flow.
  2. Import the ManyWho Runtime service to your flow.
  3. Create a step with the name Welcome to the first flow and content This is the first flow.
  4. Connect the Start element and the Step element with an outcome called Go.
  5. Let us create the message action now. This is how you will switch the execution path from the first flow to the second flow. Drag a Message element from the sidebar to the canvas under the Step element.

    This opens a configuration panel.
  6. Copy-paste the text Start the second flow in the Name text field.
  7. Click New Message Action to open the Message Action panel.
  8. Select the ManyWho Runtime service as the service to send the message.

    This shows the available message actions.
  9. Select the Execute Flow action.

    This opens the Message Action screen.
  10. Click Select or create a new Value for FlowID in Inputs.
  11. Click Create a new Value.
  12. In the Name field for the value, copy-paste Flow ID – Second flow.
  13. The What kind of Value is this field should be String.
  14. Copy-paste the Flow ID from the first flow you created earlier in the Default Value field. Make sure there are no trailing spaces.
  15. Click Save.

    This saves the Flow ID as the default value for the FlowId field.
  16. Click Select or create a new Value for PassMatchingValuesIntoFlow.
  17. Search for and select the $True Boolean value.

    This populates PassMatchingValuesIntoFlow with $True.
  18. Next up. Outputs! Click Select or create a new Value for State.
  19. Click Create a new Value.
  20. In the Name field type State – Second flow.
  21. The What kind of Value is this field should be Object.
  22. Click Select a Type.
  23. Search for and select State.

    This is what the configuration looks like now:
  24. Click Save to save the value. This is what the configuration looks like now:
  25. Click Apply Message Action.
  26. Click Save Message.

    This is what the canvas looks like now:
  27. Drag a Step element to the canvas next to the message.

    This opens a configuration panel.
  28. Copy-paste Second flow – details in the Name field.
  29. In the content editor copy-paste the text Here is some information about the second flow you just started.
  30. In the next line, copy-paste Join here:.
  31. Click Insert Value.
  32. Select the State – Second flow /JoinURI value.
  33. Copy-paste the text Process started:
  34. Click Insert Value again.
  35. Select the State – Second flow / Date Created value. This is what the screen looks like now:
  36. Click Save Step. This is what the canvas looks like now:
  37. You are almost done! Drag a Step element into the canvas next to the Welcome to the first flow step.
  38. Copy-paste First flow – Next screen in the Name field.
  39. In the content editor, copy-paste This is the next screen of the first flow.
  40. Click Save Step.

    This is what the screen looks like now:
  41. Done! All that is left for us now is to connect the dots, or in Flowspeak; creating the outcomes. Create an outcome from Welcome to the first flow step to Start the second flow called Let the second flow begin.
  42. Create an outcome from Start the second flow to Second flow – details called Go. This is what the canvas looks like now:
  43. Create an outcome from Second flow – details to First flow – Next screen called See next screen in the first flow. This is what the canvas looks like now:
  44. Create an outcome from First flow – Next screen to Welcome to the first flow called Back. This is what the canvas looks like now:
  45. Create an outcome from Welcome to the first flow to First flow – Next screen called Next screen in the first flow.
  46. Click the Publish icon to publish the flow.

APPCHIEVEMENT

Let us run the app now, and see what happens.

This is what the first screen of the app looks like:

Let’s click the LET THE SECOND FLOW BEGIN button. This starts executing the second flow:

Click the button.. You are back to the first flow

Click Back.. and you are back to the beginning. You can go to the second flow again, if you like, from here.


DOWNLOADS

Want to try out the design pattern in your tenant? We have you covered!