example: slack modal update (#825)

examples/slack-modal-update/.env

@@ -0,0 +1,2 @@
+SLACK_ACCESS_TOKEN=
+SLACK_SIGNING_SECRET=

examples/slack-modal-update/README.md

@@ -0,0 +1,51 @@
+# Slack Modal Update
+
+## Install and Run
+
+Download this example or clone [bottender](https://github.com/Yoctol/bottender).
+
+```sh
+curl https://codeload.github.com/Yoctol/bottender/tar.gz/master | tar -xz --strip=2 bottender-master/examples/slack-modal-update
+cd slack-modal-update
+```
+
+Install dependencies:
+
+```sh
+npm install
+```
+
+You must fill `SLACK_ACCESS_TOKEN` and `SLACK_SIGNING_SECRET` in your `.env` file.
+
+If you are not familiar with Slack Bot, you may refer to Bottender's doc, [Slack Setup](https://bottender.js.org/docs/channel-slack-setup), to find detailed instructions.
+
+After that, you can run the bot with this npm script:
+
+```sh
+npm run dev
+```
+
+This command starts a server listening at `http://localhost:5000` for bot development.
+
+If you successfully start the server, you get a webhook URL in the format of `https://xxxxxxxx.ngrok.io/webhooks/slack` from your terminal.
+
+## Set Webhook
+
+To set the webhook, go to [Slack Developer Console](https://api.slack.com/apps) / [YourApp] / Event Subscriptions and [Slack Developer Console](https://api.slack.com/apps) / [YourApp] / Interactivity & Shortcuts, and use the webhook URL you got from running `npm run dev` to edit Request URLs for your bot.
+
+## Idea of This Example
+
+This example is a bot running on [Slack](https://slack.com/).
+
+This example contains the following topics:
+
+- How to update a modal view.
+
+For more information, check our [Slack guides](https://bottender.js.org/docs/en/channel-slack-block-kit).
+
+## Related Examples
+
+- [slack-home-tab](../slack-home-tab)
+- [slack-modal-push](../slack-modal-push)
+- [slack-modal-form](../slack-modal-form)
+- [slack-modal-on-home](../slack-modal-on-home)

examples/slack-modal-update/bottender.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  channels: {
+    slack: {
+      enabled: true,
+      path: '/webhooks/slack',
+      accessToken: process.env.SLACK_ACCESS_TOKEN,
+      signingSecret: process.env.SLACK_SIGNING_SECRET,
+    },
+  },
+};

examples/slack-modal-update/index.js

@@ -0,0 +1,79 @@
+const { router, route, slack } = require('bottender/router');
+
+function getBlocks(text, buttonValue) {
+  return [
+    {
+      type: 'section',
+      text: {
+        type: 'mrkdwn',
+        text,
+      },
+    },
+    {
+      type: 'actions',
+      elements: [
+        {
+          type: 'button',
+          text: {
+            type: 'plain_text',
+            text: buttonValue,
+            emoji: true,
+          },
+          value: buttonValue,
+        },
+      ],
+    },
+  ];
+}
+
+async function ShowModal(context) {
+  const { triggerId } = context.event.rawEvent;
+  await context.views.open({
+    triggerId,
+    view: {
+      type: 'modal',
+      title: {
+        type: 'plain_text',
+        text: 'Modal Title',
+      },
+      blocks: getBlocks('in modal', 'update modal'),
+    },
+  });
+}
+
+async function UpdateModal(context) {
+  const viewId = context.event.rawEvent.view.id;
+  await context.views.update({
+    viewId,
+    view: {
+      type: 'modal',
+      title: {
+        type: 'plain_text',
+        text: 'Modal Title',
+      },
+      blocks: getBlocks('modal updated', 'update modal again'),
+    },
+  });
+}
+
+async function OnBlockActions(context) {
+  if (context.event.action.value === 'show modal') {
+    return ShowModal;
+  }
+  if (context.event.action.value === 'update modal') {
+    return UpdateModal;
+  }
+}
+
+async function Default(context) {
+  await context.chat.postMessage({
+    blocks: getBlocks('message', 'show modal'),
+  });
+}
+
+module.exports = async function App(context) {
+  return router([
+    slack.event('block_actions', OnBlockActions),
+    route('*', Default),
+  ]);
+};

examples/slack-modal-update/package.json

@@ -0,0 +1,9 @@
+{
+  "scripts": {
+    "dev": "bottender dev",
+    "start": "bottender start"
+  },
+  "dependencies": {
+    "bottender": "1.5.1-alpha.4"
+  }
+}