cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

Flow Customer Services: Front

Flow Customer Services: Front

Front, the shared inbox for teams, allows your customer service team to handle all the conversations that your Flow bot is unable to handle.

 

Screenshot 2021-05-04 at 7.51.00 PM.png

Installation

 

 

Following the steps below, you can integrate the Front application with a Flow project.

Prerequisites

You must have a working Front's Plus plan or above with admin rights. In order to receive messages in Front you will need to add a handover action within your flow design.

Add the integration

Select the project to which you would like to connect Front using the top left drop-down menu.

MeghaD_0-1622115647017.png

front_2.png

 

Go to the Integrations section and press the + sign:

MeghaD_1-1622115647033.png

 

front_3.png

 

Go to the Customer Service section inside the opened Popup and choose the Front option:

MeghaD_2-1622115647313.png

front_4.png

Click on the Connect Front button inside the General Tab:

MeghaD_3-1622115647316.png

front_5.png

 

It will redirect you to a new screen where you'll need to authorize Flow to connect with Front by pressing the Authorize button:

MeghaD_4-1622115647011.png

 

front_6.png

 

After authorization, it will redirect you back to the Flow Front configuration page.

Copy Webhook URL to the clipboard:

MeghaD_5-1622115647316.png

 

front_7.png

Configure Front

Go to the Front Webhooks integration page. There you have to press the Enable Integration button:

MeghaD_6-1622115647317.png

 front_8.png

 

Turn on the Enabled toggle within the settings overview, and press the Save button.

 

front_9.png

 

Go to the Rules section and press the Add a team rule button:

 

 

 

front_10.png

 

The When Section of your newly created team rule should include:

  • Inbound message
  • Conversation archived
  • Conversation deleted

The If section should refer to your Flow inbox, and inside the Then section you should select the Send to a Webhook option. Paste the link that you have copied from step 3.5 into the text field.

 

front_11.png

 

Press the Save button if all the previous steps were completed.

Add the Flow Front plugin

On the Flow integration section (inside the Front configuration) click on the Plugin tab, then copy the Plugin endpoint onto the clipboard:

 

front_12.png

 

Go to Plugin & API section inside the Front settings and press Add a Plugin button:

 

front_13.png

 

Paste the link from the clipboard to the endpoint field and press the Save button.

Note: Please make sure you select the Legacy SDK option.

 

 

front_14.png

 

Click on the created plugin, and you will see a generated Auth Secret code. Copy it to the clipboard and return to the Flow Integrations section.

 

 

front_15.png

 

 

front_16.png

 

Paste the copied data to the Plugin auth secret field and press Save button:

 

 

front_17.png

 

Now your Flow project and Front application are connected!

Receiving messages in Front

In order to receive messages inside Front, make sure you add a handover reply action. When the handover action is triggered, the conversation including the last messages, will be loaded inside Front.

When you archive or remove the conversation inside Front, the bot will automatically resume.

Integration Settings

The Flow integration provides additional settings you can use to tweak your workflow.

Bot name

The name of the bot is used as the contact name whenever Flow sends a reply that gets logged in Front.

Handoff tag name

By calling a takeover action this tag will be automatically assigned to the conversation in front.

Auto Archive

Enabling this option will automatically archive the conversation inside Front whenever a bot sends a reply to a user.

Apply channel tag

When enabled, a conversation will be marked by a Flow channel tag. For example, conversations within Messenger will automatically receive a tag called messenger.

Setting up Front

Front allows rules, tags, and auto-assignment to configure the way your agents collaborate.

Capabilities

Using Front and Flow you can connect to different messaging channels. The following table provides an overview of the capabilities of each channel you can connect with.

 

Reply Action
 

 

 Web
 

 

Messenger
 

 

WhatsApp
 

 

RBM
 

 

Telegram
 

 

SMS
 

 

Twitter
Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Emojis ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Animated gifs ✔️ ✔️          
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️    
Video ✔️ ✔️ ✔️ ✔️ ✔️    
Audio ✔️ ✔️ ✔️ ✔️ ✔️    
Location ✔️ ✔️ ✔️ ✔️ ✔️    
Card ✔️ ✔️   ✔️ ✔️    
Carousel ✔️ ✔️   ✔️ ✔️    
List ✔️       ✔️    
Buttons ✔️ ✔️     ✔️    
Quick replies ✔️ ✔️   ✔️      
Webviews ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Triggers

Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Any text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Action ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Unknown ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Video ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Audio   ✔️ ✔️ ✔️ ✔️   ✔️
Location ✔️ ✔️ ✔️   ✔️    
Timer ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Others

Link & trigger   ✔️ ✔️ ✔️ ✔️    
Comments     Full-support, requires Flow.ai on boarding Full-support, requires Flow.ai on boarding Full support except keyboards    

Troubleshooting

I do not see any messages arrive in Front

Make sure you have added a handover action. Only when the handover action is triggered the conversation will be loaded inside Front.

I do not see all messages inside the conversation

We only load the last couple of messages due to performance reasons

The Flow plugin is not loading

There are a couple of reasons why the plugin might not work.

  • Please double check the Plugin URL to be exactly the same as the Flow configuration.
  • Make sure you have selected the legacy SDK option within the Front plugin options
  • Each plugin is tied to a single Flow inbox. If you connect multiple Flow projects you'll need to add additional plugins.

The bot is not resuming after archiving

Please double-check:

  • Include all inboxes within your webhook rule where you archive or remove messages
  • Enable all events like archive, delete within the webhook rule
Labels (1)

Flow Customer Services: Front

Front, the shared inbox for teams, allows your customer service team to handle all the conversations that your Flow bot is unable to handle.

 

Screenshot 2021-05-04 at 7.51.00 PM.png

Installation

 

 

Following the steps below, you can integrate the Front application with a Flow project.

Prerequisites

You must have a working Front's Plus plan or above with admin rights. In order to receive messages in Front you will need to add a handover action within your flow design.

Add the integration

Select the project to which you would like to connect Front using the top left drop-down menu.

MeghaD_0-1622115647017.png

front_2.png

 

Go to the Integrations section and press the + sign:

MeghaD_1-1622115647033.png

 

front_3.png

 

Go to the Customer Service section inside the opened Popup and choose the Front option:

MeghaD_2-1622115647313.png

front_4.png

Click on the Connect Front button inside the General Tab:

MeghaD_3-1622115647316.png

front_5.png

 

It will redirect you to a new screen where you'll need to authorize Flow to connect with Front by pressing the Authorize button:

MeghaD_4-1622115647011.png

 

front_6.png

 

After authorization, it will redirect you back to the Flow Front configuration page.

Copy Webhook URL to the clipboard:

MeghaD_5-1622115647316.png

 

front_7.png

Configure Front

Go to the Front Webhooks integration page. There you have to press the Enable Integration button:

MeghaD_6-1622115647317.png

 front_8.png

 

Turn on the Enabled toggle within the settings overview, and press the Save button.

 

front_9.png

 

Go to the Rules section and press the Add a team rule button:

 

 

 

front_10.png

 

The When Section of your newly created team rule should include:

  • Inbound message
  • Conversation archived
  • Conversation deleted

The If section should refer to your Flow inbox, and inside the Then section you should select the Send to a Webhook option. Paste the link that you have copied from step 3.5 into the text field.

 

front_11.png

 

Press the Save button if all the previous steps were completed.

Add the Flow Front plugin

On the Flow integration section (inside the Front configuration) click on the Plugin tab, then copy the Plugin endpoint onto the clipboard:

 

front_12.png

 

Go to Plugin & API section inside the Front settings and press Add a Plugin button:

 

front_13.png

 

Paste the link from the clipboard to the endpoint field and press the Save button.

Note: Please make sure you select the Legacy SDK option.

 

 

front_14.png

 

Click on the created plugin, and you will see a generated Auth Secret code. Copy it to the clipboard and return to the Flow Integrations section.

 

 

front_15.png

 

 

front_16.png

 

Paste the copied data to the Plugin auth secret field and press Save button:

 

 

front_17.png

 

Now your Flow project and Front application are connected!

Receiving messages in Front

In order to receive messages inside Front, make sure you add a handover reply action. When the handover action is triggered, the conversation including the last messages, will be loaded inside Front.

When you archive or remove the conversation inside Front, the bot will automatically resume.

Integration Settings

The Flow integration provides additional settings you can use to tweak your workflow.

Bot name

The name of the bot is used as the contact name whenever Flow sends a reply that gets logged in Front.

Handoff tag name

By calling a takeover action this tag will be automatically assigned to the conversation in front.

Auto Archive

Enabling this option will automatically archive the conversation inside Front whenever a bot sends a reply to a user.

Apply channel tag

When enabled, a conversation will be marked by a Flow channel tag. For example, conversations within Messenger will automatically receive a tag called messenger.

Setting up Front

Front allows rules, tags, and auto-assignment to configure the way your agents collaborate.

Capabilities

Using Front and Flow you can connect to different messaging channels. The following table provides an overview of the capabilities of each channel you can connect with.

 

Reply Action
 

 

 Web
 

 

Messenger
 

 

WhatsApp
 

 

RBM
 

 

Telegram
 

 

SMS
 

 

Twitter
Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Emojis ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Animated gifs ✔️ ✔️          
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️    
Video ✔️ ✔️ ✔️ ✔️ ✔️    
Audio ✔️ ✔️ ✔️ ✔️ ✔️    
Location ✔️ ✔️ ✔️ ✔️ ✔️    
Card ✔️ ✔️   ✔️ ✔️    
Carousel ✔️ ✔️   ✔️ ✔️    
List ✔️       ✔️    
Buttons ✔️ ✔️     ✔️    
Quick replies ✔️ ✔️   ✔️      
Webviews ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Triggers

Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Any text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Action ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Unknown ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Video ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Audio   ✔️ ✔️ ✔️ ✔️   ✔️
Location ✔️ ✔️ ✔️   ✔️    
Timer ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Others

Link & trigger   ✔️ ✔️ ✔️ ✔️    
Comments     Full-support, requires Flow.ai on boarding Full-support, requires Flow.ai on boarding Full support except keyboards    

Troubleshooting

I do not see any messages arrive in Front

Make sure you have added a handover action. Only when the handover action is triggered the conversation will be loaded inside Front.

I do not see all messages inside the conversation

We only load the last couple of messages due to performance reasons

The Flow plugin is not loading

There are a couple of reasons why the plugin might not work.

  • Please double check the Plugin URL to be exactly the same as the Flow configuration.
  • Make sure you have selected the legacy SDK option within the Front plugin options
  • Each plugin is tied to a single Flow inbox. If you connect multiple Flow projects you'll need to add additional plugins.

The bot is not resuming after archiving

Please double-check:

  • Include all inboxes within your webhook rule where you archive or remove messages
  • Enable all events like archive, delete within the webhook rule
Labels (1)
Last Reviewed:
04-13-2022 02:11 PM

Flow Customer Services: Front

Front, the shared inbox for teams, allows your customer service team to handle all the conversations that your Flow bot is unable to handle.

 

Screenshot 2021-05-04 at 7.51.00 PM.png

Installation

 

 

Following the steps below, you can integrate the Front application with a Flow project.

Prerequisites

You must have a working Front's Plus plan or above with admin rights. In order to receive messages in Front you will need to add a handover action within your flow design.

Add the integration

Select the project to which you would like to connect Front using the top left drop-down menu.

MeghaD_0-1622115647017.png

front_2.png

 

Go to the Integrations section and press the + sign:

MeghaD_1-1622115647033.png

 

front_3.png

 

Go to the Customer Service section inside the opened Popup and choose the Front option:

MeghaD_2-1622115647313.png

front_4.png

Click on the Connect Front button inside the General Tab:

MeghaD_3-1622115647316.png

front_5.png

 

It will redirect you to a new screen where you'll need to authorize Flow to connect with Front by pressing the Authorize button:

MeghaD_4-1622115647011.png

 

front_6.png

 

After authorization, it will redirect you back to the Flow Front configuration page.

Copy Webhook URL to the clipboard:

MeghaD_5-1622115647316.png

 

front_7.png

Configure Front

Go to the Front Webhooks integration page. There you have to press the Enable Integration button:

MeghaD_6-1622115647317.png

 front_8.png

 

Turn on the Enabled toggle within the settings overview, and press the Save button.

 

front_9.png

 

Go to the Rules section and press the Add a team rule button:

 

 

 

front_10.png

 

The When Section of your newly created team rule should include:

  • Inbound message
  • Conversation archived
  • Conversation deleted

The If section should refer to your Flow inbox, and inside the Then section you should select the Send to a Webhook option. Paste the link that you have copied from step 3.5 into the text field.

 

front_11.png

 

Press the Save button if all the previous steps were completed.

Add the Flow Front plugin

On the Flow integration section (inside the Front configuration) click on the Plugin tab, then copy the Plugin endpoint onto the clipboard:

 

front_12.png

 

Go to Plugin & API section inside the Front settings and press Add a Plugin button:

 

front_13.png

 

Paste the link from the clipboard to the endpoint field and press the Save button.

Note: Please make sure you select the Legacy SDK option.

 

 

front_14.png

 

Click on the created plugin, and you will see a generated Auth Secret code. Copy it to the clipboard and return to the Flow Integrations section.

 

 

front_15.png

 

 

front_16.png

 

Paste the copied data to the Plugin auth secret field and press Save button:

 

 

front_17.png

 

Now your Flow project and Front application are connected!

Receiving messages in Front

In order to receive messages inside Front, make sure you add a handover reply action. When the handover action is triggered, the conversation including the last messages, will be loaded inside Front.

When you archive or remove the conversation inside Front, the bot will automatically resume.

Integration Settings

The Flow integration provides additional settings you can use to tweak your workflow.

Bot name

The name of the bot is used as the contact name whenever Flow sends a reply that gets logged in Front.

Handoff tag name

By calling a takeover action this tag will be automatically assigned to the conversation in front.

Auto Archive

Enabling this option will automatically archive the conversation inside Front whenever a bot sends a reply to a user.

Apply channel tag

When enabled, a conversation will be marked by a Flow channel tag. For example, conversations within Messenger will automatically receive a tag called messenger.

Setting up Front

Front allows rules, tags, and auto-assignment to configure the way your agents collaborate.

Capabilities

Using Front and Flow you can connect to different messaging channels. The following table provides an overview of the capabilities of each channel you can connect with.

 

Reply Action
 

 

 Web
 

 

Messenger
 

 

WhatsApp
 

 

RBM
 

 

Telegram
 

 

SMS
 

 

Twitter
Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Emojis ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Animated gifs ✔️ ✔️          
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️    
Video ✔️ ✔️ ✔️ ✔️ ✔️    
Audio ✔️ ✔️ ✔️ ✔️ ✔️    
Location ✔️ ✔️ ✔️ ✔️ ✔️    
Card ✔️ ✔️   ✔️ ✔️    
Carousel ✔️ ✔️   ✔️ ✔️    
List ✔️       ✔️    
Buttons ✔️ ✔️     ✔️    
Quick replies ✔️ ✔️   ✔️      
Webviews ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Triggers

Text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Any text ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Event ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Action ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Unknown ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
Image ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️
File ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Video ✔️ ✔️ ✔️ ✔️ ✔️   ✔️
Audio   ✔️ ✔️ ✔️ ✔️   ✔️
Location ✔️ ✔️ ✔️   ✔️    
Timer ✔️ ✔️ ✔️ ✔️ ✔️ ✔️ ✔️

 

Others

Link & trigger   ✔️ ✔️ ✔️ ✔️    
Comments     Full-support, requires Flow.ai on boarding Full-support, requires Flow.ai on boarding Full support except keyboards    

Troubleshooting

I do not see any messages arrive in Front

Make sure you have added a handover action. Only when the handover action is triggered the conversation will be loaded inside Front.

I do not see all messages inside the conversation

We only load the last couple of messages due to performance reasons

The Flow plugin is not loading

There are a couple of reasons why the plugin might not work.

  • Please double check the Plugin URL to be exactly the same as the Flow configuration.
  • Make sure you have selected the legacy SDK option within the Front plugin options
  • Each plugin is tied to a single Flow inbox. If you connect multiple Flow projects you'll need to add additional plugins.

The bot is not resuming after archiving

Please double-check:

  • Include all inboxes within your webhook rule where you archive or remove messages
  • Enable all events like archive, delete within the webhook rule
Labels (1)
Version history
Last update:
‎06-20-2021 06:17 AM
Updated by:
Contributors