Salesforce Screen Flow - Wait/Sleep Lightning Component
Flow Element: Pause for a Screen Flow
We cannot use the Pause element in a Screen Flow, and there are use cases where we might need the user to wait some seconds before he/she can continue working with the Flow.
Even if you can use a Pause element (for instance, calling an auto-launched sub-flow that Pauses the execution), once the Pause element is executed, the main Screen Flow receives a message like "The flow interview is now waiting. It will resume in the background later", and later means in the next 10-15 minutes. In other words, the user may have to wait 10-15 minutes to continue working with our Screen Flow! Not a nice user experience, don't you agree?
Let's say we have a situation where we need to execute a background process (like an Apex batch job or a call to an external application that should do something a return) and in the next step, we need the output of the background process.
The problem here is that it should be a smooth, only screens user experience. And not a call to a future method or an asynchronous path in the flow.
In my case, it was the creation of an S-Doc Job record (for those of you that doesn't know S-Doc, you can check here). This action will create a job that creates a document based on the selected S-Doc template. The action will last for some seconds only.
Flow Element: Wait/Sleep
Then we need to wait on the screen for some seconds (in the same way we wait on a Visualforce Page using Ajax). And to do this I created a Lightning Aura Screen Component.
The keys to doing this component for a Screen Flow are:
- The window.setTimeout JavaScript function, and ...
- The Navigation functionality of a Screen Flow Component.
The Component
OV_Flow_Wait.cmp
<aura:attribute name="seconds" type="integer" default="8"/>
<aura:attribute name="message" type="string" default="Wait 8 seconds"/>
<aura:attribute name="secondary_message" type="string" default="Do not click Next or Previous"/>
<aura:handler name="init" value="{!this}" action="{!c.onInit}" />
<div class="slds-m-around_xx-large" width="100%">
<p style="white-space: nowrap; display: flex; align-items: center; justify-content: center; margin: auto;">
{!v.message}
</p>
<p style="white-space: nowrap; display: flex; align-items: center; justify-content: center; margin: auto;">
{!v.secondary_message}
</p>
<lightning:spinner alternativeText="Wait" size="medium" variant="brand"/>
</div>
</aura:component>
OV_Flow_Wait.design
<design:attribute name="seconds" label="Seconds" description="Number of seconds to wait"/>
<design:attribute name="message" label="Message" description="Main wait message"/>
<design:attribute name="secondary_message" label="Secondary Message" description="Secondary message"/>
</design:component>
OV_Flow_Wait.js
onInit : function(component, event, helper)
{
var seconds = component.get("v.seconds");
window.setTimeout(
$A.getCallback(function()
{
var navigate = component.get("v.navigateFlow");
navigate('NEXT');
}), 8000
);
}
})
How to use it?
Just create a Screen element and add the component to it, nothing else!
Check the window.setTimeout will wait for 8 seconds, but we can change it to use the v.seconds attribute.
The steps on your Flow should be:
- Execute the background operation.
- Create a Screen element with the Wait component only.
- Validate whether the background operation is finished or returned.
- If not OK, go back to 2.
Wrap-up
A simple solution without using Apex code!
And I have to reckon that the example shown here doesn't have a very simple check: what happens if the operation never ends, failed, or returns? This wait situation can be forever.
In this case, you can add for instance a counter that will control that the Wait Screen will not be visited more than 3 times or the number of times that suits your problem. In any case, it's a Screen Flow!, the user can close it at will.
I hope this very simple "only Flow" solution can help you, enjoy it and please leave your comments!
Comments
Post a Comment