docs: update TS/PY auth docs for multi-connection oauth - #2975
docs: update TS/PY auth docs for multi-connection oauth#2975Lily Du (lilyydu) wants to merge 4 commits into
Conversation
Adds SDK 2.1 (Legacy) / SDK 2.2 (current) tabs across the TypeScript and Python user-authentication guide and updates every auth-adjacent example to the new per-connection OAuth flow API. - user-authentication: tab every code section; new "Using multiple OAuth connections" and "Checking connection status" sections; retitle the signin-event section to "Handling sign-in completion"; document the signin/failure attribution fallback - essentials/graph: userGraph / user_graph are deprecated — show building a Graph client from a flow token - essentials/on-event: point at per-flow callbacks over the app-wide signin event; drop the deprecated userGraph example - migrations (botbuilder + v1): move the "after" samples onto the flow API Python-only fixes: correct stale `teams.*` imports to `microsoft_teams.*` and an undefined `context` reference in the botbuilder migration sample. Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
Nick Walker (nickwalkmsft)
left a comment
There was a problem hiding this comment.
When it's convenient, could you draft a short (just a couple sentences) summary of what multi-auth is, in the form of a feature announcement?
Is this a breaking change for people upgrading from 2.1?
The multi-connection OAuth work ships in 2.1 rather than 2.2, so relabel the TypeScript and Python version tabs accordingly. This also matches the labels already used by the C# auth and functions guides. Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
`Language` typed its prop as a single language and tested the path with
`pathname.includes(`/${language}/`)`. Four call sites pass an array, which
stringifies to "typescript,python", so the test looked for the path segment
`/typescript,python/`, never matched, and the component returned null —
silently dropping its children on every page.
Accept `Language | readonly Language[]` and match if any listed language
matches the current path.
This restores content that was invisible sitewide, not just on the auth
page: the two intro paragraphs on the Essentials landing page and the
OAuth connection-name note both render again. Single-language gating is
unchanged.
Also add blank lines around the admonition inside that `<Language>` block
so the markdown is parsed, matching the surrounding convention.
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
|
|
||
| Build the client from an OAuth flow's token, so it's always scoped to the connection that owns it. | ||
|
|
||
| ```python |
There was a problem hiding this comment.
for all languges the transition from app graph to user graph on this page happens very quietly, I think we should make the distinction clearer .
Also TS has many more sections, wondering if we can trim/standardize as part of this PR ?
| </TabItem> | ||
| </Tabs> | ||
|
|
||
| <!-- multiple-connections --> |
There was a problem hiding this comment.
Can we also change C# to match PY and TS here ? or vice versa? Right now C# has the multiple connections section but they have already been introduced in signing in, seems weird
Same for connection status , can we include in C# too please ?
| When a user signs in using `OAuth` or `SSO`, use the graph api to fetch their profile and say hello. | ||
|
|
||
| ```typescript | ||
| import { Client as GraphClient } from '@microsoft/teams.graph'; |
There was a problem hiding this comment.
Should we make PY and TS have the same examples ? Right now they're different
There was a problem hiding this comment.
🟡 Changes recommended
Several updated TypeScript examples are internally inconsistent about whether helpers/client builders receive token vs token.token, and the BotBuilder migration samples drop the “already signed in” path by ignoring signIn()’s return value.
Once you've addressed the issues Copilot identified, you can request another Copilot review.
Pull request overview
Updates the docs to reflect the newer per-connection OAuth flow API (multi-connection capable), and adds versioned (legacy vs current) tabs across TypeScript/Python auth guidance and related essentials/migration pages.
Changes:
- Add multi-connection + connection-status sections to the in-depth user-authentication guide and includes.
- Update TS/PY examples to use per-connection OAuth flows (
addOAuthFlow/add_oauth_flow) and scoped completion handlers. - Enhance the
Languagecomponent to support rendering content for multiple languages on the same page.
File summaries
| File | Description |
|---|---|
| teams.md/src/pages/templates/in-depth-guides/user-authentication.mdx | Updates guide narrative/headings; adds multi-connection + status + warning notes. |
| teams.md/src/components/Language.tsx | Allows <Language> to accept multiple languages (array) for shared TS/PY blocks. |
| teams.md/src/components/include/migrations/v1/typescript.incl.md | Updates v1 migration TS auth snippet to per-connection flow API. |
| teams.md/src/components/include/migrations/v1/python.incl.md | Updates v1 migration PY auth snippet to per-connection flow API. |
| teams.md/src/components/include/migrations/botbuilder/user-authentication/typescript.incl.md | Updates BotBuilder→Teams SDK TS migration snippet to per-connection flow API. |
| teams.md/src/components/include/migrations/botbuilder/user-authentication/python.incl.md | Updates BotBuilder→Teams SDK PY migration snippet to per-connection flow API. |
| teams.md/src/components/include/in-depth-guides/user-authentication/typescript.incl.md | Adds legacy/current tabs; updates examples for per-connection flow, multi-connection, status, pending messages, failure handling. |
| teams.md/src/components/include/in-depth-guides/user-authentication/python.incl.md | Adds legacy/current tabs; updates examples for per-connection flow, multi-connection, status, pending messages, failure handling. |
| teams.md/src/components/include/in-depth-guides/user-authentication/csharp.incl.md | Adds placeholders for multi-connection/status sections in the shared include. |
| teams.md/src/components/include/essentials/on-event/typescript.incl.md | Updates sign-in event guidance to use per-connection completion callback. |
| teams.md/src/components/include/essentials/on-event/python.incl.md | Adds tip clarifying per-connection sign-in handlers vs app-wide event. |
| teams.md/src/components/include/essentials/graph/typescript.incl.md | Adds legacy/current tabs; updates “user graph” example to flow-token based client creation. |
| teams.md/src/components/include/essentials/graph/python.incl.md | Adds legacy/current tabs; updates “user graph” example to flow-token based client creation. |
Review details
Suppressed comments (2)
teams.md/src/components/include/in-depth-guides/user-authentication/typescript.incl.md:313
- [HIGH]
processMessagereceivestokenhere, but later receivestoken.token. Pick one shape (prefer the access-token string) so the example is consistent and copy/paste-safe.
return;
}
await processMessage(ctx.activity.text, ctx, token);
});
teams.md/src/components/include/in-depth-guides/user-authentication/typescript.incl.md:225
- [HIGH] This section passes different token shapes into the same helpers (
tokenvstoken.token). That makes the sample ambiguous/incorrect (and likely breaks if helpers expect an access-token string).
app.message('/graph', async (ctx) => {
const token = await graph.signIn(ctx);
if (token) await sendGraphProfile(ctx, token);
});
- Files reviewed: 13/13 changed files
- Comments generated: 5
- Review effort level: Lite
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
| app.on('message', async (ctx) => { | ||
| const token = await graph.signIn(ctx); | ||
| if (!token) return; // OAuth card sent — resumes on the callback turn | ||
|
|
||
| const client = new GraphClient({ token: () => token }, { baseUrlRoot: app.graphBaseUrl }); | ||
| const me = await client.call(endpoints.me.get); |
| app.message('/whoami', async (ctx) => { | ||
| const token = await graph.signIn(ctx); | ||
| if (!token) return; // OAuth card sent — resumes on the callback turn | ||
|
|
||
| const client = new GraphClient({ token: () => token }, { baseUrlRoot: app.graphBaseUrl }); | ||
| const me = await client.call(endpoints.me.get); |
| @app.on_message | ||
| async def on_message(context: ActivityContext[MessageActivity]): | ||
| if not context.is_signed_in: | ||
| await context.sign_in() | ||
| return | ||
| async def on_message(ctx: ActivityContext[MessageActivity]): | ||
| await flow.sign_in(ctx) |
| app.on('message', async (ctx) => { | ||
| await flow.signIn(ctx); | ||
| }); |
|
|
||
| // Only render if current path matches language | ||
| if (!location.pathname.includes(`/${language}/`)) { | ||
| const languages = Array.isArray(language) ? language : [language as Language]; |
adds tabs across the TypeScript and Python user-authentication guide and updates examples to the new per-connection OAuth flow API