Merge pull request #2 from murtaza98/uikit-review

apply suggestions from code review

Author: PrajvalRaval

README.md

@@ -61,6 +61,8 @@ You can find all these credentials in a JSON file, which u can get from [here](h
         - The Bot will send this message to Visitor if service is unavailable like suppose if no agents are online.
     9. Close Chat Message (optional)
         - This message will be sent automatically when a chat is closed
+    10. Hide Quick Replies (required)
+        - If enabled, then all quick-replies will hide when a visitor clicks on any one of them
 
 4. (Optional Step) Lastly you can test your Dialogflow Connection by viewing App Logs. To view the logs, goto App Page (`Setting > Apps > Dialogflow`). There click on menu item (3 vertical dots icon) and then select `View Logs`. There select the **most recent** `onSettingUpdated` title. If you see `------------------ Google Credentials validation Success ----------------` message, then it means your setup is fine. If you don't see this message, then recheck your Dialogflow credentials.
 

app.json

@@ -1,6 +1,6 @@
 {
     "id": "21b7d3ba-031b-41d9-8ff2-fbbfa081ae90",
-    "version": "1.0.0",
+    "version": "1.2.0",
     "requiredApiVersion": "^1.15.0",
     "iconFile": "icon.png",
     "author": {

config/Settings.ts

@@ -10,6 +10,7 @@ export enum AppSetting {
     DialogflowHandoverMessage = 'dialogflow_handover_message',
     DialogflowServiceUnavailableMessage = 'dialogflow_service_unavailable_message',
     DialogflowCloseChatMessage = 'dialogflow_close_chat_message',
+    DialogflowHideQuickReplies = 'dialogflow_hide_quick_replies',
 }
 
 export enum DefaultMessage {
@@ -97,4 +98,14 @@ export const settings: Array<ISetting> = [
         i18nDescription: 'dialogflow_close_chat_message_description',
         required: false,
     },
+    {
+        id: AppSetting.DialogflowHideQuickReplies,
+        public: true,
+        type: SettingType.BOOLEAN,
+        packageValue: true,
+        value: true,
+        i18nLabel: 'dialogflow_hide_quick_replies',
+        i18nDescription: 'dialogflow_hide_quick_replies_description',
+        required: true,
+    },
 ];

enum/Dialogflow.ts

@@ -8,10 +8,10 @@ export interface IDialogflowMessage {
 
 export interface IDialogflowQuickReplies {
     text: string;
-    options: Array<IDialogflowQuickRepliesOptions>;
+    options: Array<IDialogflowQuickReplyOptions>;
 }
 
-export interface IDialogflowQuickRepliesOptions {
+export interface IDialogflowQuickReplyOptions {
     text: string;
     actionId?: string;
     buttonStyle?: ButtonStyle;

handler/ExecuteLivechatBlockActionHandler.ts

@@ -20,23 +20,27 @@ export class ExecuteLivechatBlockActionHandler {
         try {
             const interactionData = this.context.getInteractionData();
 
-            const { visitor: { token }, room, container: { id, type }, value } = interactionData;
+            const { visitor, room, container: { id, type }, value } = interactionData;
 
-            if (type !== UIKitIncomingInteractionContainerType.MESSAGE || !room) { return this.context.getInteractionResponder().successResponse(); }
+            if (type !== UIKitIncomingInteractionContainerType.MESSAGE) {
+                return this.context.getInteractionResponder().successResponse();
+            }
 
+            const DialogflowBotUsername: string = await getAppSettingValue(this.read, AppSetting.DialogflowBotUsername);
             const { servedBy: { username = null } = {}, id: rid } = room as ILivechatRoom;
-            if (!username) { return this.context.getInteractionResponder().successResponse(); }
 
-            const DialogflowBotUsername: string = await getAppSettingValue(this.read, AppSetting.DialogflowBotUsername);
-            if (DialogflowBotUsername !== username) { return this.context.getInteractionResponder().successResponse(); }
+            if (!username || DialogflowBotUsername !== username) {
+                return this.context.getInteractionResponder().successResponse();
+            }
 
-            const visitor = await this.read.getLivechatReader().getLivechatVisitorByToken(token);
-            if (!visitor) { return this.context.getInteractionResponder().successResponse(); }
             const appUser = await this.read.getUserReader().getAppUser(this.app.getID()) as IUser;
 
             await createLivechatMessage(rid, this.read, this.modify, { text: value }, visitor);
 
-            await deleteAllActionBlocks(this.modify, appUser, id);
+            const { value: hideQuickRepliesSetting } = await this.read.getEnvironmentReader().getSettings().getById(AppSetting.DialogflowHideQuickReplies);
+            if (hideQuickRepliesSetting) {
+                await deleteAllActionBlocks(this.modify, appUser, id);
+            }
 
             return this.context.getInteractionResponder().successResponse();
         } catch (error) {

i18n/en.json

@@ -12,5 +12,7 @@
     "dialogflow_service_unavailable_message": "Service Unavailable Message",
     "dialogflow_service_unavailable_message_description": "The Bot will send this message to Visitor if service is unavailable",
     "dialogflow_close_chat_message": "Close Chat Message",
-    "dialogflow_close_chat_message_description": "This message will be sent automatically when a chat is closed"
+    "dialogflow_close_chat_message_description": "This message will be sent automatically when a chat is closed",
+    "dialogflow_hide_quick_replies": "Hide Quick Replies",
+    "dialogflow_hide_quick_replies_description": "If enabled, then all quick-replies will hide when a visitor clicks on any one of them"
 }

lib/Message.ts

@@ -3,7 +3,7 @@ import { IVisitor } from '@rocket.chat/apps-engine/definition/livechat';
 import { BlockElementType, BlockType, IActionsBlock, IButtonElement, TextObjectType } from '@rocket.chat/apps-engine/definition/uikit';
 import { IUser } from '@rocket.chat/apps-engine/definition/users';
 import { AppSetting } from '../config/Settings';
-import { IDialogflowMessage, IDialogflowQuickReplies, IDialogflowQuickRepliesOptions } from '../enum/Dialogflow';
+import { IDialogflowMessage, IDialogflowQuickReplies, IDialogflowQuickReplyOptions } from '../enum/Dialogflow';
 import { Logs } from '../enum/Logs';
 import { getAppSettingValue } from './Settings';
 
@@ -14,21 +14,21 @@ export const createDialogflowMessage = async (rid: string, read: IRead,  modify:
         const { text, options } = message as IDialogflowQuickReplies;
 
         if (text && options) {
-    
-            const elements: Array<IButtonElement> = options.map((payload: IDialogflowQuickRepliesOptions) => ({
+            const elements: Array<IButtonElement> = options.map((payload: IDialogflowQuickReplyOptions) => ({
                 type: BlockElementType.BUTTON,
                 text: {
                     type: TextObjectType.PLAINTEXT,
                     text: payload.text,
                 },
                 value: payload.text,
-                actionId: payload.actionId ? payload.actionId : payload.text,
+                actionId: payload.actionId ? payload.actionId : String(Date.now()),
                 ...payload.buttonStyle && { style: payload.buttonStyle },
             } as IButtonElement));
 
             const actionsBlock: IActionsBlock = { type: BlockType.ACTIONS, elements };
 
-            await createMessage(rid, read, modify, { text, actionsBlock });
+            await createMessage(rid, read, modify, { text });
+            await createMessage(rid, read, modify, { actionsBlock });
         } else {
             // message is instanceof string
             if ((message as string).trim().length > 0) {
@@ -98,7 +98,7 @@ export const createLivechatMessage = async (rid: string, read: IRead,  modify: I
 
     const room = await read.getRoomReader().getById(rid);
     if (!room) {
-        this.app.getLogger().error(`${Logs.INVALID_ROOM_ID} ${rid}`);
+        this.app.getLogger().error(`${ Logs.INVALID_ROOM_ID } ${ rid }`);
         return;
     }
 
@@ -121,9 +121,8 @@ export const createLivechatMessage = async (rid: string, read: IRead,  modify: I
     });
 };
 
-export const deleteAllActionBlocks = async (modify: IModify, appUser: IUser, msgId: string) => {
+export const deleteAllActionBlocks = async (modify: IModify, appUser: IUser, msgId: string): Promise<void> => {
     const msgBuilder = await modify.getUpdater().message(msgId, appUser);
-    msgBuilder.setEditor(appUser);
-    msgBuilder.setBlocks(modify.getCreator().getBlockBuilder().getBlocks());
-    await modify.getUpdater().finish(msgBuilder);
+    msgBuilder.setEditor(appUser).setBlocks(modify.getCreator().getBlockBuilder().getBlocks());
+    return modify.getUpdater().finish(msgBuilder);
 };