Closing a teams messaging extension modal from an external service - botframework

I'm opening (using OpenUrl) an external webpage I control. During loading of this web page, from the server I wish to close the teams modal either directly, or by invoking the teams client to resend message with a parameter, so the bot can respond with a close response (which I have working).
I'm able to do other tasks from an external service, like posting messages to existing or new chats. But when I try to set the activity type to invoke, I get BadRequest response.

Task Module modal dialog can be closed using microsoftTeams.tasks.submitTask() which is part of Microsoft Teams JavaScript client SDK. This will closed the Task Module and submit the data back to Bot.
Please take a look at Task Module sample to see how it's called from client code.

Related

MS Teams Message Extension submitTask not working in iPhone Teams App

I have created a message extension with the custom web form, it fails to send any data back to the bot on microsoftTeams.tasks.submitTask. It just closes the form, and the bot submit action method does not receive any data. No issues with other clients like web, windows, or mac. Any way to debug or look into log files on the mobile?
Event tried with this sample code for message extension and used the compiled TaskModule.zip package, it's also not working in the Teams iOS application.
try sending only one parameter into submitTask.You could do something like this.
microsoftTeams.tasks.submitTask(yourObj);

Change the CSS of Chatbot embedded as IFRAME

ISSUE:
Today my chat bot stopped working and started giving the following error. No changes were made on my end when this started happening.
I could not find any error in console log. Then I tested the bot with Emulator and in Azure Portal's Test in Webchat feature and the bot worked fine. This bot is using webchat (iframe embed) as well as DirectLine channel. The DirectLine channel works fine it is only the webchat that is not working.
So to test my theory that I am getting the error because of webchat getting updated by Microsoft. I used the embed code in Azure Portal to use the latest webchat and the webchat channel started working.
BRIEF HISTORY:
To modify the UI of the webchat I used this method to modify the UI of the IFrame of my bot. This method requires to download the source of IFrame, create an HTML page and use that page as a source of your IFRAME in your website (you can see the customization in the image).
Now that I started getting the issue I mentioned above, I tried to do the same thing with the latest version of webchat but it is not working. The webchat is not sending messages and I cannot find what CSS file this new version of webchat is using.
WHAT I NEED GUIDANCE ON:
Either a way to continue using the old webchat with the proper UI
OR
How to update the UI of this new webchat version?
I can't advise on fixing the iframe version, but this already wasn't officially supported, and with the latest webchat update Microsoft is moving more to recommending botframework-webchat (directline) to format the UI. A good place to start is the branding sample.
That sample doesn't spell out the options in the code, but if you take a look at the default options file, that should give you everything you need to customize the chat the way you want.
What this does not do is set up the header that used to be present in ootb webchat (and which I see you customized in your example). Now the best way is to do this in html/css, and you probably can just reuse what you did for your custom option. I just created an additional DIV, set it to height: 40px;, then set the webchat DIV to height: calc(100% - 40px);. Anyone who's good with HTML can probably come up with better than this, essentially you just build your page however you want at that point and the webchat implementation just controls the chat area itself (essentially send box and response/bubble area). I also added a custom button to my header.
<div id="chatbotTitle"><h3 style="padding-left:10px;">OEM CSC Support Bot</h3><button class="btn" id="transcriptButton">Email Transcript</button></div>
<div id="webchat" role="main"></div>
The error you are receiving is not a web chat issue. It is an issue in your bot that is being reported via web chat because that is the client being used.
Usually, this error is referring to an incoming activity that your bot doesn't know how to handle (i.e. your bot logic). For example, you have a waterfall step in your main dialog that, depending on the user's response, opens a component dialog. That dialog gets user information (name, age, etc.) that, when complete, returns to the main dialog. However, the next step isn't prepared as perhaps the user exited that dialog prematurely or didn't answer all the questions as expected.
Whatever the case may be, because it isn't setup to handle the incoming activity, it isn't returning the dialog's turn status. You will need to debug your code, stepping thru it, to see which "step" is the root cause.
For me, I have experienced this when I set up Web Chat to send an event back to my bot. My bot didn't know what to do with the incoming event-type activity and would produce that error.
Hope of help!

MS Teams Messaging Extension submitTask failing with "v3 agent not found" error

I'm creating my first Microsoft Teams extension. For now I'm just trying to get the basic plumbing for a messaging extension working. I'm trying to build an extension which will allow a user to search for content in my service and then return a card into their compose window in personal and Teams chats.
I've tried to follow the basic guide ( https://learn.microsoft.com/en-us/microsoftteams/platform/messaging-extensions/how-to/create-messaging-extension ) for creating a messaging extension using App Studio. I've setup a bot as it describes, and I have built a dummy echobot endpoint for the bot (using Ruby). I am able to "chat" with my bot directly in the Teams client and it is able to respond.
My messaging extension defines an action based command with a taskInfo with a web view URL to render and a fetchTask set to false. I've written a basic static HTML page for this and included the teams-js library. The web view loads and the teams-js library initialization callback is called. I have a submit button which calls microsoftTeams.tasks.submitTask which as I understand it, should be calling my bot with a "composeExtension/submitAction" message to which I would respond with the card. (Based on https://learn.microsoft.com/en-us/microsoftteams/platform/messaging-extensions/how-to/action-commands/respond-to-task-module-submit?tabs=json )
I've tried installing my extension in Teams through the "Upload a custom app" option both as a "for me and my teams" and "for " but still have the following issues.
When I open my extension in the Teams client from the compose area and click this submit button in my iframe content, the submit I get a "Unable to reach app. Please try again" error displayed. In the dev console, I can see that the response to the "invoke" http post is {"errorCode":404,"message":"V3 agent not found."}
No traffic is actually sent to my bot during any of this process.
I saw this older post - Compose extension is throwing error : V3 agent not found . The https://dev.botframework.com/bots/ it refers to seems to be outdated, but in the Azure "Bot Channels Registration" console, I have gone to Channels and added "Microsoft Teams" (which I believe is the new equivalent).
Has anyone seen this happen and figured out what was going on? Much thanks!
Here is sample code for composeExtension/submitAction for Bot SDK V3. Make sure you pass the bot id and command text in taskInfo object.
case "composeExtension/submitAction":
string commandid = JsonConvert.DeserializeObject<Models.TaskModuleSubmitData<string>>(activityValue).commandId;
taskInfo = GetTaskInfo(commandid);
taskEnvelope = new Models.TaskEnvelope
{
Task = new Models.Task()
{
Type = Models.TaskType.Continue,
TaskInfo = taskInfo
}
};
return Request.CreateResponse(HttpStatusCode.OK, taskEnvelope);
Hilton had the right answer.
I had grabbed the Subscription ID from the Bot Channels Registration page instead of the App ID from the Azure Active Directory -> Apps Registration page and used that in the messaging extension manifest as the "botId" in the composeExtensions array. After fixing that I'm now getting messages submitted to my bot backend.

Slack API - clicking a button in a Slack conversation sends a message on the channel

In a Slack conversation, is it possible to click on a button to send a message to the Slack channel?
The Slack conversation could be:
The user types a word (or message)
A slackbot shows some text and two buttons
The user clicks on a button to send a TEXT message to the Slack channel
The Slackbot reacts on the 'action' message.
It is not possible to create an REST service for my Slackbot, because the Slackbot is behind a firewall. So, registering commands is not possible.
So sending a message as the result of a button click is needed. The Slackbot can react on that message.
I read that attachments could be a good way to do this, BUT the is 'outmoded'.
I tried to send an secondary attachment, which is outmoded, but that was not possible.
The next approach was adding a webhook. So pushing a button resulted in using the url, but that is of course not possible because I cannot send a POST request via a simple (get) url.
Please give a short example.
This will not work.
Every interactive feature (e.g. buttons) require your app to be able to receive POST requests from Slack through the public Internet. Since you say you can not provide that (e.g. behind a company firewall) you will not be able to use any interactive features.
See also this answer: How to integrate internal APIs (Not accessible outside office network) to slack slash commands

Chat history Persistence in MicroSoft Botframework WebChat window

I have a requirement of maintaining chat history and loading them back in a window after a page refresh or close and opening of the window.
ISSUE : Buttons/carousel/Adaptive cards/Hero Cards events/ properties are not loading (ie; when I click on button or any event, actions are not happening).
DESCRIPTION:
In order to achieve the requirement i had 2 options.
BotFramework _ Directline JS
I guess using this we can only get conversation history and where we couldn't load back the conversation history in chat window.
Though we can get the conversation history we have to send all the messages to bot again.
So i had opted 2nd one.
Store the html controls and Load it in the bot div: When sending or receiving message action is happening from bot am storing the html controls(i.e; controls under wc-message-groups class in local storage) and binding back to the div on page load if data exists.
This works for me to show conversation history in a chat window. But I am not able to get the events/actions for buttons.
Can we do this with Directline JS or is there any option to load properties/events to controls?
Please help me with this issue.
Thanks in Advance
I would start by taking a look at this thread out the Webchat GitHub repo. There is a good discussion going on about how this may be accomplished.
I also created this project in C# using webchat which will provide chat history in the webchat control. The project uses this pull request branch which you would also need to use. Hope this helps, good luck.

Resources