chrome-devtools-frontend 1.0.1380117 → 1.0.1402249

package/front_end/panels/{freestyler/components/FreestylerChatUi.ts → ai_assistance/components/ChatView.ts}

@@ -9,6 +9,7 @@ import * as Common from '../../../core/common/common.js';
 import * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import type * as Platform from '../../../core/platform/platform.js';
+import * as Root from '../../../core/root/root.js';
 import * as Marked from '../../../third_party/marked/marked.js';
 import * as Buttons from '../../../ui/components/buttons/buttons.js';
 import type * as IconButton from '../../../ui/components/icon_button/icon_button.js';
@@ -16,12 +17,12 @@ import * as MarkdownView from '../../../ui/components/markdown_view/markdown_vie
 import * as UI from '../../../ui/legacy/legacy.js';
 import * as LitHtml from '../../../ui/lit-html/lit-html.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
-import {AgentType, type ContextDetail, type ConversationContext, ErrorType} from '../AiAgent.js';
+import {AgentType, type ContextDetail, type ConversationContext, ErrorType} from '../agents/AiAgent.js';
 
-import freestylerChatUiStyles from './freestylerChatUi.css.js';
+import styles from './chatView.css.js';
 import type {UserActionRowProps} from './UserActionRow.js';
 
-const {html, Directives: {ifDefined}} = LitHtml;
+const {html, Directives: {ifDefined, ref}} = LitHtml;
 
 const UIStrings = {
   /**
@@ -83,18 +84,38 @@ const UIStringsNotTranslate = {
   /**
    *@description Disclaimer text right after the chat input.
    */
-  inputDisclaimerForDrJonesNetworkAgent:
+  inputDisclaimerForFreestylerAgentEnterpriseNoLogging:
+      'Chat messages and any data the inspected page can access via Web APIs are sent to Google. The content you submit and that is generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
+  /**
+   *@description Disclaimer text right after the chat input.
+   */
+  inputDisclaimerForNetworkAgent:
       'Chat messages and the selected network request are sent to Google and may be seen by human reviewers to improve this feature. This is an experimental AI feature and won’t always get it right.',
   /**
    *@description Disclaimer text right after the chat input.
    */
-  inputDisclaimerForDrJonesFileAgent:
+  inputDisclaimerForNetworkAgentEnterpriseNoLogging:
+      'Chat messages and the selected network request are sent to Google. The content you submit and that is generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
+  /**
+   *@description Disclaimer text right after the chat input.
+   */
+  inputDisclaimerForFileAgent:
       'Chat messages and the selected file are sent to Google and may be seen by human reviewers to improve this feature. This is an experimental AI feature and won\'t always get it right.',
   /**
    *@description Disclaimer text right after the chat input.
    */
-  inputDisclaimerForDrJonesPerformanceAgent:
+  inputDisclaimerForFileAgentEnterpriseNoLogging:
+      'Chat messages and the selected file are sent to Google. The content you submit and that is generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
+  /**
+   *@description Disclaimer text right after the chat input.
+   */
+  inputDisclaimerForPerformanceAgent:
       'Chat messages and the selected call tree are sent to Google and may be seen by human reviewers to improve this feature. This is an experimental AI feature and won\'t always get it right.',
+  /**
+   *@description Disclaimer text right after the chat input.
+   */
+  inputDisclaimerForPerformanceAgentEnterpriseNoLogging:
+      'Chat messages and the selected call stack are sent to Google. The content you submit and that is generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
   /**
    *@description Placeholder text for the chat UI input.
    */
@@ -102,15 +123,31 @@ const UIStringsNotTranslate = {
   /**
    *@description Placeholder text for the chat UI input.
    */
-  inputPlaceholderForDrJonesNetworkAgent: 'Ask a question about the selected network request',
+  inputPlaceholderForNetworkAgent: 'Ask a question about the selected network request',
   /**
    *@description Placeholder text for the chat UI input.
    */
-  inputPlaceholderForDrJonesFileAgent: 'Ask a question about the selected file',
+  inputPlaceholderForFileAgent: 'Ask a question about the selected file',
   /**
    *@description Placeholder text for the chat UI input.
    */
-  inputPlaceholderForDrJonesPerformanceAgent: 'Ask a question about the selected item and its call tree',
+  inputPlaceholderForPerformanceAgent: 'Ask a question about the selected item and its call tree',
+  /**
+   *@description Placeholder text for the chat UI input when there is no context selected.
+   */
+  inputPlaceholderForFreestylerAgentNoContext: 'Select an element to ask a question',
+  /**
+   *@description Placeholder text for the chat UI input when there is no context selected.
+   */
+  inputPlaceholderForNetworkAgentNoContext: 'Select a network request to ask a question',
+  /**
+   *@description Placeholder text for the chat UI input when there is no context selected.
+   */
+  inputPlaceholderForFileAgentNoContext: 'Select a file to ask a question',
+  /**
+   *@description Placeholder text for the chat UI input when there is no context selected.
+   */
+  inputPlaceholderForPerformanceAgentNoContext: 'Select an item to ask a question',
   /**
    * @description Placeholder text for the input shown when the conversation is blocked because a cross-origin context was selected.
    */
@@ -218,10 +255,12 @@ const UIStringsNotTranslate = {
   pastConversation: 'You\'re viewing a past conversation.',
 };
 
-const str_ = i18n.i18n.registerUIStrings('panels/freestyler/components/FreestylerChatUi.ts', UIStrings);
+const str_ = i18n.i18n.registerUIStrings('panels/ai_assistance/components/ChatView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 const lockedString = i18n.i18n.lockedString;
 
+const SCROLL_ROUNDING_OFFSET = 1;
+
 export interface Step {
   isLoading: boolean;
   thought?: string;
@@ -252,7 +291,7 @@ export interface ModelChatMessage {
   suggestions?: [string, ...string[]];
   answer?: string;
   error?: ErrorType;
-  rpcId?: number;
+  rpcId?: Host.AidaClient.RpcGlobalId;
 }
 
 export type ChatMessage = UserChatMessage|ModelChatMessage;
@@ -265,10 +304,11 @@ export const enum State {
 export interface Props {
   onTextSubmit: (text: string) => void;
   onInspectElementClick: () => void;
-  onFeedbackSubmit: (rpcId: number, rate: Host.AidaClient.Rating, feedback?: string) => void;
+  onFeedbackSubmit: (rpcId: Host.AidaClient.RpcGlobalId, rate: Host.AidaClient.Rating, feedback?: string) => void;
   onCancelClick: () => void;
   onContextClick: () => void | Promise<void>;
   onNewConversation: () => void;
+  onCancelCrossOriginChat?: () => void;
   inspectElementToggled: boolean;
   state: State;
   aidaAvailability: Host.AidaClient.AidaAccessPreconditions;
@@ -334,11 +374,25 @@ class MarkdownRendererWithCodeBlock extends MarkdownView.MarkdownView.MarkdownIn
   }
 }
 
-export class FreestylerChatUi extends HTMLElement {
+export class ChatView extends HTMLElement {
   readonly #shadow = this.attachShadow({mode: 'open'});
   #markdownRenderer = new MarkdownRendererWithCodeBlock();
   #scrollTop?: number;
   #props: Props;
+  #messagesContainerElement?: Element;
+  #mainElementRef?: LitHtml.Directives.Ref<Element> = LitHtml.Directives.createRef();
+  #lastAnswerMarkdownView?: MarkdownView.MarkdownView.MarkdownView;
+  #messagesContainerResizeObserver = new ResizeObserver(() => this.#handleMessagesContainerResize());
+  /**
+   * Indicates whether the chat scroll position should be pinned to the bottom.
+   *
+   * This is true when:
+   *   - The scroll is at the very bottom, allowing new messages to push the scroll down automatically.
+   *   - The panel is initially rendered and the user hasn't scrolled yet.
+   *
+   * It is set to false when the user scrolls up to view previous messages.
+   */
+  #pinScrollToBottom = true;
 
   constructor(props: Props) {
     super();
@@ -352,8 +406,16 @@ export class FreestylerChatUi extends HTMLElement {
   }
 
   connectedCallback(): void {
-    this.#shadow.adoptedStyleSheets = [freestylerChatUiStyles];
+    this.#shadow.adoptedStyleSheets = [styles];
     this.#render();
+
+    if (this.#messagesContainerElement) {
+      this.#messagesContainerResizeObserver.observe(this.#messagesContainerElement);
+    }
+  }
+
+  disconnectedCallback(): void {
+    this.#messagesContainerResizeObserver.disconnect();
   }
 
   focusTextInput(): void {
@@ -370,20 +432,41 @@ export class FreestylerChatUi extends HTMLElement {
       return;
     }
 
-    const scrollContainer = this.#shadow.querySelector('.chat-ui main') as HTMLElement;
-    if (!scrollContainer) {
+    if (!this.#mainElementRef?.value) {
+      return;
+    }
+
+    this.#mainElementRef.value.scrollTop = this.#scrollTop;
+  }
+
+  finishTextAnimations(): void {
+    if (!this.#lastAnswerMarkdownView) {
+      return;
+    }
+
+    this.#lastAnswerMarkdownView.finishAnimations();
+  }
+
+  scrollToBottom(): void {
+    if (!this.#mainElementRef?.value) {
       return;
     }
 
-    scrollContainer.scrollTop = this.#scrollTop;
+    this.#mainElementRef.value.scrollTop = this.#mainElementRef.value.scrollHeight;
   }
 
-  scrollToLastMessage(): void {
-    const message = this.#shadow.querySelector('.chat-message:last-child') as HTMLDivElement;
-    if (!message) {
+  #handleMessagesContainerResize(): void {
+    if (!this.#pinScrollToBottom) {
       return;
     }
-    message.scrollIntoViewIfNeeded();
+
+    if (!this.#mainElementRef?.value) {
+      return;
+    }
+
+    if (this.#pinScrollToBottom) {
+      this.#mainElementRef.value.scrollTop = this.#mainElementRef.value.scrollHeight;
+    }
   }
 
   #setInputText(text: string): void {
@@ -417,23 +500,49 @@ export class FreestylerChatUi extends HTMLElement {
 
     // Agent-specific input disabled rules.
     switch (this.#props.agentType) {
-      case AgentType.FREESTYLER:
+      case AgentType.STYLING:
         return showsSideEffects;
-      case AgentType.DRJONES_NETWORK_REQUEST:
+      case AgentType.NETWORK:
+        return false;
+      case AgentType.FILE:
         return false;
-      case AgentType.DRJONES_FILE:
+      case AgentType.PERFORMANCE:
         return false;
-      case AgentType.DRJONES_PERFORMANCE:
+      case AgentType.PATCH:
         return false;
     }
   };
 
+  #handleMessageContainerRef(el: Element|undefined): void {
+    this.#messagesContainerElement = el;
+
+    if (el) {
+      this.#messagesContainerResizeObserver.observe(el);
+    } else {
+      this.#pinScrollToBottom = true;
+      this.#messagesContainerResizeObserver.disconnect();
+    }
+  }
+
+  #handleLastAnswerMarkdownViewRef(el: Element|undefined): void {
+    if (!el) {
+      this.#lastAnswerMarkdownView = undefined;
+      return;
+    }
+
+    if (el instanceof MarkdownView.MarkdownView.MarkdownView) {
+      this.#lastAnswerMarkdownView = el;
+    }
+  }
+
   #handleScroll = (ev: Event): void => {
     if (!ev.target || !(ev.target instanceof HTMLElement)) {
       return;
     }
 
     this.#scrollTop = ev.target.scrollTop;
+    this.#pinScrollToBottom =
+        ev.target.scrollTop + ev.target.clientHeight + SCROLL_ROUNDING_OFFSET > ev.target.scrollHeight;
   };
 
   #handleSubmit = (ev: SubmitEvent): void => {
@@ -478,7 +587,8 @@ export class FreestylerChatUi extends HTMLElement {
     Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiAssistanceDynamicSuggestionClicked);
   };
 
-  #renderUserActionRow(rpcId?: number, suggestions?: [string, ...string[]]): LitHtml.TemplateResult {
+  #renderUserActionRow(rpcId?: Host.AidaClient.RpcGlobalId, suggestions?: [string, ...string[]]):
+      LitHtml.TemplateResult {
     // clang-format off
     return html`<devtools-user-action-row
       .props=${{
@@ -497,7 +607,10 @@ export class FreestylerChatUi extends HTMLElement {
     // clang-format on
   }
 
-  #renderTextAsMarkdown(text: string): LitHtml.TemplateResult {
+  #renderTextAsMarkdown(text: string, {animate, ref: refFn}: {
+    animate?: boolean,
+    ref?: (element?: Element) => void,
+  } = {}): LitHtml.TemplateResult {
     let tokens = [];
     try {
       tokens = Marked.Marked.lexer(text);
@@ -517,7 +630,8 @@ export class FreestylerChatUi extends HTMLElement {
 
     // clang-format off
     return html`<devtools-markdown-view
-      .data=${{tokens, renderer: this.#markdownRenderer} as MarkdownView.MarkdownView.MarkdownViewData}>
+      .data=${{tokens, renderer: this.#markdownRenderer, animationEnabled: animate} as MarkdownView.MarkdownView.MarkdownViewData}
+      ${refFn ? ref(refFn) : LitHtml.nothing}>
     </devtools-markdown-view>`;
     // clang-format on
   }
@@ -704,6 +818,7 @@ export class FreestylerChatUi extends HTMLElement {
       let errorMessage;
       switch (message.error) {
         case ErrorType.UNKNOWN:
+        case ErrorType.BLOCK:
           errorMessage = UIStringsNotTranslate.systemError;
           break;
         case ErrorType.MAX_STEPS:
@@ -766,7 +881,7 @@ export class FreestylerChatUi extends HTMLElement {
           },
         )}
         ${message.answer
-          ? html`<p>${this.#renderTextAsMarkdown(message.answer)}</p>`
+          ? html`<p>${this.#renderTextAsMarkdown(message.answer, { animate: !this.#props.isReadOnly, ref: this.#handleLastAnswerMarkdownViewRef })}</p>`
           : LitHtml.nothing}
         ${this.#renderError(message)}
         <div class="actions">
@@ -790,20 +905,27 @@ export class FreestylerChatUi extends HTMLElement {
   }
 
   #renderContextSelector(): LitHtml.LitTemplate {
+    // TODO: currently the picker behavior is SDKNode specific.
+    const hasPickerBehavior = this.#props.agentType === AgentType.STYLING;
+
     const resourceClass = LitHtml.Directives.classMap({
       'not-selected': !this.#props.selectedContext,
       'resource-link': true,
+      'allow-overflow': hasPickerBehavior,
     });
 
-    // TODO: currently the picker behavior is SDKNode specific.
-    const hasPickerBehavior = this.#props.agentType === AgentType.FREESTYLER;
-
     if (!this.#props.selectedContext && !hasPickerBehavior) {
       return LitHtml.nothing;
     }
 
     const icon = this.#props.selectedContext?.getIcon() ?? LitHtml.nothing;
 
+    const handleKeyDown = (ev: KeyboardEvent): void => {
+      if (ev.key === 'Enter') {
+        void this.#props.onContextClick();
+      }
+    };
+
     // clang-format off
     return html`<div class="select-element">
       ${
@@ -823,11 +945,16 @@ export class FreestylerChatUi extends HTMLElement {
           ></devtools-button>
         ` : LitHtml.nothing
       }
-      <div role=button class=${resourceClass}
-        @click=${this.#props.onContextClick}>
-          ${icon}${this.#props.selectedContext?.getTitle() ?? html`<span>${
-            lockedString(UIStringsNotTranslate.noElementSelected)
-          }</span>`}
+      <div
+        role=button
+        class=${resourceClass}
+        tabindex=${hasPickerBehavior ? '-1' : '0'}
+        @click=${this.#props.onContextClick}
+        @keydown=${handleKeyDown}
+      >
+        ${icon}${this.#props.selectedContext?.getTitle() ?? html`<span>${
+          lockedString(UIStringsNotTranslate.noElementSelected)
+        }</span>`}
       </div>
     </div>`;
     // clang-format on
@@ -836,7 +963,7 @@ export class FreestylerChatUi extends HTMLElement {
   #renderMessages = (): LitHtml.TemplateResult => {
     // clang-format off
     return html`
-      <div class="messages-container">
+      <div class="messages-container" ${ref(this.#handleMessageContainerRef)}>
         ${this.#props.messages.map((message, _, array) =>
           this.#renderChatMessage(message, {
             isLast: array.at(-1) === message,
@@ -885,35 +1012,45 @@ export class FreestylerChatUi extends HTMLElement {
     this.#props.onNewConversation();
   }
 
+  #onCancelCrossOriginChat(): void {
+    this.#props.onCancelCrossOriginChat?.();
+  }
+
   #getEmptyStateSuggestions = (): string[] => {
     if (!this.#props.agentType) {
       return [];
     }
     switch (this.#props.agentType) {
-      case AgentType.FREESTYLER:
+      case AgentType.STYLING:
         return [
           'What can you help me with?',
           'Why isn’t this element visible?',
           'How do I center this element?',
         ];
-      case AgentType.DRJONES_FILE:
+      case AgentType.FILE:
         return [
           'What does this script do?',
           'Is the script optimized for performance?',
           'Does the script handle user input safely?',
         ];
-      case AgentType.DRJONES_NETWORK_REQUEST:
+      case AgentType.NETWORK:
         return [
           'Why is this network request taking so long?',
           'Are there any security headers present?',
           'Why is the request failing?',
         ];
-      case AgentType.DRJONES_PERFORMANCE:
+      case AgentType.PERFORMANCE:
         return [
           'Identify performance issues in this call tree',
           'Where is most of the time being spent in this call tree?',
           'How can I reduce the time of this call tree?',
         ];
+      case AgentType.PATCH:
+        return [
+          'What can you help me with?',
+          'Why isn’t this element visible?',
+          'How do I center this element?',
+        ];
     }
   };
 
@@ -930,14 +1067,23 @@ export class FreestylerChatUi extends HTMLElement {
       return lockedString(UIStringsNotTranslate.crossOriginError);
     }
     switch (agentType) {
-      case AgentType.FREESTYLER:
+      case AgentType.PATCH:
         return lockedString(UIStringsNotTranslate.inputPlaceholderForFreestylerAgent);
-      case AgentType.DRJONES_FILE:
-        return lockedString(UIStringsNotTranslate.inputPlaceholderForDrJonesFileAgent);
-      case AgentType.DRJONES_NETWORK_REQUEST:
-        return lockedString(UIStringsNotTranslate.inputPlaceholderForDrJonesNetworkAgent);
-      case AgentType.DRJONES_PERFORMANCE:
-        return lockedString(UIStringsNotTranslate.inputPlaceholderForDrJonesPerformanceAgent);
+      case AgentType.STYLING:
+        return this.#props.selectedContext ?
+            lockedString(UIStringsNotTranslate.inputPlaceholderForFreestylerAgent) :
+            lockedString(UIStringsNotTranslate.inputPlaceholderForFreestylerAgentNoContext);
+      case AgentType.FILE:
+        return this.#props.selectedContext ? lockedString(UIStringsNotTranslate.inputPlaceholderForFileAgent) :
+                                             lockedString(UIStringsNotTranslate.inputPlaceholderForFileAgentNoContext);
+      case AgentType.NETWORK:
+        return this.#props.selectedContext ?
+            lockedString(UIStringsNotTranslate.inputPlaceholderForNetworkAgent) :
+            lockedString(UIStringsNotTranslate.inputPlaceholderForNetworkAgentNoContext);
+      case AgentType.PERFORMANCE:
+        return this.#props.selectedContext ?
+            lockedString(UIStringsNotTranslate.inputPlaceholderForPerformanceAgent) :
+            lockedString(UIStringsNotTranslate.inputPlaceholderForPerformanceAgentNoContext);
     }
   }
 
@@ -954,6 +1100,7 @@ export class FreestylerChatUi extends HTMLElement {
       <span>${lockedString(UIStringsNotTranslate.pastConversation)}</span>
       <devtools-button
         aria-label=${lockedString(UIStringsNotTranslate.startNewChat)}
+        class="chat-inline-button"
         @click=${this.#onNewConversation}
         .data=${{
           variant: Buttons.Button.Variant.TEXT,
@@ -965,7 +1112,7 @@ export class FreestylerChatUi extends HTMLElement {
     // clang-format on
   }
 
-  #renderChatInputButton(): LitHtml.TemplateResult {
+  #renderChatInputButtons(): LitHtml.TemplateResult {
     if (this.#props.isLoading) {
       // clang-format off
       return html`<devtools-button
@@ -986,19 +1133,32 @@ export class FreestylerChatUi extends HTMLElement {
     }
     if (this.#props.blockedByCrossOrigin || this.#props.requiresNewConversation) {
       // clang-format off
-      return html`<devtools-button
-        class="chat-input-button"
-        aria-label=${lockedString(UIStringsNotTranslate.startNewChat)}
-        @click=${this.#onNewConversation}
-        .data=${
-          {
-            variant: Buttons.Button.Variant.PRIMARY,
-            size: Buttons.Button.Size.REGULAR,
-            title: lockedString(UIStringsNotTranslate.startNewChat),
-            jslogContext: 'start-new-chat',
-          } as Buttons.Button.ButtonData
-        }
-      >${lockedString(UIStringsNotTranslate.startNewChat)}</devtools-button>`;
+      return html`
+        ${this.#props.blockedByCrossOrigin && Boolean(this.#props.onCancelCrossOriginChat) ? html`<devtools-button
+          class="chat-cancel-context-button"
+          @click=${this.#onCancelCrossOriginChat}
+          .data=${
+            {
+              variant: Buttons.Button.Variant.TEXT,
+              size: Buttons.Button.Size.REGULAR,
+              jslogContext: 'cancel-cross-origin-context-chat',
+            } as Buttons.Button.ButtonData
+          }
+        >${lockedString(UIStringsNotTranslate.cancelButtonTitle)}</devtools-button>` : LitHtml.nothing}
+        <devtools-button
+          class="chat-input-button"
+          aria-label=${lockedString(UIStringsNotTranslate.startNewChat)}
+          @click=${this.#onNewConversation}
+          .data=${
+            {
+              variant: Buttons.Button.Variant.PRIMARY,
+              size: Buttons.Button.Size.REGULAR,
+              title: lockedString(UIStringsNotTranslate.startNewChat),
+              jslogContext: 'start-new-chat',
+            } as Buttons.Button.ButtonData
+          }
+        >${lockedString(UIStringsNotTranslate.startNewChat)}</devtools-button>
+      `;
       // clang-format on
     }
     // clang-format off
@@ -1024,9 +1184,18 @@ export class FreestylerChatUi extends HTMLElement {
       return LitHtml.nothing;
     }
 
+    const cls = LitHtml.Directives.classMap({
+      'chat-input': true,
+      'one-big-button': Boolean(this.#props.requiresNewConversation),
+      'two-big-buttons': this.#props.blockedByCrossOrigin,
+    });
+
     // clang-format off
     return html`
     <form class="input-form" @submit=${this.#handleSubmit}>
+      <div class="input-form-shadow-container">
+        <div class="input-form-shadow"></div>
+      </div>
       ${this.#props.state !== State.CONSENT_VIEW ? html`
         <div class="input-header">
           <div class="header-link-container">
@@ -1035,14 +1204,16 @@ export class FreestylerChatUi extends HTMLElement {
         </div>
       ` : LitHtml.nothing}
       <div class="chat-input-container">
-        <textarea class="chat-input"
+        <textarea class=${cls}
           .disabled=${this.#isTextInputDisabled()}
           wrap="hard"
           @keydown=${this.#handleTextAreaKeyDown}
           placeholder=${this.#getInputPlaceholderString()}
           jslog=${VisualLogging.textField('query').track({ keydown: 'Enter' })}
         ></textarea>
-        ${this.#renderChatInputButton()}
+        <div class="chat-input-buttons">
+          ${this.#renderChatInputButtons()}
+        </div>
       </div>
     </form>`;
     // clang-format on
@@ -1052,15 +1223,34 @@ export class FreestylerChatUi extends HTMLElement {
     if (this.#props.state === State.CONSENT_VIEW || !this.#props.agentType || this.#props.isReadOnly) {
       return i18nString(UIStrings.inputDisclaimerForEmptyState);
     }
+    const noLogging = Common.Settings.Settings.instance().getHostConfig().aidaAvailability?.enterprisePolicyValue ===
+        Root.Runtime.GenAiEnterprisePolicyValue.ALLOW_WITHOUT_LOGGING;
     switch (this.#props.agentType) {
-      case AgentType.FREESTYLER:
+      case AgentType.PATCH:
+        if (noLogging) {
+          return lockedString(UIStringsNotTranslate.inputDisclaimerForFreestylerAgentEnterpriseNoLogging);
+        }
+        return lockedString(UIStringsNotTranslate.inputDisclaimerForFreestylerAgent);
+      case AgentType.STYLING:
+        if (noLogging) {
+          return lockedString(UIStringsNotTranslate.inputDisclaimerForFreestylerAgentEnterpriseNoLogging);
+        }
         return lockedString(UIStringsNotTranslate.inputDisclaimerForFreestylerAgent);
-      case AgentType.DRJONES_FILE:
-        return lockedString(UIStringsNotTranslate.inputDisclaimerForDrJonesFileAgent);
-      case AgentType.DRJONES_NETWORK_REQUEST:
-        return lockedString(UIStringsNotTranslate.inputDisclaimerForDrJonesNetworkAgent);
-      case AgentType.DRJONES_PERFORMANCE:
-        return lockedString(UIStringsNotTranslate.inputDisclaimerForDrJonesPerformanceAgent);
+      case AgentType.FILE:
+        if (noLogging) {
+          return lockedString(UIStringsNotTranslate.inputDisclaimerForFileAgentEnterpriseNoLogging);
+        }
+        return lockedString(UIStringsNotTranslate.inputDisclaimerForFileAgent);
+      case AgentType.NETWORK:
+        if (noLogging) {
+          return lockedString(UIStringsNotTranslate.inputDisclaimerForNetworkAgentEnterpriseNoLogging);
+        }
+        return lockedString(UIStringsNotTranslate.inputDisclaimerForNetworkAgent);
+      case AgentType.PERFORMANCE:
+        if (noLogging) {
+          return lockedString(UIStringsNotTranslate.inputDisclaimerForPerformanceAgentEnterpriseNoLogging);
+        }
+        return lockedString(UIStringsNotTranslate.inputDisclaimerForPerformanceAgent);
     }
   };
 
@@ -1226,14 +1416,14 @@ export class FreestylerChatUi extends HTMLElement {
     // clang-format off
     LitHtml.render(html`
       <div class="chat-ui">
-        <main @scroll=${this.#handleScroll}>
+        <main @scroll=${this.#handleScroll} ${ref(this.#mainElementRef)}>
           ${this.#renderMainContents()}
           ${this.#props.isReadOnly ?
               this.#renderReadOnlySection() :
               this.#renderChatInput()
           }
         </main>
-        <footer class="disclaimer">
+        <footer class="disclaimer" jslog=${VisualLogging.section('footer')}>
           <p class="disclaimer-text">
             ${this.#getDisclaimerText()}
             <button
@@ -1256,7 +1446,7 @@ export class FreestylerChatUi extends HTMLElement {
 
 declare global {
   interface HTMLElementTagNameMap {
-    'devtools-freestyler-chat-ui': FreestylerChatUi;
+    'devtools-ai-chat-view': ChatView;
   }
 }
 
@@ -1264,4 +1454,4 @@ export const FOR_TEST = {
   MarkdownRendererWithCodeBlock,
 };
 
-customElements.define('devtools-freestyler-chat-ui', FreestylerChatUi);
+customElements.define('devtools-ai-chat-view', ChatView);

package/front_end/panels/{freestyler → ai_assistance}/components/UserActionRow.test.ts

@@ -6,7 +6,7 @@ import {renderElementIntoDOM} from '../../../testing/DOMHelpers.js';
 import {
   describeWithEnvironment,
 } from '../../../testing/EnvironmentHelpers.js';
-import * as Freestyler from '../freestyler.js';
+import * as Freestyler from '../ai_assistance.js';
 
 describeWithEnvironment('UserActionRow', () => {
   it('should show the feedback form when canShowFeedbackForm is true', async () => {