Merge pull request #4034 from weseek/feat/6710-6834-integration

Feat/6710 6834 integration

packages/slack/src/utils/block-kit-builder.ts

@@ -63,11 +63,20 @@ export function inputBlock(
   };
 }
 
+type ButtonElement = {
+  text: string,
+  actionId: string,
+  style?: string,
+  value?:string
+}
+
 /**
  * Button element
  * https://api.slack.com/reference/block-kit/block-elements#button
  */
-export function buttonElement(text: string, actionId: string, style?: string): Button {
+export function buttonElement({
+  text, actionId, style, value,
+}:ButtonElement): Button {
   const button: Button = {
     type: 'button',
     text: {
@@ -75,6 +84,7 @@ export function buttonElement(text: string, actionId: string, style?: string): B
       text,
     },
     action_id: actionId,
+    value,
   };
   if (style === 'primary' || style === 'danger') {
     button.style = style;

src/server/routes/apiv3/slack-integration.js

@@ -148,6 +148,15 @@ module.exports = (crowi) => {
         await crowi.slackBotService.showEphemeralSearchResults(client, body, args, newOffset);
         break;
       }
+      case 'togetterShowMore': {
+        const parsedValue = JSON.parse(payload.actions[0].value);
+        const togetterHandler = require('../../service/slack-command-handler/togetter')(crowi);
+
+        const { body, args, limit } = parsedValue;
+        const newLimit = limit + 1;
+        await togetterHandler.handleCommand(client, body, args, newLimit);
+        break;
+      }
       case 'togetterCreatePage': {
         await crowi.slackBotService.togetterCreatePageInGrowi(client, payload);
         break;
@@ -156,14 +165,6 @@ module.exports = (crowi) => {
         console.log('Cancel here');
         break;
       }
-      case 'showMoreTogetterResults': {
-        const parsedValue = JSON.parse(payload.actions[0].value);
-
-        const { body, args, limit } = parsedValue;
-        const newLimit = limit + 10;
-        await crowi.slackBotService.togetterCommand(client, body, args, newLimit);
-        break;
-      }
       default:
         break;
     }

src/server/service/slack-command-handler/togetter.js

@@ -1,6 +1,7 @@
 const {
   inputBlock, actionsBlock, buttonElement, checkboxesElementOption,
 } = require('@growi/slack');
+const { fromUnixTime, format } = require('date-fns');
 
 module.exports = () => {
   const BaseSlackCommandHandler = require('./slack-command-handler');
@@ -8,46 +9,47 @@ module.exports = () => {
 
   handler.handleCommand = async function(client, body, args, limit = 10) {
     // TODO GW-6721 Get the time from args
-    const reusult = await client.conversations.history({
+    const result = await client.conversations.history({
       channel: body.channel_id,
       limit,
     });
-    console.log(reusult);
-    // Return Checkbox Message
+      // Return Checkbox Message
     client.chat.postEphemeral({
       channel: body.channel_id,
       user: body.user_id,
       text: 'Select messages to use.',
-      blocks: this.togetterMessageBlocks(),
+      blocks: this.togetterMessageBlocks(result.messages, body, args, limit),
     });
     return;
   };
 
-  handler.togetterMessageBlocks = function() {
+  handler.togetterMessageBlocks = function(messages, body, args, limit) {
     return [
-      inputBlock(this.togetterCheckboxesElement(), 'selected_messages', 'Select massages to use.'),
-      actionsBlock(buttonElement('Show more', 'showMoreTogetterResults')),
+      inputBlock(this.togetterCheckboxesElement(messages), 'selected_messages', 'Select massages to use.'),
+      actionsBlock(buttonElement({ text: 'Show more', actionId: 'togetterShowMore', value: JSON.stringify({ body, args, limit }) })),
       inputBlock(this.togetterInputBlockElement('page_path', '/'), 'page_path', 'Page path'),
-      actionsBlock(buttonElement('Cancel', 'togetterCancelPageCreation'), buttonElement('Create page', 'togetterCreatePage', 'primary')),
+      actionsBlock(
+        buttonElement({ text: 'Cancel', actionId: 'togetterCancelPageCreation' }),
+        buttonElement({ text: 'Create page', actionId: 'togetterCreatePage', color: 'primary' }),
+      ),
     ];
   };
 
-  handler.togetterCheckboxesElement = function() {
+  handler.togetterCheckboxesElement = function(messages) {
     return {
       type: 'checkboxes',
-      options: this.togetterCheckboxesElementOptions(),
+      options: this.togetterCheckboxesElementOptions(messages),
       action_id: 'checkboxes_changed',
     };
   };
 
-  handler.togetterCheckboxesElementOptions = function() {
-    // increment options with results from conversations.history
-    const options = [];
-    // temporary code
-    for (let i = 0; i < 10; i++) {
-      const option = checkboxesElementOption('username  12:00 PM', 'sample slack messages ... :star:\nsample slack messages ... :star:\n', `selected-${i}`);
-      options.push(option);
-    }
+  handler.togetterCheckboxesElementOptions = function(messages) {
+    const options = messages
+      .sort((a, b) => { return a.ts - b.ts })
+      .map((message, index) => {
+        const date = fromUnixTime(message.ts);
+        return checkboxesElementOption(`*${message.user}*  ${format(new Date(date), 'yyyy/MM/dd HH:mm:ss')}`, message.text, `selected-${index}`);
+      });
     return options;
   };