mirror of
https://github.com/LukeHagar/unicorn-utterances.git
synced 2025-12-10 12:57:46 +00:00
Added rudimentary version of PlusPlus bot clone
This commit is contained in:
@@ -117,7 +117,7 @@ With this command still running, you can press on the "Add features and function
|
|||||||
|
|
||||||
This will bring you to a page with an "On/Off" toggle. Toggle it to "On" and add the `ngrok` domain in the request URL
|
This will bring you to a page with an "On/Off" toggle. Toggle it to "On" and add the `ngrok` domain in the request URL
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
But the domain isn't saved yet. We first need to add workspace events to subscribe to. This is to ensure that any app doesn't simply have root permissions to everything for privacy and security's sake
|
But the domain isn't saved yet. We first need to add workspace events to subscribe to. This is to ensure that any app doesn't simply have root permissions to everything for privacy and security's sake
|
||||||
|
|
||||||
@@ -155,7 +155,107 @@ Simply click `Install App to Workspace`, then `Allow` to give permissions to add
|
|||||||
|
|
||||||
Once this is done, you can send a test message to a public channel and see it printed out in your console!
|
Once this is done, you can send a test message to a public channel and see it printed out in your console!
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
# App Interactivity {#interactive-message-package}
|
||||||
|
|
||||||
|
While listening to events alone can be very useful in some circumstances, oftentimes having a way to interact with you application can be very helpful. As a result, the Slack SDK also includes the `@slack/interactive-messages` package to help you provide interactions with the user more directly. Using this package, you can respond to the user's input. For example, let's say we wanted to reproduce the [PlusPlus](https://go.pluspl.us/) Slackbot as a way to track a user's score.
|
||||||
|
|
||||||
|
We want to have the following functionality for an MVP:
|
||||||
|
|
||||||
|
- `@UserOrThing++`: A way to add a point to a user or thing
|
||||||
|
- `@UserOrThing--`: A way to remove a point from a user or thing
|
||||||
|
- `@PointsRUs leaderboard`: A flat list of the items/people with points
|
||||||
|
|
||||||
|
Each of these messages will prompt the bot to respond with a message in the same channel. Ideally we'd use a database to store score for long-term projects, but for the interim, let's use in-memory storage
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Setup
|
||||||
|
|
||||||
|
First and foremost, something you'll need to do is add a new OAuth permission to enable the functionality for the bot to write to the channel
|
||||||
|

|
||||||
|
|
||||||
|
After enabling the new Oauth permission, you'll need to reinstall your app. This is because you're changing the permissions of your apps and you need to accept the new permissions when you reinstall the app. If you scroll to the top of the same Oauth page, you should see a `Reinstall App` button that will help you do this easily
|
||||||
|
|
||||||
|
Once this is done, you can access the oauth token for the installation of your workspace. This token will enable us to send messages to the workspace itself. This token is unique per-workspace, so if you're intending for a broader release of your bot (to be easily added with a single button click), you'll likely need to walk through their oauth token request system. Since this is meant as an introductory look, we'll just copy this token and store it into our `.ENV` file,
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|

|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
You'll want to place this into your `.ENV` file. I named the environmental variable `OAUTH_TOKEN`, so when you see that in code examples, know that this is in reference to this value
|
||||||
|
|
||||||
|
## The Code
|
||||||
|
|
||||||
|
To start, we need to install the package that'll allow us to use the web API:
|
||||||
|
|
||||||
|
```
|
||||||
|
npm i @slack/web-api
|
||||||
|
```
|
||||||
|
|
||||||
|
The web API should enable us to use the [`postMessage`](https://api.slack.com/methods/chat.postMessage) method to send messages to a channel when they send a message
|
||||||
|
|
||||||
|
Once this is installed, we're able to instanciate the web API with the oauth token we grabbed earlier
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
const { WebClient } = require('@slack/web-api');
|
||||||
|
const token = process.env.OAUTH_TOKEN;
|
||||||
|
const web = new WebClient(token);
|
||||||
|
```
|
||||||
|
|
||||||
|
After this is setup, we could run code like:
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
web.chat.postMessage({
|
||||||
|
text: 'A post message',
|
||||||
|
channel: channelId,
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
To send a message. Let's try to use this API to add some trivial logic into our existing `events` listening functionality.
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
const { createEventAdapter } = require('@slack/events-api');
|
||||||
|
const { WebClient } = require('@slack/web-api');
|
||||||
|
|
||||||
|
const token = process.env.OAUTH_TOKEN;
|
||||||
|
const slackSigningSecret = process.env.SLACK_SIGNING_SECRET;
|
||||||
|
|
||||||
|
const slackEvents = createEventAdapter(slackSigningSecret);
|
||||||
|
const web = new WebClient(token);
|
||||||
|
const port = process.env.PORT || 3000;
|
||||||
|
|
||||||
|
slackEvents.on('message', async event => {
|
||||||
|
console.log(`Received a message event: user ${event.user} in channel ${event.channel} says ${event.text}`);
|
||||||
|
|
||||||
|
// Check if the text includes the text we'd want to use to check the leaderboard
|
||||||
|
if (/@pointsrus leaderboard/i.exec(event.text)) {
|
||||||
|
const result = await web.chat.postMessage({
|
||||||
|
// We'll add more functionality in the future. We just want to test it works, first
|
||||||
|
text: 'This should output a leaderboard',
|
||||||
|
channel: event.channel,
|
||||||
|
});
|
||||||
|
|
||||||
|
console.log(`Successfully send message ${result.ts} in conversation ${event.channel}`);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
slackEvents.on('error', console.error);
|
||||||
|
|
||||||
|
slackEvents.start(port).then(() => {
|
||||||
|
console.log(`server listening on port ${port}`);
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
The above code should
|
||||||
|
|
||||||
|
## Adding State {#interactive-local-state}
|
||||||
|
|
||||||
|
|
||||||
# Deployment {#deployment}
|
# Deployment {#deployment}
|
||||||
|
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
Reference in New Issue
Block a user