Slack Apps: Utilizing the Home Tab

Introduction

Slack Apps can be compelling tools when utilized fully. From sending information to a user to allowing users 1-click remediation for an issue they’re having, you can offer a lot of flexibility. As I’ve begun integrating more workflows with Slack, I quickly realized I was underutilizing the Home tab for Slack Apps. The Home tab is very flexible and offers a place to create a dashboard to display information to a user, a place for them to interact with your workflows (such as clicking buttons or selecting drop-down options), or just instructions on what to do. This post will walk you through some of the setup required to start building your Home tab for your Slack App.

Home Tabs Explained

Before we get into the setup and building of a Home tab, I’m going to explain a few key pieces that you need to know about how Home tabs function:

App Home Opened Event - A Slack event containing essential information generates every time a user clicks your app and navigates to the Home tab. The thing we’re most concerned with is who is opening the app.

View - Every time someone opens the Home tab, Slack uses what they call a “view” to display information. This view can either be a previously opened view or, more commonly, a view you “publish” when that event occurs. Publishing a view requires an API call with a token, the user ID to publish the view to, and a JSON payload containing the formatting of the view (typically in Slack Block format).

Slack Blocks - Slack Blocks are a flexible tool that formats and displays various options to users. This can be markdown formatted text, buttons, drop-down menus, input fields, and pictures. If you can dream it, you can probably build it with Slack Blocks. You can even use the handy Block Kit Builder.

Slack App Setup

One of the first things we need to do is create a Slack App. Open up the Slack Apps page at https://api.slack.com/apps/ and click Create New App. You’ll receive a pop-up asking you to name your app and select the workspace you want to develop it for. You can rename your app later if you aren’t happy with the one you’ve chosen.

Next, let’s navigate to the Event Subscriptions page and toggle Enable Events on.

After you have toggled Enable Events on the Event Subscriptions page, you’ll want to subscribe to the app_home_opened event under Subscribe to bot events.

Once you’ve done this, we need to do a bit of work outside the Slack Apps page. If you’re using Okta Workflows, you can move to the next section titled Okta Workflows Setup. If you’re going to be sending your workflow elsewhere, move to the Slack Setup (cont.) section below.

Okta Workflows Setup

This will seem pretty familiar if you’ve read my previous blog post. We will create a new Okta Workflow with the API Endpoint trigger card. Make sure you select Expose as a public service but don’t bother grabbing the URL yet, as we need to enable and save our flow before that information will fill in. Next, we need to add a few cards like the example screenshot below:

JSON: Parse - with the Body from the API Endpoint as an input

Object Get - with the JSON object as input and challenge as the path.

Object Construct - Set your key to text and the challenge we retrieved as the input.

Return - Set the following keys and values :Status Code:200, Headers:{}, Body:[Output of Construct Card].

Your keys for the Construct & Return card must match the image below, which is critical for the next Slack setup section.

Save the flow and enable it. Click the endpoint configuration button and copy the Invoke URL. You’ll need this when we return to Slack app setup.

Slack App Setup (cont.)

If you’ve gotten to this section, I’m going to assume that you either followed along in my Okta Workflows setup or have familiarity with API endpoints. You’ll need yours ready for an HTTP Post request with a challenge parameter sent to it and your endpoint returning the challenge value. In both cases, paste the API Endpoint URL into the Request URL field on the Event Subscriptions page. If you have set everything up correctly, you should immediately see a verified message next to the Request URL.

Building the Home view

Now that we’ve done some setup, we’re ready to get into the bulk of our Home Tab buildout: the view. We must build a JSON payload with a specific structure: View, type: home, blocks[ {Slack Block JSON you’ve created here} ]. It should look like the example payload below, but with the blocks you want. In one case, we wanted to show our People & Security teams employees scheduled to exit the company with a link to documentation for that exit. So, the workflow looked something like this:

The user opens the Slack app.
Workflow checks to see if the user is authorized to view sensitive information
If authorized, build blocks based on information stored in a DB
If unauthorized, build blocks of text informing the user that they are not authorized.

Once we’ve built our view, the last step is to publish it. We make a views.publish API call, which will push the view to the user. After that, the user can use any of the interactive elements of your blocks (buttons, drop down menus, input fields) and read through any information you’ve posted for them.

{
"view": {
"type": "home",
"blocks": [
{
"type": "section",
"text": {
"type": "plain_text",
"text": "This is a plain text section block.",
"emoji": true
}
}
]
}
}