@gitlab/duo-ui 9.1.1 → 10.0.0

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+# [10.0.0](https://gitlab.com/gitlab-org/duo-ui/compare/v9.1.1...v10.0.0) (2025-07-02)
+
+
+### Bug Fixes
+
+* agentic chat resolve input not clearing after submission ([68c9dee](https://gitlab.com/gitlab-org/duo-ui/commit/68c9deeda19073fdce046544b4adc3f826189ec0))
+
+
+### BREAKING CHANGES
+
+* The chat input would remain populated after sending a
+message due to a race condition where the textarea was disabled before
+the prompt could be cleared. This happened because `canSubmit = [secure]`
+executed before `setPromptAndFocus()` completed its async DOM update.
+
 ## [9.1.1](https://gitlab.com/gitlab-org/duo-ui/compare/v9.1.0...v9.1.1) (2025-07-02)
 
 

package/dist/components/agentic_chat/agentic_duo_chat.js

@@ -2,7 +2,7 @@ import throttle from 'lodash/throttle';
 import VueResizable from 'vue-resizable';
 import { GlButton, GlAlert, GlFormInputGroup, GlFormTextarea, GlForm, GlExperimentBadge, GlCard, GlDropdownItem, GlSafeHtmlDirective } from '@gitlab/ui';
 import { translate } from '../../utils/i18n';
-import { badgeTypes, badgeTypeValidator, CHAT_RESET_MESSAGE, CHAT_INCLUDE_MESSAGE, MESSAGE_MODEL_ROLES, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE } from '../chat/constants';
+import { badgeTypes, badgeTypeValidator, CHAT_RESET_MESSAGE, CHAT_INCLUDE_MESSAGE, MESSAGE_MODEL_ROLES, CHAT_BASE_COMMANDS } from '../chat/constants';
 import { VIEW_TYPES } from '../chat/components/duo_chat_header/constants';
 import DuoChatLoader from '../chat/components/duo_chat_loader/duo_chat_loader';
 import DuoChatPredefinedPrompts from '../chat/components/duo_chat_predefined_prompts/duo_chat_predefined_prompts';
@@ -427,26 +427,35 @@ var script = {
       this.$emit('chat-cancel');
       this.setPromptAndFocus();
     },
-    sendChatPrompt() {
+    async sendChatPrompt() {
       if (!this.canSubmit || this.contextItemsMenuIsOpen) {
         return;
       }
       if (this.prompt) {
-        if (this.caseInsensitivePrompt.startsWith(CHAT_INCLUDE_MESSAGE) && this.hasContextItemSelectionMenu) {
+        // Store these before any async operations that might clear the prompt
+        const trimmedPrompt = this.prompt.trim();
+        const lowerCasePrompt = this.prompt.toLowerCase().trim();
+        if (lowerCasePrompt.startsWith(CHAT_INCLUDE_MESSAGE) && this.hasContextItemSelectionMenu) {
           this.contextItemsMenuIsOpen = true;
           return;
         }
-        if (![CHAT_RESET_MESSAGE, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE].includes(this.caseInsensitivePrompt)) {
-          this.canSubmit = false;
-        }
 
         /**
          * Emitted when a new user prompt should be sent out.
          *
          * @param {String} prompt The user prompt to send.
          */
-        this.$emit('send-chat-prompt', this.prompt.trim());
-        this.setPromptAndFocus();
+        this.$emit('send-chat-prompt', trimmedPrompt);
+
+        // Always clear the prompt after sending, regardless of the command type
+        await this.setPromptAndFocus();
+
+        // Check if it was a special command using the stored value (before clearing)
+        if (!CHAT_BASE_COMMANDS.includes(lowerCasePrompt)) {
+          // Wait for all reactive updates to complete before setting canSubmit
+          await this.$nextTick();
+          this.canSubmit = false;
+        }
       }
     },
     sendPredefinedPrompt(prompt) {

package/dist/components/chat/constants.js

@@ -2,6 +2,7 @@ const CHAT_RESET_MESSAGE = '/reset';
 const CHAT_CLEAR_MESSAGE = '/clear';
 const CHAT_NEW_MESSAGE = '/new';
 const CHAT_INCLUDE_MESSAGE = '/include';
+const CHAT_BASE_COMMANDS = [CHAT_RESET_MESSAGE, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE];
 const LOADING_TRANSITION_DURATION = 7500;
 const DOCUMENTATION_SOURCE_TYPES = {
   HANDBOOK: {
@@ -29,4 +30,4 @@ const SELECTED_CONTEXT_ITEMS_DEFAULT_COLLAPSED = true;
 const badgeTypes = ['experiment', 'beta', null];
 const badgeTypeValidator = value => badgeTypes.includes(value);
 
-export { CHAT_CLEAR_MESSAGE, CHAT_INCLUDE_MESSAGE, CHAT_NEW_MESSAGE, CHAT_RESET_MESSAGE, DOCUMENTATION_SOURCE_TYPES, LOADING_TRANSITION_DURATION, MESSAGE_MODEL_ROLES, SELECTED_CONTEXT_ITEMS_DEFAULT_COLLAPSED, badgeTypeValidator, badgeTypes };
+export { CHAT_BASE_COMMANDS, CHAT_CLEAR_MESSAGE, CHAT_INCLUDE_MESSAGE, CHAT_NEW_MESSAGE, CHAT_RESET_MESSAGE, DOCUMENTATION_SOURCE_TYPES, LOADING_TRANSITION_DURATION, MESSAGE_MODEL_ROLES, SELECTED_CONTEXT_ITEMS_DEFAULT_COLLAPSED, badgeTypeValidator, badgeTypes };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/duo-ui",
-  "version": "9.1.1",
+  "version": "10.0.0",
   "description": "Duo UI Components",
   "license": "MIT",
   "main": "dist/index.js",

package/src/components/agentic_chat/agentic_duo_chat.vue

@@ -20,9 +20,8 @@ import {
   badgeTypes,
   badgeTypeValidator,
   CHAT_RESET_MESSAGE,
-  CHAT_CLEAR_MESSAGE,
-  CHAT_NEW_MESSAGE,
   CHAT_INCLUDE_MESSAGE,
+  CHAT_BASE_COMMANDS,
   MESSAGE_MODEL_ROLES,
 } from '../chat/constants';
 import { VIEW_TYPES } from '../chat/components/duo_chat_header/constants';
@@ -501,35 +500,36 @@ export default {
       this.$emit('chat-cancel');
       this.setPromptAndFocus();
     },
-    sendChatPrompt() {
+    async sendChatPrompt() {
       if (!this.canSubmit || this.contextItemsMenuIsOpen) {
         return;
       }
       if (this.prompt) {
-        if (
-          this.caseInsensitivePrompt.startsWith(CHAT_INCLUDE_MESSAGE) &&
-          this.hasContextItemSelectionMenu
-        ) {
+        // Store these before any async operations that might clear the prompt
+        const trimmedPrompt = this.prompt.trim();
+        const lowerCasePrompt = this.prompt.toLowerCase().trim();
+
+        if (lowerCasePrompt.startsWith(CHAT_INCLUDE_MESSAGE) && this.hasContextItemSelectionMenu) {
           this.contextItemsMenuIsOpen = true;
           return;
         }
 
-        if (
-          ![CHAT_RESET_MESSAGE, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE].includes(
-            this.caseInsensitivePrompt
-          )
-        ) {
-          this.canSubmit = false;
-        }
-
         /**
          * Emitted when a new user prompt should be sent out.
          *
          * @param {String} prompt The user prompt to send.
          */
-        this.$emit('send-chat-prompt', this.prompt.trim());
+        this.$emit('send-chat-prompt', trimmedPrompt);
 
-        this.setPromptAndFocus();
+        // Always clear the prompt after sending, regardless of the command type
+        await this.setPromptAndFocus();
+
+        // Check if it was a special command using the stored value (before clearing)
+        if (!CHAT_BASE_COMMANDS.includes(lowerCasePrompt)) {
+          // Wait for all reactive updates to complete before setting canSubmit
+          await this.$nextTick();
+          this.canSubmit = false;
+        }
       }
     },
     sendPredefinedPrompt(prompt) {

package/src/components/chat/constants.js

@@ -3,6 +3,8 @@ export const CHAT_CLEAR_MESSAGE = '/clear';
 export const CHAT_NEW_MESSAGE = '/new';
 export const CHAT_INCLUDE_MESSAGE = '/include';
 
+export const CHAT_BASE_COMMANDS = [CHAT_RESET_MESSAGE, CHAT_CLEAR_MESSAGE, CHAT_NEW_MESSAGE];
+
 export const LOADING_TRANSITION_DURATION = 7500;
 
 export const DOCUMENTATION_SOURCE_TYPES = {