SOLVED

Adaptive cards oauthCard renders as an empty rectangular

Copper Contributor

Screen Shot 2022-07-12 at 11.05.28 PM.pngHi, 

What I'm doing is in onInstallationUpdateAdd of my ActivityHandler I want to render an oAuth popup card, so that I can later pull user/team details, create a new channel and post in it. Instead of bot dialog I'm trying to send an ActiveCard. I added oauth connection to my bot with props:

clientId: my app's id,

client secret: secret generated in certificates and secrets of my app

grant_type: authorization_code

login url: https://login.microsoftonline.com 

tenantId: copied from my app

resource url: https://graph.microsoft.com

scopes: User.Read.All,TeamSettings.Read.All

 

 

 

 

const userTokenClient = context.turnState.get(context.adapter.UserTokenClientKey);

const { signInLink } = await userTokenClient.getSignInResource(
        this.connectionName,
        context.activity
      );
    
      const ssoCard = CardFactory.oauthCard(
        this.connectionName, // Replace with the name of your Azure AD connection
        'Sign In',
        'Please sign in to install Matterapp',
        signInLink
      );

      await context.sendActivity({
        attachments: [
          CardFactory.adaptiveCard(ssoCard)
        ]
      }

 

 

 

 

I see no errors, no logs, and teams bot chat shows an empty rectangle. What do I do wrong? Can the auth be prompted like that (still struggling to find how to show adaptive card in a popup though). 

 

Thank you

3 Replies
best response confirmed by dmsaprykin (Copper Contributor)
Solution

@dmsaprykin -

 

oAuth Card is a different type of card. It should not be rendered in adaptive card. Please check the Using Cards sample. Which uses rich cards - BotBuilder-Samples/mainDialog.js at 901bc140f5aa300fbfa852e64afd7c65fceebff9 · microsoft/BotBuilder-...

 

Thanks, 

Meghana

---------------------------------------------------------------------------------------------------------- 

If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

Thank you Meghana! And as for popup (Dialog box) it only available for tasks, right? Can bot proactively invoke a task so that I present user with a series of dialog boxes as a welcome experience.
It is not possible to directly open a task module proactively.
1 best response

Accepted Solutions
best response confirmed by dmsaprykin (Copper Contributor)
Solution

@dmsaprykin -

 

oAuth Card is a different type of card. It should not be rendered in adaptive card. Please check the Using Cards sample. Which uses rich cards - BotBuilder-Samples/mainDialog.js at 901bc140f5aa300fbfa852e64afd7c65fceebff9 · microsoft/BotBuilder-...

 

Thanks, 

Meghana

---------------------------------------------------------------------------------------------------------- 

If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

View solution in original post