From de90019a5d81c95973f25fd047e533a2bcecec99 Mon Sep 17 00:00:00 2001 From: Ester Uras Date: Wed, 7 Oct 2026 11:22:11 +0200 Subject: [PATCH 1/3] user authentication docs --- .../extensibility-api/web/_index.md | 1 + .../user-authentication-api.md | 145 ++++++++++++++++++ 2 files changed, 146 insertions(+) create mode 100644 content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/user-authentication-api.md diff --git a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md index f737de2e4d9..aef71032c4f 100644 --- a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md +++ b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md @@ -55,3 +55,4 @@ The following how-tos help you get started: * [How to Listen for Connection Changes](/apidocs-mxsdk/apidocs/web-extensibility-api-11/runtime-controller-api/) * [How to Access Runtime Constants](/apidocs-mxsdk/apidocs/web-extensibility-api-11/runtime-configuration-api/) * [How to Use Extension Permissions in Overview Pane](/apidocs-mxsdk/apidocs/web-extensibility-api-11/extension-permissions/) +* [How to Query User Authentication](/apidocs-mxsdk/apidocs/web-extensibility-api-11/user-authentication-api/) diff --git a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/user-authentication-api.md b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/user-authentication-api.md new file mode 100644 index 00000000000..b30aee5e023 --- /dev/null +++ b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/user-authentication-api.md @@ -0,0 +1,145 @@ +--- +title: "Query User Authentication Using Web API" +linktitle: "User Authentication" +url: /apidocs-mxsdk/apidocs/web-extensibility-api-11/user-authentication-api/ +description: "Describes how to query the signed-in user's authentication state and profile in Studio Pro using the Web Extensibility API." +--- + +## Introduction + +This document describes how to query the signed-in user's authentication state and profile in Studio Pro, and how to react to the user signing in or out. + +The user authentication API is available to extensions through `studioPro.ui.userAuthentication`. It lets you check whether a user is signed in, retrieve the user's profile information, and subscribe to `signedIn` and `signedOut` events. + +## Prerequisites + +Before starting this how-to, complete the following prerequisites: + +* This how-to uses the results of [Get Started with the Web Extensibility API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/). Complete that how-to before starting this one. +* Make sure you are familiar with creating menus as described in [Create a Menu Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu-api/), message boxes as described in [Show a Message Box Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/messagebox-api/), and notifications as described in [Show a Pop-up Notification Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/notification-api/). + +## Showing the User's Authentication State + +With the user authentication API, you can create a menu item that shows whether a user is currently signed in and, when signed in, displays the user's profile details. You also subscribe to the `signedIn` and `signedOut` events to show a notification whenever the authentication state changes. + +Replace your `src/main/index.ts` file with the following: + +```typescript +import { IComponent, Menu, getStudioProApi } from "@mendix/extensions-api"; + +export const component: IComponent = { + async loaded(componentContext) { + const studioPro = getStudioProApi(componentContext); + + const userAuthenticationApi = studioPro.ui.userAuthentication; + const menuApi = studioPro.ui.extensionsMenu; + const messageBoxApi = studioPro.ui.messageBoxes; + const notificationsApi = studioPro.ui.notifications; + + const menuId = "user-authentication-menu"; + + // React to the user signing in. + userAuthenticationApi.addEventListener("signedIn", async () => { + const profileResult = await userAuthenticationApi.getUserProfile(); + const displayName = profileResult.result === "success" ? profileResult.profile.displayName : "unknown user"; + + await notificationsApi.show({ + title: "Signed in", + message: `User ${displayName} signed in`, + displayDurationInSeconds: 4 + }); + }); + + // React to the user signing out. + userAuthenticationApi.addEventListener("signedOut", async () => { + await notificationsApi.show({ + title: "Signed out", + message: "User signed out", + displayDurationInSeconds: 4 + }); + }); + + const menu: Menu = { + caption: "Current user authentication", + menuId, + action: async () => { + const isSignedIn = await userAuthenticationApi.isSignedIn(); + + if (!isSignedIn) { + await messageBoxApi.show("info", "Not signed in"); + return; + } + + const profileResult = await userAuthenticationApi.getUserProfile(); + + if (profileResult.result === "success") { + await messageBoxApi.show( + "info", + `Display name: ${profileResult.profile.displayName}\nUsername: ${profileResult.profile.userName}` + ); + } + } + }; + + await menuApi.add(menu); + } +}; +``` + +This code does the following: + +* It uses `userAuthenticationApi` from `studioPro.ui.userAuthentication` to access the user authentication API. +* It subscribes to the `signedIn` event to show a notification with the user's display name whenever a user signs in. +* It subscribes to the `signedOut` event to show a notification whenever a user signs out. +* It adds a menu item named **Current user authentication** that checks `isSignedIn()` and, when a user is signed in, shows the user's display name and username in a message box. + +## User Authentication API + +This API provides events and methods that relate to the signed-in user's authentication state and profile. + +* `signedIn` +* `signedOut` +* `isSignedIn` +* `getUserProfile` + +| Event | Description | Payload | +|--------------|-------------------------------|----------------| +| `signedIn` | Triggers when a user signs in. | Empty object | +| `signedOut` | Triggers when a user signs out. | Empty object | + +### `UserProfile` Properties + +| Property | Type | Description | +|---------------|--------|--------------------------------------------| +| `userName` | string | The user's username. | +| `displayName` | string | The user's display name. | +| `avatarUrl` | string | A URL pointing to the user's avatar image. | + +### How to Listen to an Event + +```typescript +studioPro.ui.userAuthentication.addEventListener("signedIn", async () => { + ... +} +studioPro.ui.userAuthentication.addEventListener("signedOut", async () => { + ... +} +``` + +### Checking Whether a User Is Signed In + +This API provides an `isSignedIn` method that returns a `Promise` that resolves to `true` when a user is currently signed in to Studio Pro, and `false` otherwise. + +### Getting the User Profile + +This API provides a `getUserProfile` method that returns a `Promise` describing the signed-in user's profile. The result is a discriminated union on the `result` property: + +* `{ result: "error" }` – the profile could not be retrieved. +* `{ result: "userNotSignedIn" }` – no user is currently signed in. +* `{ result: "success"; profile: UserProfile }` – the profile was retrieved successfully, where `UserProfile` contains the properties listed above. + +## Extensibility Feedback + +If you would like to provide additional feedback, you can complete a short [survey](https://survey.alchemer.eu/s3/90801191/Extensibility-Feedback). + +Any feedback is appreciated. From 7dfb435cdd5349b16d68fc9074a203dd4eb80a39 Mon Sep 17 00:00:00 2001 From: Ester Uras Date: Wed, 7 Oct 2026 11:51:06 +0200 Subject: [PATCH 2/3] maia docs --- .../extensibility-api/web/_index.md | 1 + .../web/web-extensions-howtos/maia-api.md | 77 +++++++++++++++++++ 2 files changed, 78 insertions(+) create mode 100644 content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md diff --git a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md index aef71032c4f..b8da9068ae0 100644 --- a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md +++ b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/_index.md @@ -56,3 +56,4 @@ The following how-tos help you get started: * [How to Access Runtime Constants](/apidocs-mxsdk/apidocs/web-extensibility-api-11/runtime-configuration-api/) * [How to Use Extension Permissions in Overview Pane](/apidocs-mxsdk/apidocs/web-extensibility-api-11/extension-permissions/) * [How to Query User Authentication](/apidocs-mxsdk/apidocs/web-extensibility-api-11/user-authentication-api/) +* [How to Set the Maia Chat Prompt](/apidocs-mxsdk/apidocs/web-extensibility-api-11/maia-chat-api/) diff --git a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md new file mode 100644 index 00000000000..14da65c084a --- /dev/null +++ b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md @@ -0,0 +1,77 @@ +--- +title: "Set the Maia Chat Prompt Using Web API" +linktitle: "Maia Chat" +url: /apidocs-mxsdk/apidocs/web-extensibility-api-11/maia-chat-api/ +description: "Describes how to populate the Maia Agent chat prompt from an extension in Studio Pro using the Web Extensibility API." +--- + +## Introduction + +This document describes how to populate the Maia Agent chat prompt from an extension in Studio Pro, ready for the user to review and send. For example, an extension can take text that the user selects and send it to the Maia chat as a prompt. + +The Maia chat API is available to extensions through `studioPro.ai.chat`. + +## Prerequisites + +Before starting this how-to, complete the following prerequisites: + +* This how-to uses the results of [Get Started with the Web Extensibility API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/getting-started/). Complete that how-to before starting this one. +* Make sure you are familiar with creating menus as described in [Create a Menu Using Web API](/apidocs-mxsdk/apidocs/web-extensibility-api-11/menu-api/). + +## Setting the Maia Chat Prompt + +With the Maia chat API, you can set a prompt text in the Maia Agent chat. + +Replace your `src/main/index.ts` file with the following: + +```typescript +import { IComponent, getStudioProApi } from "@mendix/extensions-api"; + +export const component: IComponent = { + async loaded(componentContext) { + const studioPro = getStudioProApi(componentContext); + + const maiaChatApi = studioPro.ai.chat; + const menuId = "set-maia-prompt-menu"; + + await studioPro.ui.extensionsMenu.add({ + menuId, + caption: "Ask Maia about my app", + action: async () => { + await maiaChatApi.setChatPrompt("Explain what this app does and suggest improvements."); + } + }); + } +}; +``` + +This code does the following: + +* It uses `maiaChatApi` from `studioPro.ai.chat` to access the Maia chat API. +* It adds a menu item named **Ask Maia about my app** that calls `setChatPrompt` to populate the Maia Agent chat input. + +You can also set the prompt from text the user selects in your own editor UI. For example, from a context-menu action on a text area: + +```typescript +const sendToMaiaHandler = async (textarea: HTMLTextAreaElement | null) => { + if (textarea) { + await studioPro.ai.chat.setChatPrompt(textarea.value); + } +}; +``` + +## Maia Chat API + +This API provides a method that allows interacting with the Maia Agent chat. + +* `setChatPrompt` + +### Setting the Chat Prompt + +The `setChatPrompt` method takes a `prompt` string and places it into the Maia Agent chat input. The prompt is not sent automatically, so the user can review, edit, and send it. If the Maia tab is not open, it is opened and made active. + +## Extensibility Feedback + +If you would like to provide additional feedback, you can complete a short [survey](https://survey.alchemer.eu/s3/90801191/Extensibility-Feedback). + +Any feedback is appreciated. From 1a99482178d6935bf96cf61aed4bb1b32e941fda Mon Sep 17 00:00:00 2001 From: Sofia Bili Date: Mon, 12 Oct 2026 15:09:23 +0200 Subject: [PATCH 3/3] Update maia-api.md Update a value in the setChat prompt --- .../web/web-extensions-howtos/maia-api.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md index 14da65c084a..5e0368a92db 100644 --- a/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md +++ b/content/en/docs/apidocs-mxsdk/apidocs/studio-pro-11/extensibility-api/web/web-extensions-howtos/maia-api.md @@ -38,7 +38,7 @@ export const component: IComponent = { menuId, caption: "Ask Maia about my app", action: async () => { - await maiaChatApi.setChatPrompt("Explain what this app does and suggest improvements."); + await maiaChatApi.setChatPrompt("Explain what this app does and suggest improvements.", true); } }); } @@ -48,17 +48,18 @@ export const component: IComponent = { This code does the following: * It uses `maiaChatApi` from `studioPro.ai.chat` to access the Maia chat API. -* It adds a menu item named **Ask Maia about my app** that calls `setChatPrompt` to populate the Maia Agent chat input. +* It adds a menu item named **Ask Maia about my app** that calls `setChatPrompt` to populate the Maia Agent chat input and the true value sends it to Maia without the user reviewing it. You can also set the prompt from text the user selects in your own editor UI. For example, from a context-menu action on a text area: ```typescript const sendToMaiaHandler = async (textarea: HTMLTextAreaElement | null) => { if (textarea) { - await studioPro.ai.chat.setChatPrompt(textarea.value); + await studioPro.ai.chat.setChatPrompt(textarea.value, false); } }; ``` +The value false will allow the user to review the text and hit send themselves in the Maia chat window. ## Maia Chat API @@ -68,7 +69,7 @@ This API provides a method that allows interacting with the Maia Agent chat. ### Setting the Chat Prompt -The `setChatPrompt` method takes a `prompt` string and places it into the Maia Agent chat input. The prompt is not sent automatically, so the user can review, edit, and send it. If the Maia tab is not open, it is opened and made active. +The `setChatPrompt` method takes a `prompt` string and places it into the Maia Agent chat input and an `autoSend` that decides if the prompt will be automatically send to the maia chat(set value to `true`) or if the user can review, edit, and send it(set value to `false`). If the Maia tab is not open, it is opened and made active. ## Extensibility Feedback