@gitlab/duo-ui 10.23.0 → 10.23.1

package/src/components/chat/duo_chat.vue

@@ -1,12 +1,16 @@
 <script>
 import throttle from 'lodash/throttle';
+import VueResizable from 'vue-resizable';
 
 import {
   GlButton,
   GlDropdownItem,
   GlCard,
+  GlAlert,
+  GlFormInputGroup,
   GlFormTextarea,
   GlForm,
+  GlExperimentBadge,
   GlSafeHtmlDirective as SafeHtml,
 } from '@gitlab/ui';
 
@@ -20,8 +24,6 @@ import {
   CHAT_NEW_MESSAGE,
   CHAT_INCLUDE_MESSAGE,
   MESSAGE_MODEL_ROLES,
-  MAX_PROMPT_LENGTH,
-  PROMPT_LENGTH_WARNING,
 } from './constants';
 import { VIEW_TYPES } from './components/duo_chat_header/constants';
 import DuoChatLoader from './components/duo_chat_loader/duo_chat_loader.vue';
@@ -43,7 +45,7 @@ export const i18n = {
   ),
   CHAT_PROMPT_PLACEHOLDER_DEFAULT: translate(
     'DuoChat.chatPromptPlaceholderDefault',
-    "Let's work through this together..."
+    'GitLab Duo Chat'
   ),
   CHAT_PROMPT_PLACEHOLDER_WITH_COMMANDS: translate(
     'DuoChat.chatPromptPlaceholderWithCommands',
@@ -51,7 +53,6 @@ export const i18n = {
   ),
   CHAT_SUBMIT_LABEL: translate('DuoChat.chatSubmitLabel', 'Send chat message.'),
   CHAT_CANCEL_LABEL: translate('DuoChat.chatCancelLabel', 'Cancel'),
-  CHAT_MODEL_PLACEHOLDER: translate('DuoChat.chatModelPlaceholder', 'GitLab Duo Chat'),
   CHAT_DEFAULT_PREDEFINED_PROMPTS: [
     translate(
       'DuoChat.chatDefaultPredefinedPromptsChangePassword',
@@ -98,8 +99,11 @@ export default {
   name: 'DuoChat',
   components: {
     GlButton,
+    GlAlert,
+    GlFormInputGroup,
     GlFormTextarea,
     GlForm,
+    GlExperimentBadge,
     DuoChatLoader,
     DuoChatPredefinedPrompts,
     DuoChatConversation,
@@ -107,11 +111,41 @@ export default {
     DuoChatThreads,
     GlCard,
     GlDropdownItem,
+    VueResizable,
   },
   directives: {
     SafeHtml,
   },
   props: {
+    /**
+     * Determines if the component should be resizable. When true, it renders inside
+     * a `vue-resizable` wrapper; otherwise, a standard `div` is used.
+     */
+    shouldRenderResizable: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+    /**
+     * Defines the dimensions of the chat container when resizable.
+     * By default, the height is set to match the height of the browser window,
+     * and the width is fixed at 400px. The `top` position is left undefined,
+     * allowing it to be dynamically adjusted if needed.
+     */
+    dimensions: {
+      type: Object,
+      required: false,
+      default: () => ({
+        width: undefined,
+        height: undefined,
+        top: undefined,
+        left: undefined,
+        maxWidth: undefined,
+        minWidth: 400,
+        maxHeight: undefined,
+        minHeight: 400,
+      }),
+    },
     /**
      * The title of the chat/feature.
      */
@@ -280,14 +314,10 @@ export default {
       default: () => ['en-US', 'en'],
       validator: localeValidator,
     },
-    shouldRenderResizable: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
   },
   data() {
     return {
+      isHidden: false,
       prompt: '',
       scrolledToBottom: true,
       activeCommandIndex: 0,
@@ -296,9 +326,6 @@ export default {
       contextItemsMenuIsOpen: false,
       contextItemMenuRef: null,
       currentView: this.multiThreadedView,
-      maxPromptLength: MAX_PROMPT_LENGTH,
-      maxPromptLengthWarning: PROMPT_LENGTH_WARNING,
-      promptLengthWarningCount: MAX_PROMPT_LENGTH - PROMPT_LENGTH_WARNING,
     };
   },
   computed: {
@@ -407,6 +434,7 @@ export default {
       if (!newVal && !this.isStreaming) {
         this.displaySubmitButton = true; // Re-enable submit button when loading stops
       }
+      this.isHidden = false;
     },
     isStreaming(newVal) {
       if (!newVal && !this.isLoading) {
@@ -447,10 +475,14 @@ export default {
         this.focusChatInput();
       });
     },
+    updateSize(e) {
+      this.$emit('chat-resize', e);
+    },
     compositionEnd() {
       this.compositionJustEnded = true;
     },
     hideChat() {
+      this.isHidden = true;
       /**
        * Emitted when clicking the cross in the title and the chat gets closed.
        */
@@ -513,7 +545,7 @@ export default {
     focusChatInput() {
       // This method is also called directly by consumers of this component
       // https://gitlab.com/gitlab-org/gitlab-vscode-extension/-/blob/dae2d4669ab4da327921492a2962beae8a05c290/webviews/vue2/gitlab_duo_chat/src/App.vue#L109
-      this.$refs.prompt?.$el?.querySelector?.('textarea')?.focus();
+      this.$refs.prompt?.$el?.focus();
     },
     onTrackFeedback(event) {
       /**
@@ -667,222 +699,214 @@ export default {
       event.preventDefault();
       document.execCommand('redo');
     },
-    remainingCharacterCountMessage(count) {
-      return `${count} characters remaining`;
-    },
-    overLimitCharacterCountMessage(count) {
-      return `${Math.abs(count)} characters over limit`;
-    },
   },
   i18n,
 };
 </script>
 <template>
-  <div
-    id="chat-component"
-    class="markdown-code-block duo-chat gl-bottom-0 gl-flex gl-max-h-full gl-flex-col"
-    role="complementary"
-    data-testid="chat-component"
+  <component
+    :is="shouldRenderResizable ? 'vue-resizable' : 'div'"
+    :width="shouldRenderResizable ? dimensions.width : null"
+    :height="shouldRenderResizable ? dimensions.height : null"
+    :max-width="shouldRenderResizable ? dimensions.maxWidth : null"
+    :max-height="shouldRenderResizable ? dimensions.maxHeight : null"
+    :min-width="shouldRenderResizable ? dimensions.minWidth : null"
+    :left="shouldRenderResizable ? dimensions.left : null"
+    :top="shouldRenderResizable ? dimensions.top : null"
+    :fit-parent="true"
+    :min-height="shouldRenderResizable ? dimensions.minHeight : null"
+    :class="{
+      'duo-chat-resizable': shouldRenderResizable,
+      'non-resizable-wrapper': !shouldRenderResizable,
+    }"
+    :active="shouldRenderResizable ? ['l', 't', 'lt'] : null"
+    @resize:end="updateSize"
   >
-    <duo-chat-header
-      v-if="showHeader"
-      ref="header"
-      :active-thread-id="activeThreadId"
-      :title="isMultithreaded && currentView === 'list' ? $options.i18n.CHAT_HISTORY_TITLE : title"
-      :subtitle="activeThreadTitleForView"
-      :is-multithreaded="isMultithreaded"
-      :current-view="currentView"
-      :should-render-resizable="shouldRenderResizable"
-      :badge-type="isMultithreaded ? null : badgeType"
-      @go-back="onGoBack"
-      @go-back-to-chat="onGoBackToChat"
-      @new-chat="onNewChat"
-      @close="hideChat"
-    >
-      <template #subheader>
-        <slot name="subheader"></slot>
-      </template>
-    </duo-chat-header>
-
-    <div
-      class="gl-flex gl-flex-1 gl-flex-grow gl-flex-col gl-overflow-y-auto gl-overscroll-contain gl-bg-inherit"
-      data-testid="chat-history"
-      @scroll="handleScrollingThrottled"
+    <aside
+      v-if="!isHidden"
+      id="chat-component"
+      :class="{
+        'resizable-content': shouldRenderResizable,
+        'duo-chat-drawer': !shouldRenderResizable,
+      }"
+      class="markdown-code-block duo-chat gl-bottom-0 gl-flex gl-max-h-full gl-flex-col"
+      role="complementary"
+      data-testid="chat-component"
     >
-      <duo-chat-threads
-        v-if="shouldShowThreadList"
-        :threads="threadList"
-        :preferred-locale="preferredLocale"
+      <duo-chat-header
+        v-if="showHeader"
+        ref="header"
+        :active-thread-id="activeThreadId"
+        :title="
+          isMultithreaded && currentView === 'list' ? $options.i18n.CHAT_HISTORY_TITLE : title
+        "
+        :subtitle="activeThreadTitleForView"
+        :is-multithreaded="isMultithreaded"
+        :current-view="currentView"
+        :should-render-resizable="shouldRenderResizable"
+        :badge-type="isMultithreaded ? null : badgeType"
+        @go-back="onGoBack"
+        @go-back-to-chat="onGoBackToChat"
         @new-chat="onNewChat"
-        @select-thread="onSelectThread"
-        @delete-thread="onDeleteThread"
         @close="hideChat"
-      />
-      <transition-group
-        v-else
-        mode="out-in"
-        tag="section"
-        name="message"
-        class="duo-chat-history gl-mt-auto gl-p-5"
       >
-        <duo-chat-conversation
-          v-for="(conversation, index) in conversations"
-          :key="`conversation-${index}`"
-          :enable-code-insertion="enableCodeInsertion"
-          :messages="conversation"
-          :canceled-request-ids="canceledRequestIds"
-          :show-delimiter="index > 0"
-          :trusted-urls="trustedUrls"
-          @track-feedback="onTrackFeedback"
-          @insert-code-snippet="onInsertCodeSnippet"
-          @copy-code-snippet="onCopyCodeSnippet"
-          @copy-message="onCopyMessage"
-          @get-context-item-content="onGetContextItemContent"
-          @open-file-path="onOpenFilePath"
-        />
-        <template v-if="!hasMessages && !isLoading">
-          <div
-            key="empty-state-message"
-            class="duo-chat-message gl-rounded-bl-none gl-p-4 gl-leading-20 gl-text-gray-900 gl-break-anywhere"
-            data-testid="gl-duo-chat-empty-state"
-          >
-            <p v-if="emptyStateTitle" data-testid="gl-duo-chat-empty-state-title" class="gl-m-0">
-              {{ emptyStateTitle }}
-            </p>
-            <duo-chat-predefined-prompts
-              key="predefined-prompts"
-              :prompts="predefinedPrompts"
-              @click="sendPredefinedPrompt"
-            />
-          </div>
+        <template #subheader>
+          <slot name="subheader"></slot>
         </template>
-        <duo-chat-loader v-if="isLoading" key="loader" :tool-name="toolName" />
-        <div key="anchor" ref="anchor" class="scroll-anchor"></div>
-      </transition-group>
-    </div>
-    <footer
-      v-if="isChatAvailable && !shouldShowThreadList"
-      data-testid="chat-footer"
-      class="duo-chat-drawer-footer gl-relative gl-z-2 gl-shrink-0 gl-border-0 gl-bg-default gl-pb-3"
-      :class="{ 'duo-chat-drawer-body-scrim-on-footer': !scrolledToBottom }"
-    >
-      <gl-form data-testid="chat-prompt-form" @submit.stop.prevent="sendChatPrompt">
-        <div class="gl-relative gl-max-w-full">
-          <!--
+      </duo-chat-header>
+
+      <div
+        class="gl-flex gl-flex-1 gl-flex-grow gl-flex-col gl-overflow-y-auto gl-overscroll-contain gl-bg-inherit"
+        data-testid="chat-history"
+        @scroll="handleScrollingThrottled"
+      >
+        <duo-chat-threads
+          v-if="shouldShowThreadList"
+          :threads="threadList"
+          :preferred-locale="preferredLocale"
+          @new-chat="onNewChat"
+          @select-thread="onSelectThread"
+          @delete-thread="onDeleteThread"
+          @close="hideChat"
+        />
+        <transition-group
+          v-else
+          mode="out-in"
+          tag="section"
+          name="message"
+          class="duo-chat-history gl-mt-auto gl-p-5"
+        >
+          <duo-chat-conversation
+            v-for="(conversation, index) in conversations"
+            :key="`conversation-${index}`"
+            :enable-code-insertion="enableCodeInsertion"
+            :messages="conversation"
+            :canceled-request-ids="canceledRequestIds"
+            :show-delimiter="index > 0"
+            :trusted-urls="trustedUrls"
+            @track-feedback="onTrackFeedback"
+            @insert-code-snippet="onInsertCodeSnippet"
+            @copy-code-snippet="onCopyCodeSnippet"
+            @copy-message="onCopyMessage"
+            @get-context-item-content="onGetContextItemContent"
+            @open-file-path="onOpenFilePath"
+          />
+          <template v-if="!hasMessages && !isLoading">
+            <div
+              key="empty-state-message"
+              class="duo-chat-message gl-rounded-bl-none gl-p-4 gl-leading-20 gl-text-gray-900 gl-break-anywhere"
+              data-testid="gl-duo-chat-empty-state"
+            >
+              <p v-if="emptyStateTitle" data-testid="gl-duo-chat-empty-state-title" class="gl-m-0">
+                {{ emptyStateTitle }}
+              </p>
+              <duo-chat-predefined-prompts
+                key="predefined-prompts"
+                :prompts="predefinedPrompts"
+                @click="sendPredefinedPrompt"
+              />
+            </div>
+          </template>
+          <duo-chat-loader v-if="isLoading" key="loader" :tool-name="toolName" />
+          <div key="anchor" ref="anchor" class="scroll-anchor"></div>
+        </transition-group>
+      </div>
+      <footer
+        v-if="isChatAvailable && !shouldShowThreadList"
+        data-testid="chat-footer"
+        class="duo-chat-drawer-footer gl-relative gl-z-2 gl-shrink-0 gl-border-0 gl-bg-default gl-pb-3"
+        :class="{ 'duo-chat-drawer-body-scrim-on-footer': !scrolledToBottom }"
+      >
+        <gl-form data-testid="chat-prompt-form" @submit.stop.prevent="sendChatPrompt">
+          <div class="gl-relative gl-max-w-full">
+            <!--
               @slot For integrating `<gl-context-items-menu>` component if pinned-context should be available. The following scopedSlot properties are provided: `isOpen`, `onClose`, `setRef`, `focusPrompt`, which should be passed to the `<gl-context-items-menu>` component when rendering, e.g. `<template #context-items-menu="{ isOpen, onClose, setRef, focusPrompt }">` `<duo-chat-context-item-menu :ref="setRef" :open="isOpen" @close="onClose" @focus-prompt="focusPrompt" ...`
             -->
-          <slot
-            name="context-items-menu"
-            :is-open="contextItemsMenuIsOpen"
-            :on-close="closeContextItemsMenuOpen"
-            :set-ref="setContextItemsMenuRef"
-            :focus-prompt="focusChatInput"
-          ></slot>
-        </div>
-
-        <div
-          class="duo-chat-input gl-min-h-8 gl-max-w-full gl-grow gl-flex-col gl-rounded-bl-[12px] gl-rounded-br-[18px] gl-rounded-tl-[12px] gl-rounded-tr-[12px] gl-align-top"
-        >
-          <div
-            class="gl-flex gl-justify-between gl-border-0 gl-border-b-1 gl-border-solid gl-border-[#DCDCDE] gl-px-4 gl-py-4"
-          >
-            <div>{{ $options.i18n.CHAT_MODEL_PLACEHOLDER }}</div>
-            <div><slot name="agentic-switch"></slot></div>
+            <slot
+              name="context-items-menu"
+              :is-open="contextItemsMenuIsOpen"
+              :on-close="closeContextItemsMenuOpen"
+              :set-ref="setContextItemsMenuRef"
+              :focus-prompt="focusChatInput"
+            ></slot>
           </div>
-          <div class="gl-h-[40px] gl-grow" :data-value="prompt">
-            <gl-card
-              v-if="shouldShowSlashCommands"
-              ref="commands"
-              class="slash-commands !gl-absolute gl-w-full -gl-translate-y-full gl-list-none gl-pl-0 gl-shadow-md"
-              body-class="!gl-p-2"
+
+          <gl-form-input-group>
+            <div
+              class="duo-chat-input gl-min-h-8 gl-max-w-full gl-grow gl-align-top"
+              :data-value="prompt"
             >
-              <gl-dropdown-item
-                v-for="(command, index) in filteredSlashCommands"
-                :key="command.name"
-                :class="{ 'active-command': index === activeCommandIndex }"
-                @mouseenter.native="activeCommandIndex = index"
-                @click="selectSlashCommand(index)"
+              <gl-card
+                v-if="shouldShowSlashCommands"
+                ref="commands"
+                class="slash-commands !gl-absolute gl-w-full -gl-translate-y-full gl-list-none gl-pl-0 gl-shadow-md"
+                body-class="!gl-p-2"
               >
-                <span class="gl-flex gl-justify-between">
-                  <span class="gl-block">{{ command.name }}</span>
-                  <small class="gl-pl-3 gl-text-right gl-italic gl-text-subtle">{{
-                    command.description
-                  }}</small>
-                </span>
-              </gl-dropdown-item>
-            </gl-card>
-
-            <gl-form-textarea
-              ref="prompt"
-              v-model="prompt"
-              data-testid="chat-prompt-input"
-              :textarea-classes="[
-                '!gl-h-full',
-                '!gl-bg-transparent',
-                '!gl-py-4',
-                '!gl-shadow-none',
-                'form-control',
-                'gl-form-input',
-                'gl-form-textarea',
-                { 'gl-truncate': !prompt },
-              ]"
-              :placeholder="inputPlaceholder"
-              :character-count-limit="maxPromptLength"
-              autofocus
-              @keydown.enter.exact.native.prevent
-              @keydown.ctrl.z.exact="handleUndo"
-              @keydown.meta.z.exact="handleUndo"
-              @keydown.ctrl.shift.z="handleRedo"
-              @keydown.meta.shift.z="handleRedo"
-              @keydown.ctrl.y="handleRedo"
-              @keydown.meta.y="handleRedo"
-              @keyup.native="onInputKeyup"
-              @compositionend="compositionEnd"
-            >
-              <template #remaining-character-count-text="{ count }">
-                <span
-                  v-if="count <= promptLengthWarningCount"
-                  class="gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3"
+                <gl-dropdown-item
+                  v-for="(command, index) in filteredSlashCommands"
+                  :key="command.name"
+                  :class="{ 'active-command': index === activeCommandIndex }"
+                  @mouseenter.native="activeCommandIndex = index"
+                  @click="selectSlashCommand(index)"
                 >
-                  {{ remainingCharacterCountMessage(count) }}
-                </span>
-              </template>
-              <template #character-count-over-limit-text="{ count }">
-                <span class="gl-absolute gl-bottom-[-25px] gl-right-px gl-pr-3">{{
-                  overLimitCharacterCountMessage(count)
-                }}</span>
-              </template>
-            </gl-form-textarea>
-          </div>
-          <div class="gl-flex gl-justify-end gl-px-3 gl-pb-3">
-            <gl-button
-              v-if="displaySubmitButton"
-              icon="paper-airplane"
-              category="primary"
-              variant="confirm"
-              class="gl-bottom-2 gl-right-2 gl-ml-auto !gl-rounded-full"
-              type="submit"
-              data-testid="chat-prompt-submit-button"
-              :disabled="isPromptEmpty"
-              :aria-label="$options.i18n.CHAT_SUBMIT_LABEL"
-            />
-            <gl-button
-              v-else
-              icon="stop"
-              category="primary"
-              variant="default"
-              class="gl-bottom-2 gl-right-2 gl-ml-auto !gl-rounded-full"
-              data-testid="chat-prompt-cancel-button"
-              :aria-label="$options.i18n.CHAT_CANCEL_LABEL"
-              @click="cancelPrompt"
-            />
-          </div>
-        </div>
-      </gl-form>
-      <slot name="footer-controls"></slot>
-      <p class="gl-mb-0 gl-mt-3 gl-px-4 gl-text-sm gl-text-secondary">
-        {{ $options.i18n.CHAT_DISCLAMER }}
-      </p>
-    </footer>
-  </div>
+                  <span class="gl-flex gl-justify-between">
+                    <span class="gl-block">{{ command.name }}</span>
+                    <small class="gl-pl-3 gl-text-right gl-italic gl-text-subtle">{{
+                      command.description
+                    }}</small>
+                  </span>
+                </gl-dropdown-item>
+              </gl-card>
+
+              <gl-form-textarea
+                ref="prompt"
+                v-model="prompt"
+                data-testid="chat-prompt-input"
+                class="gl-absolute !gl-h-full gl-rounded-br-none gl-rounded-tr-none !gl-bg-transparent !gl-py-4 !gl-shadow-none"
+                :class="{ 'gl-truncate': !prompt }"
+                :placeholder="inputPlaceholder"
+                autofocus
+                @keydown.enter.exact.native.prevent
+                @keydown.ctrl.z.exact="handleUndo"
+                @keydown.meta.z.exact="handleUndo"
+                @keydown.ctrl.shift.z="handleRedo"
+                @keydown.meta.shift.z="handleRedo"
+                @keydown.ctrl.y="handleRedo"
+                @keydown.meta.y="handleRedo"
+                @keyup.native="onInputKeyup"
+                @compositionend="compositionEnd"
+              />
+            </div>
+            <template #append>
+              <gl-button
+                v-if="displaySubmitButton"
+                icon="paper-airplane"
+                category="primary"
+                variant="confirm"
+                class="!gl-absolute gl-bottom-2 gl-right-2 !gl-rounded-full"
+                type="submit"
+                data-testid="chat-prompt-submit-button"
+                :disabled="isPromptEmpty"
+                :aria-label="$options.i18n.CHAT_SUBMIT_LABEL"
+              />
+              <gl-button
+                v-else
+                icon="stop"
+                category="primary"
+                variant="default"
+                class="!gl-absolute gl-bottom-2 gl-right-2 !gl-rounded-full"
+                data-testid="chat-prompt-cancel-button"
+                :aria-label="$options.i18n.CHAT_CANCEL_LABEL"
+                @click="cancelPrompt"
+              />
+            </template>
+          </gl-form-input-group>
+        </gl-form>
+        <slot name="footer-controls"></slot>
+        <p class="gl-mb-0 gl-mt-3 gl-px-4 gl-text-sm gl-text-secondary">
+          {{ $options.i18n.CHAT_DISCLAMER }}
+        </p>
+      </footer>
+    </aside>
+  </component>
 </template>

package/src/index.js

@@ -42,7 +42,5 @@ export { InsertCodeSnippetElement as DuoChatInsertCodeSnippetElement } from './c
 export { default as DuoNavigationBar } from './components/ui/duo_navigation_bar/duo_navigation_bar.vue';
 export { default as DuoRecentCollapsible } from './components/ui/duo_recent_collapsible/duo_recent_collapsible.vue';
 export { default as DuoRecentContent } from './components/ui/duo_recent_content/duo_recent_content.vue';
-export { default as DuoLayout } from './components/ui/duo_layout/duo_layout.vue';
-export { default as SideRail } from './components/ui/side_rail/side_rail.vue';
 
 export { addDuoMarkdownPlugin } from './components/chat/markdown_renderer';

package/translations.js

@@ -7,12 +7,12 @@ export default {
   'AgenticDuoChat.chatDefaultPredefinedPromptsCreateTemplate': 'How do I create a template?',
   'AgenticDuoChat.chatDefaultPredefinedPromptsForkProject': 'How do I fork a project?',
   'AgenticDuoChat.chatDefaultTitle': 'GitLab Duo Agentic Chat',
-  'AgenticDuoChat.chatDisclamer': 'Responses may be inaccurate. Verify before use.',
+  'AgenticDuoChat.chatDisclamer':
+    'Chat can autonomously change code. Responses and changes can be inaccurate. Review carefully.',
   'AgenticDuoChat.chatEmptyStateTitle':
     '👋 I am GitLab Duo Agentic Chat, your personal AI-powered assistant. How can I help you today?',
   'AgenticDuoChat.chatHistoryTitle': 'Chat history',
-  'AgenticDuoChat.chatModelPlaceholder': 'GitLab Duo Agentic Chat',
-  'AgenticDuoChat.chatPromptPlaceholderDefault': "Let's work through this together...",
+  'AgenticDuoChat.chatPromptPlaceholderDefault': 'GitLab Duo Agentic Chat',
   'AgenticDuoChat.chatPromptPlaceholderWithCommands': 'Type /help to learn more',
   'AgenticDuoChat.chatSubmitLabel': 'Send chat message.',
   'AgenticDuoChat.overLimitCharacterCountMessage': null,
@@ -67,10 +67,9 @@ export default {
     '👋 I am GitLab Duo Chat, your personal AI-powered assistant. How can I help you today?',
   'DuoChat.chatHistoryInfo': 'Inactive chats are deleted after 30 days.',
   'DuoChat.chatHistoryToolTip': 'Chat history',
-  'DuoChat.chatModelPlaceholder': 'GitLab Duo Chat',
   'DuoChat.chatNewLabel': 'New chat',
   'DuoChat.chatNewToolTip': 'New chat',
-  'DuoChat.chatPromptPlaceholderDefault': "Let's work through this together...",
+  'DuoChat.chatPromptPlaceholderDefault': 'GitLab Duo Chat',
   'DuoChat.chatPromptPlaceholderWithCommands': 'Type /help to learn more',
   'DuoChat.chatSubmitLabel': 'Send chat message.',
   'DuoChat.chatTitle': 'GitLab Duo Chat',