/template-slash-command-and-dialogs

Sample Slack app that uses a Slash Command and interactive message to create helpdesk tickets

Primary LanguageJavaScriptMIT LicenseMIT

Slash Command and Dialogs blueprint

Creating a helpdesk ticket using a Slash Command and a Dialog

Use a slash command and a dialog to create a helpdesk ticket in a 3rd-party system. Once it has been created, send a message to the user with information about their ticket.

helpdesk-dialog

Setup

Create a Slack app

  1. Create an app at api.slack.com/apps
  2. Navigate to the OAuth & Permissions page and add the following scopes:
    • commands
    • users:read
    • users:read:email
    • chat:write:bot
  3. Click 'Save Changes' and install the app

Run locally or Remix on Glitch

  1. Get the code
  2. Set the following environment variables to .env (see .env.sample):
    • SLACK_ACCESS_TOKEN: Your app's xoxp- token (available on the Install App page)
    • PORT: The port that you want to run the web server on
    • SLACK_VERIFICATION_TOKEN: Your app's Verification Token (available on the Basic Information page)
  3. If you're running the app locally:
    1. Start the app (npm start)
    2. In another window, start ngrok on the same port as your webserver (ngrok http $PORT)

Add a Slash Command

  1. Go back to the app settings and click on Slash Commands.
  2. Click the 'Create New Command' button and fill in the following:
    • Command: /helpdesk
    • Request URL: Your ngrok or Glitch URL + /commands
    • Short description: Create a helpdesk ticket
    • Usage hint: [the problem you're having]
  3. Save and reinstall the app

Enable Interactive Components

  1. Go back to the app settings and click on Interactive Components.
  2. Set the Request URL to your ngrok or Glitch URL + /interactive-component