Demo: chat-ai-integration imporved error handling

[flagmanAndrew]

show real error messages in the Chat alert block

[Copilot]

🟡 Changes recommended

TypeScript catch(err: any) blocks and inconsistent formatting/quoting should be aligned with existing demo patterns (e.g., catch (e: unknown)) to avoid lint/style regressions.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

This PR updates the Chat “AI and Chatbot Integration” demos to surface actual error messages in the chat alert UI, and disables OpenAI client retries so the original error is shown immediately.

Changes:

• Disable automatic retry behavior for chat.completions.create(...) calls by passing { maxRetries: 0 }.
• Replace the hardcoded “Request limit reached…” alert with a generic alertError(message) flow that displays the thrown error message (with fallback).

File summaries

File	Description
apps/demos/Demos/Chat/AIAndChatbotIntegration/Vue/service.ts	Disables retries when calling chat.completions.create.
apps/demos/Demos/Chat/AIAndChatbotIntegration/Vue/App.vue	Shows real error messages in alerts instead of a fixed “limit reached” message.
apps/demos/Demos/Chat/AIAndChatbotIntegration/ReactJs/useApi.js	Shows real error messages in alerts instead of a fixed “limit reached” message.
apps/demos/Demos/Chat/AIAndChatbotIntegration/ReactJs/service.js	Disables retries when calling chat.completions.create.
apps/demos/Demos/Chat/AIAndChatbotIntegration/React/useApi.ts	Shows real error messages in alerts instead of a fixed “limit reached” message.
apps/demos/Demos/Chat/AIAndChatbotIntegration/React/service.ts	Disables retries when calling chat.completions.create.
apps/demos/Demos/Chat/AIAndChatbotIntegration/jQuery/index.js	Shows real error messages in alerts and disables retries.
apps/demos/Demos/Chat/AIAndChatbotIntegration/Angular/app/app.service.ts	Shows real error messages in alerts instead of a fixed “limit reached” message.
apps/demos/Demos/Chat/AIAndChatbotIntegration/Angular/app/ai/ai.service.ts	Disables retries when calling chat.completions.create.

Review details

Suppressed comments (4)

apps/demos/Demos/Chat/AIAndChatbotIntegration/Vue/App.vue:167

• Use unknown in catch and narrow the error shape before reading properties; also fix the indentation consistency in this block.

  } catch(err: any) {
    if (lastMessage?.content) {
      updateLastMessage(lastMessage.content);
    }
     const errorMessage =

apps/demos/Demos/Chat/AIAndChatbotIntegration/React/useApi.ts:103

• Prefer catch (err: unknown) and narrow before property access (consistent with other Chat demos), rather than using any.

    } catch(err: any) {
      updateLastMessageContent(messageHistory.at(-1)?.content as string);
      const errorMessage =
        err.error?.message ??
        err.message ??

apps/demos/Demos/Chat/AIAndChatbotIntegration/Angular/app/app.service.ts:167

• Prefer catch (err: unknown) and narrow before property access instead of using any/unsafe property reads.

    } catch(err: any) {
      this.updateLastMessage(this.messages.at(-1).content);
      const errorMessage =
        err.error?.message ??
        err.message ??

apps/demos/Demos/Chat/AIAndChatbotIntegration/jQuery/index.js:99

• Use single quotes for consistency with the rest of this file.

        "Unknown error";

• Files reviewed: 9/9 changed files
• Comments generated: 4
• Review effort level: Lite

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[Copilot]

🟡 Changes recommended

The jQuery demo’s new error handling can throw in the catch block and/or pass a non-string into alerts[].message, which can break the alert rendering and hide the original error.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Review details

Suppressed comments (1)

apps/demos/Demos/Chat/AIAndChatbotIntegration/jQuery/index.js:98

• Same issue in this catch block: error extraction can produce a non-string (or throw for null/undefined errors), but alerts[].message is typed as string, so the handler should coerce/validate the value before passing it to alertError (and use catch (err) spacing).

    } catch(err) {
      updateLastMessage(messages.at(-1).content);
      const errorMessage =
        err.error?.message ??
        err.message ??

• Files reviewed: 9/9 changed files
• Comments generated: 1
• Review effort level: Lite

[Copilot]

🔵 Needs a closer look

The jQuery demo’s alert message derivation can still pass a non-string into dxChat.Alert.message and should normalize/coerce the error value to a string consistently.

Review details

Suppressed comments (2)

apps/demos/Demos/Chat/AIAndChatbotIntegration/jQuery/index.js:80

• dxChat.Alert.message is defined as an optional string, but here err.error?.message ?? err.message can produce a non-string value (e.g., object/number), which can lead to [object Object] being rendered or other unexpected behavior. Consider normalizing the error to a string (similar to the getErrorMessage helper used in the TS/React/Vue/Angular versions).

      const errorMessage =
        err.error?.message ??
        err.message ??
        'Unknown error';
      alertError(errorMessage);

apps/demos/Demos/Chat/AIAndChatbotIntegration/jQuery/index.js:100

• Same issue as above: err.error?.message ?? err.message is not guaranteed to be a string, but alerts[].message expects a string. Normalizing the error value avoids showing [object Object] or other unintended output.

      const errorMessage =
        err.error?.message ??
        err.message ??
        'Unknown error';
      alertError(errorMessage);

• Files reviewed: 9/9 changed files
• Comments generated: 0 new
• Review effort level: Lite

[dmlvr]

let's add maxRetries to the params object here and all next demos, where we have params object

[dmlvr]

let's move it to getErrorMessage for consistency of demos and reuse it in line 96