{"id":15009,"date":"2023-08-21T08:00:27","date_gmt":"2023-08-21T15:00:27","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/?p=15009"},"modified":"2023-08-21T08:59:51","modified_gmt":"2023-08-21T15:59:51","slug":"teams-toolkit-for-visual-studio-code-update-with-new-ai-chat-bot-template","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/teams-toolkit-for-visual-studio-code-update-with-new-ai-chat-bot-template\/","title":{"rendered":"Teams Toolkit for Visual Studio Code update with new AI chat bot template"},"content":{"rendered":"<p>Welcome to the August 2023 update for Teams Toolkit for Visual Studio Code! In this release, we&#8217;re excited to bring you an array of new features to make your Teams app development experience even better, including:<\/p>\n<ul>\n<li>AI Chat Bot App Template<\/li>\n<li>One Productivity Hub sample using Graph Toolkit with SPFx<\/li>\n<li>Enhanced <code>teamsapp.yml<\/code> with CodeLens<\/li>\n<\/ul>\n<p>Additionally, there are many other enhancements and bug fixes. Let\u2019s dive in!<\/p>\n<h2>AI chat bot app template<\/h2>\n<p><img decoding=\"async\" width=\"1440\" height=\"960\" class=\"wp-image-15010 aligncenter\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-1.png\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-1.png 1440w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-1-300x200.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-1-1024x683.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-1-768x512.png 768w\" sizes=\"(max-width: 1440px) 100vw, 1440px\" \/><\/p>\n<p>We&#8217;re thrilled to introduce the new AI chat bot app template, designed to kickstart your journey building sophisticated chat bots with AI capabilities using the Teams AI Library. This template empowers you to create GPT-like chat bots that can engage and interact intelligently with users.<\/p>\n<p>Teams AI Library is a Teams-centric interface to GPT-based common language models and user intent engines. It provides a simple capabilities-driven approach and helps you to create intelligent apps quickly and easily. The library helps you with:<\/p>\n<ul>\n<li>Simple Teams-centric component scaffolding<\/li>\n<li>Natural language modeling<\/li>\n<li>Prompt engineering<\/li>\n<li>Predictive engine for mapping intents to actions<\/li>\n<\/ul>\n<p>Check out Teams AI Library <a href=\"https:\/\/github.com\/microsoft\/teams-ai\">repository<\/a> or read more on the official <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/bots\/how-to\/teams%20conversational%20ai\/teams-conversation-ai-overview\">documentation site<\/a>.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-15011\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-2.gif\" alt=\"Here is a GIF showing the AI chat cot app running in Microsoft Teams\" width=\"1713\" height=\"1555\" \/><\/p>\n<h2>One Productivity Hub sample using Graph Toolkit with SPFx<\/h2>\n<p>Our new sample, One Productivity Hub using Graph Toolkit with SPFx, showcases how to craft a tab that seamlessly displays your calendar events, to-do tasks, and files. By utilizing Microsoft Graph Toolkit components and SharePoint provider, you&#8217;ll be able to enhance user productivity and convenience.<\/p>\n<p><img decoding=\"async\" class=\"aligncenter wp-image-15012\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-3.png\" alt=\"Teams Toolkit for Visual Studio code window using the New SPFX sample with Graph Toolkit - One Productivity Hub\" width=\"1440\" height=\"960\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-3.png 1440w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-3-300x200.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-3-1024x683.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-3-768x512.png 768w\" sizes=\"(max-width: 1440px) 100vw, 1440px\" \/><\/p>\n<h2>Enhanced <code>teamsapp.yml<\/code> with CodeLens<\/h2>\n<p>Editing the <code>teamsapp.yml<\/code> file in Teams Toolkit for Visual Studio Code has become more efficient with the added CodeLens feature. Now, running life-cycle commands after editing the file is as simple as a click, streamlining your development workflow. <img decoding=\"async\" class=\"alignnone wp-image-15013\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-4.png\" alt=\"Screenshot showing Visual Studio Code running in Teams Toolkit, running life-cycle commands (with Code Lens) after editing the file.\" width=\"1440\" height=\"960\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-4.png 1440w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-4-300x200.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-4-1024x683.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2023\/08\/word-image-15009-4-768x512.png 768w\" sizes=\"(max-width: 1440px) 100vw, 1440px\" \/><\/p>\n<h2>Enhancements<\/h2>\n<ul>\n<li>Our <code>Collect Form Input and Process Data<\/code> template has been refined to eliminate redundant code, making creating interactive and efficient forms easier than ever.<\/li>\n<li>The <code>Custom Search Result<\/code> template now employs Adaptive Cards for rendering search results, enhancing your app&#8217;s visual appeal and utility.<\/li>\n<li>Encountering system errors is never ideal, but now, Teams Toolkit makes troubleshooting easier. When errors arise, you&#8217;ll find a link that directs you to similar issues, helping you swiftly find solutions.<\/li>\n<li>Importing xml-based Outlook add-in projects has become more user-friendly with the addition of a progress bar, giving you clearer visibility during the import process.<\/li>\n<\/ul>\n<h2>Teams Toolkit CLI and TeamsFx SDK Updates<\/h2>\n<p>Also, we made noteworthy changes to our CLI and SDK to enhance your development experience.<\/p>\n<h3>Teams Toolkit CLI (<code>@microsoft\/teamsfx-cli<\/code>)<\/h3>\n<p>We&#8217;re pleased to introduce the version <code>v2.0.2@beta<\/code> of our CLI. The <code>teamsfx new<\/code> command now starts by allowing you to choose from various app templates. Simply use <code>teamsfx new template &lt;sample-app-name&gt;<\/code> to swiftly create a project from sample apps.<\/p>\n<h3>TeamsFx SDK (<code>@microsoft\/teamsfx<\/code>)<\/h3>\n<p>Our TeamsFx SDK has advanced to <code>v2.2.3@beta<\/code>. As part of this update, we&#8217;ve deprecated the <code>TeamsFx<\/code> class, introduced replacements for APIs like <code>handleMessageExtensionQueryWithToken<\/code>, and made improvements in authentication with <code>TokenCredentialAuthentication<\/code>.<\/p>\n<p>Here is the list of changes in this version of TeamsFx SDK:<\/p>\n<ul>\n<li>Deprecated <code>TeamsFx<\/code> class as it&#8217;s no longer being used to construct credentials anymore.<\/li>\n<li>Deprecated <code>handleMessageExtensionQueryWithToken<\/code> API as it has been replaced by <code>handleMessageExtensionQueryWithSSO<\/code>.<\/li>\n<li>Deprecated <code>AuthenticationConfiguration<\/code> interface as it has been replaced by <code>OnBehalfOfCredentialAuthConfig<\/code> type.<\/li>\n<li>Deprecated <code>MsGraphAuthProvider<\/code> class as <code>TokenCredentialAuthentication<\/code> has been natively supported in <a href=\"https:\/\/github.com\/microsoftgraph\/msgraph-sdk-javascript\/blob\/dev\/docs\/TokenCredentialAuthenticationProvider.md\">Microsoft Graph Client Library since version 3.0.0<\/a>.<\/li>\n<\/ul>\n<h2>Bug fixes<\/h2>\n<p>We&#8217;ve been diligent in addressing issues to ensure a seamless experience for you:<\/p>\n<ul>\n<li>Fixed a problem with input arguments being ignored in <code>teamsfx validate<\/code> command when setting <code>--interactive false<\/code>.<\/li>\n<li>Restored the appearance of the Get Started with Teams Toolkit for new users after installation.<\/li>\n<li>Resolved a missing option issue in <code>teamsfx new template &lt;sample-name&gt;<\/code> command for Teams Chef Bot.<\/li>\n<li>Ensured the <code>Teams: Upgrade Teams Manifest<\/code> command updates the manifest to the expected version.<\/li>\n<li>Rectified a severity vulnerability reported when using Teams Toolkit CLI.<\/li>\n<\/ul>\n<p>We \ud83d\udc96 your feedback<\/p>\n<p>Thank you for all your feedback that has helped make this release possible. Build with us <a href=\"https:\/\/github.com\/officedev\/teamsfx\" target=\"_blank\" rel=\"noopener\">on GitHub<\/a>, share feedback <a href=\"https:\/\/github.com\/officedev\/teamsfx\/issues\" target=\"_blank\" rel=\"noopener\">as an issue<\/a>, or email our team directly at <a href=\"mailto:ttkfeedback@microsoft.com\" target=\"_blank\" rel=\"noopener\">ttkfeedback@microsoft.com<\/a>.<\/p>\n<p>We are excited for you to try <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/toolkit\/install-teams-toolkit?tabs=vscode#install-a-pre-release-version\" target=\"_blank\" rel=\"noopener\">Teams Toolkit for Visual Studio Code Prelease<\/a>. Please share your experience with us.<\/p>\n<p>More resources:<\/p>\n<ul>\n<li>Visit our <a href=\"https:\/\/developer.microsoft.com\/en-us\/microsoft-365\">Microsoft 365 Dev Center.<\/a><\/li>\n<li>Follow us on <a href=\"https:\/\/twitter.com\/Microsoft365Dev\">Microsoft 365 Developer (@Microsoft365Dev) \/ Twitter<\/a> for the latest news and announcements.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Explore updates from the latest Teams Toolkit for Visual Studio Code release, including a new AI chat bot template, a new sample, and more.<\/p>\n","protected":false},"author":43243,"featured_media":15016,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[128],"tags":[34,23,19,44],"class_list":["post-15009","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-microsoft-teams","tag-microsoft-graph-toolkit","tag-teams-toolkit","tag-sharepoint-framework","tag-visual-studio-code"],"acf":[],"blog_post_summary":"<p>Explore updates from the latest Teams Toolkit for Visual Studio Code release, including a new AI chat bot template, a new sample, and more.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/15009","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/43243"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=15009"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/15009\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/15016"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=15009"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=15009"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=15009"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}