How to automatically update your Slack status when you join a Zoom meeting
Tags: opensource
Published: 2020-04-13 13:15:27

Chances are very high these days (among others thanks to [COVID-19](https://avatorl.org/covid-19/)), that you are using Zoom and Slack in your company. Wouldn't it be nice, if we could connect those two tools and automate the Slack status based on your Zoom presence state? 🤔

That's what we've discussed at [Lovely Systems](https://www.lovelysystems.com/) in our last retrospective. People were missing the current state (eg. "in a meeting") when a team-mate did not respond (quickly).

Thanks to the restrictions on outdoor activities in Austria 🇦🇹, I had the time to wrap my head around this idea and created a tool for it. 💡

Meet the ["Zoom-Slack-Status-Updater" (MIT)](https://github.com/natterstefan/zoom-slack-status-updater). It is

- open-source
- supports multiple Slack workspaces
- can be hosted on [now.sh](http://now.sh/)
- and is quickly set up.

I'll guide you through the process, so you can have your own. Let's jump right into it.

## What you need

- a Zoom App
- a Slack App
- and a ZEIT account

(Note: the steps are also described on [GitHub](https://github.com/natterstefan/zoom-slack-status-updater))

First, make sure you have cloned the source code, as well as `now` and all dependencies installed.

```bash
git clone https://github.com/natterstefan/zoom-slack-status-updater
npm install -g now
yarn # or npm i
```

## Setup & Deployment

### Step 1 - Setup now.sh

1. Create a [ZEIT account](https://zeit.co/signup)
2. and log in with `now login` in your terminal

### Step 2 - Setup Slack

1. Create a [Slack App](https://api.slack.com/apps) for your workspace(s)
2. Grant each app the `users.profile:write` privilege in `User Token Scopes` in the `OAuth Tokens & Redirect URLs` view, before clicking on the "Install App" button.
3. Copy and paste each `OAuth Access Token` into the configuration file created in the subsequent step.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ma9dbqx02eajfuunpzkm.png)

### Step 3 - Configure App

1. Duplicate the [example config](./slack-status-config-example.js) and rename it to `slack-status-config.js`. This should happen automatically thanks to a `postinstall` script.
2. Create a config object for each slack workspace you want to update when a Zoom meeting starts.

You can either use `now secret` for the token values, or copy the token string right into the workspace config. I used the secret option described below (this is the reason why the checked-in `now.json` is opinionated and includes already one secret):

#### now secrets

When working with [`now secret`](https://zeit.co/docs/v2/build-step#using-environment-variables-and-secrets) you need to do the following for _each_ secret (aka Slack app token):

Step 1 - create a secret

```bash
now secret add SLACK_TOKEN_1 "xoxp-xxx-xxx"
```

Step 2 - add the secret to `now.json`

```json
  "env": {
    "SLACK_TOKEN_1": "@slack_token_1"
  }
```

Step 3 - add `process.env.<secret name>` to your configuration file

```js
  {
    name: 'Slack Workspace 1',
    token: process.env.SLACK_TOKEN_1,
    ...
  }
```

### Step 4 - Deploy App to now.sh

```bash
# example questions when setting up the now project for the first time
# What’s your project’s name? your-app-name
# In which directory is your code located? ./
now
```

This will guide you through the process of creating and deploying the project to now.sh. Remember the created URL. You are going to need it in the next step for the ZOOM app.

Tip: Do not use an obvious name for your now.sh URL here, something random or other people could mess with your Slack status. 😆

### Step 5 - Setup Zoom

![Create Webhook Only Zoom App](https://dev-to-uploads.s3.amazonaws.com/i/pf43q5uefm9z6mjfdp58.png)

[Create a new (or use an existing) "Webhook Only" Zoom app](https://marketplace.zoom.us/develop/create) with your Zoom account. Even if you have added multiple Slack workspaces, you just need one Zoom app.

Fill out the required information and activate `Event Subscriptions`. Add
the `User’s presence status has been updated` event type and the generated
now.sh domain for `Event notification endpoint URL`.

![Setup Zoom App](https://dev-to-uploads.s3.amazonaws.com/i/get93dpqp3ibafzujs5k.png)

You can read more about it setting up the App [here](https://marketplace.zoom.us/docs/api-reference/webhook-reference/user-events/presence-status-updated).

### Step 6 - Test :)

Now, open both Zoom and Slack and watch the status change when you start or join a meeting.

---

- Repo: https://github.com/natterstefan/zoom-slack-status-updater
- Let's connect on Twitter 🐦: https://twitter.com/natterstefan
- Cover Photo was taken from https://slackhq.com/slack-zoom-partnership-announcement

🔥 Stay up to date and subscribe to my newsletter on [newsletter.natterstefan.me](https://newsletter.natterstefan.me). 🔥