More Desk One – Web SDK

The More Desk One SDK allows you to easily embed chat capability into your web applications with a floating chat launcher button and authenticated session initialization.

🚀 Installation

npm install more-desk-one
# or
yarn add more-desk-one

📎 Must be installed

The SDK requires the following dependencies:

npm install @radix-ui/react-popover more-sso-sdk
# or
yarn add @radix-ui/react-popover more-sso-sdk

1️⃣ Import SDK

import { init, ChatButton } from "more-desk-one";

2️⃣ Initialize the SDK

Call init() once you have a valid access token.

⚠️ You must call init() before using the chat widget.

useEffect(() => {
if (!accessToken) return;
init({
apiURL: "YOUR_APIURL"
apiKey: "YOUR_API_KEY",
accessToken "ACCESSTOKEN",
env: "SSO_ENV",
redirectUrl: "YOUR_SSO_REDIRECT_URL",
app: "SSO_APP_NAME",
idp: "SSO_IDP"
});
}, [accessToken]);

💬 Display the Chat Button

Add the chat button anywhere in your React component tree:

<ChatButton align="end" side="right" />

⚙️ init() Configuration Options

| Option | Type | Required | Description | | ------------- | ----------------- | -------- | ----------------------------------------- | | apiURL | string | ✔ | GraphQL API endpoint | | apiKey | string | ✔ | AppSync API key | | accessToken | string | ✔ | JWT token for the logged-in user | | env | "DEV" \| "PROD" | ✔ | SSO Deployment environment | | redirectUrl | string | ✔ | SSO redirect URL | | app | string | ✔ | SSO Application identifier (e.g., jedi) | | idp | string | ✔ | SSO idp |

🧩 ChatButton Props

| Prop | Type | Default | Description | | ------- | ---------------------------------------- | ------- | ------------------ | | align | "start" \| "center" \| "end" | end | Vertical alignment | | side | "left" \| "right" \| "top" \| "bottom" | top | Screen position |

🧪 Full Example

import { useEffect } from "react";
import { init, ChatButton } from "more-desk-one";

export default function App() {
const accessToken = "USER_ACCESS_TOKEN";

useEffect(() => {
if (!accessToken) return;

    init({
      apiURL:
        "",
      apiKey: "YOUR_API_KEY",
      accessToken,
      env: "DEV",
      redirectUrl: "",
      app: "",
      idp: ""
    });

}, [accessToken]);

return <ChatButton align="end" side="right" />;
}