Skip to main content

2 posts tagged with "react"

View All Tags

· 14 min read
Sajeetharan Sinnathurai

Building an AI agent with Azure Cosmos DB is easy to demonstrate. Building the secure, observable, and deployable application around that agent is the difficult part.

A real customer-facing agent needs more than a prompt and a model endpoint. It needs durable memory, tenant isolation, authentication, citations, diagnostics, tests, deployment infrastructure, and a safe way to move from a local prototype to production.

I wanted to see how much of that work could be removed from the critical path, so I tried the create-cosmos-agent starter from beginning to end. I generated a customer-support agent, ran it against the Azure Cosmos DB Linux emulator, stored a customer preference, retrieved it through the chat experience, verified user isolation, inspected diagnostics, and ran the complete validation suite.

The result was a working full-stack application without an Azure subscription, model API key, or cloud resource.

Build an AI agent with Azure Cosmos DB using React, TypeScript, durable memory, tenant isolation, and the local emulator

Quick answer

create-cosmos-agent generates a React and TypeScript agent application with memory, tenant isolation, citations, diagnostics, tests, and Azure infrastructure. The default local path needs no Azure subscription or model key; choose the Cosmos DB emulator when you want durable local data.

· 3 min read

I was working with a partner recently in developing Apps and integrated them as a part of Teams. At times there are questions from customers whether they would be able to utilize the features of teams within their application. The simple answer for the will be NO as Teams Platform Architecture is enabling developers to bring adoption to teams by building more applications from different industry verticals which can be embedded inside teams

However there are two ways you can make the user to navigate to Microsoft Teams from the web application or even from Outlook.

Make a clickable link for Teams chat :

Here is a handy tip on how to make a one-click link that will open up Teams chat to you or the person who is already logged in. Say if you are using a web application which is on Angular, simply you can add a click event to navigate to teams with the code,

 takeUserToTeams() {
window.location.href='http://teams.microsoft.com/l/chat/0/[email protected]';
}

When the user click on the button it will open a web page where the user will sign-in with their Microsoft account. If the Teams app is installed on the client's computer, the web page will offer to open the chat in the Teams client, otherwise they can use the Teams web browser experience

User Navigation from web app to Teams

Opening chat seamlessly once user login

This is a very simple tip but most of the customers are asking for a way to do the same.

Create a Share to Microsoft Teams​

Third-party websites can also use the launcher script to embed Share to Teams buttons on their webpages which will launch the Share to Teams experience in a popup window when clicked. This will allow you to share a link directly to any person or Microsoft Teams channel without switching context.

Step 1: Add  launcher.js script on your webpage.

https://teams.microsoft.com/share/launcher.js

Step 2 : add an HTML element on your webpage with the teams-share-button class attribute and the link to share in the data-href attribute.

<div
class="teams-share-button"
data-href="https://<link-to-be-shared>">
</div>

This will add the Microsoft Teams icon to your website.

Share to Teams icon

That's it whenever user click the button content will be posted on the user directly from your apps to teams.

Hope these 2 tips helps someone out there to integrate teams with your application easily to navigate the users to teams!