diff --git a/app/assets/javascripts/super_sidebar/constants.js b/app/assets/javascripts/super_sidebar/constants.js
index 42e5bfc5ebfc268d0cd5a6bafad9f0b9c8a51148..a8cc4b5991bbc7a957e282b99f279acfae3af81c 100644
--- a/app/assets/javascripts/super_sidebar/constants.js
+++ b/app/assets/javascripts/super_sidebar/constants.js
@@ -23,10 +23,17 @@ export const sidebarState = Vue.observable({
   wasHoverPeek: false,
 });
 
+export const CHAT_MODES = {
+  CLASSIC: 'classic',
+  AGENTIC: 'agentic',
+};
+
 export const duoChatGlobalState = Vue.observable({
   commands: [],
   isShown: false,
   isAgenticChatShown: false,
+  chatMode: CHAT_MODES.CLASSIC, // CHAT_MODES.CLASSIC or CHAT_MODES.AGENTIC - single source of truth for chat mode
+  activeTab: null, // For embedded mode: which tab is active in the AI panel ('chat', 'history', etc.)
 });
 
 export const SUPER_SIDEBAR_PEEK_OPEN_DELAY = 200;
diff --git a/ee/app/assets/javascripts/ai/components/ai_panel.vue b/ee/app/assets/javascripts/ai/components/ai_panel.vue
index e20e8efff677629e3a79a76170758710cff6acf1..3462d29ba874b4efafe9e3899880551c7b267aa2 100644
--- a/ee/app/assets/javascripts/ai/components/ai_panel.vue
+++ b/ee/app/assets/javascripts/ai/components/ai_panel.vue
@@ -4,7 +4,9 @@ import { __ } from '~/locale';
 import AgentSessionsRoot from '~/vue_shared/spa/components/spa_root.vue';
 import { AGENTS_PLATFORM_SHOW_ROUTE } from 'ee/ai/duo_agents_platform/router/constants';
 import { formatAgentFlowName } from 'ee/ai/duo_agents_platform/utils';
+import { CHAT_MODES } from 'ee/ai/tanuki_bot/constants';
 import Cookies from '~/lib/utils/cookies';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
 import AiContentContainer from './content_container.vue';
 import NavigationRail from './navigation_rail.vue';
 
@@ -55,30 +57,51 @@ export default {
     },
   },
   data() {
+    // Initialize global state from cookie if not already set
+    if (duoChatGlobalState.activeTab === null) {
+      duoChatGlobalState.activeTab = Cookies.get(ACTIVE_TAB_KEY) || undefined;
+    }
+
     return {
-      activeTab: Cookies.get(ACTIVE_TAB_KEY),
       isDesktop: GlBreakpointInstance.isDesktop(),
+      duoChatGlobalState,
     };
   },
   computed: {
+    activeTab() {
+      return this.duoChatGlobalState.activeTab;
+    },
+    isAgenticMode() {
+      return this.duoChatGlobalState.chatMode === CHAT_MODES.AGENTIC;
+    },
+    currentChatComponent() {
+      return this.isAgenticMode
+        ? this.chatConfiguration.agenticComponent
+        : this.chatConfiguration.classicComponent;
+    },
+    currentChatTitle() {
+      return this.isAgenticMode
+        ? this.chatConfiguration.agenticTitle
+        : this.chatConfiguration.classicTitle;
+    },
     currentTabComponent() {
       switch (this.activeTab) {
         case 'chat':
           return {
-            title: this.chatConfiguration.title,
-            component: this.chatConfiguration.component,
+            title: this.currentChatTitle,
+            component: this.currentChatComponent,
             props: { mode: 'active', ...this.chatConfiguration.defaultProps },
           };
         case 'new':
           return {
             title: __('New Chat'),
-            component: this.chatConfiguration.component,
+            component: this.currentChatComponent,
             props: { mode: 'new', ...this.chatConfiguration.defaultProps },
           };
         case 'history':
           return {
             title: __('History'),
-            component: this.chatConfiguration.component,
+            component: this.currentChatComponent,
             props: { mode: 'history', ...this.chatConfiguration.defaultProps },
           };
         case 'suggestions':
@@ -124,7 +147,9 @@ export default {
       }
     },
     setActiveTab(value) {
-      this.activeTab = value;
+      // Update global state (will trigger Vue reactivity)
+      this.duoChatGlobalState.activeTab = value;
+      // Also update cookie for persistence across page loads
       if (value) {
         Cookies.set(ACTIVE_TAB_KEY, value);
       } else {
diff --git a/ee/app/assets/javascripts/ai/components/content_container.vue b/ee/app/assets/javascripts/ai/components/content_container.vue
index 8a2637306757f054e4519f23aec04c53d74f34d7..4b80aee13e11b0409848cf6ee5d19844cded8c5e 100644
--- a/ee/app/assets/javascripts/ai/components/content_container.vue
+++ b/ee/app/assets/javascripts/ai/components/content_container.vue
@@ -1,5 +1,6 @@
 <script>
 import { GlButton, GlTooltipDirective } from '@gitlab/ui';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
 import { __ } from '~/locale';
 
 export default {
@@ -10,6 +11,7 @@ export default {
   directives: {
     GlTooltip: GlTooltipDirective,
   },
+  inject: ['chatConfiguration'],
   i18n: {
     collapseButtonLabel: __('Collapse panel'),
   },
@@ -66,6 +68,7 @@ export default {
     return {
       isMaximized: false,
       currentTitle: null,
+      duoChatGlobalState,
     };
   },
   computed: {
@@ -75,6 +78,12 @@ export default {
     maximizeButtonLabel() {
       return this.isMaximized ? __('Minimize panel') : __('Maximize panel');
     },
+    componentKey() {
+      // Include chatMode in the key to force component recreation when switching
+      // between modes, ensuring state doesn't persist
+      const componentName = this.activeTab.component?.name || 'component';
+      return `${componentName}-${this.duoChatGlobalState.chatMode}`;
+    },
   },
   methods: {
     handleGoBack() {
@@ -162,6 +171,7 @@ export default {
       <component
         :is="activeTab.component"
         v-else
+        :key="componentKey"
         :user-id="userId"
         :project-id="projectId"
         :namespace-id="namespaceId"
diff --git a/ee/app/assets/javascripts/ai/components/navigation_rail.vue b/ee/app/assets/javascripts/ai/components/navigation_rail.vue
index 354dd3fb8d4c6ab8ca27d9c5c8231b17d90ada36..800a3325ef30946828b9a243eda1d81ea24137ec 100644
--- a/ee/app/assets/javascripts/ai/components/navigation_rail.vue
+++ b/ee/app/assets/javascripts/ai/components/navigation_rail.vue
@@ -3,6 +3,8 @@ import { GlButton, GlTooltipDirective } from '@gitlab/ui';
 import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { keysFor, DUO_CHAT } from '~/behaviors/shortcuts/keybindings';
 import { shouldDisableShortcuts } from '~/behaviors/shortcuts/shortcuts_toggle';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
+import { CHAT_MODES } from 'ee/ai/tanuki_bot/constants';
 import { __ } from '~/locale';
 import { sanitize } from '~/lib/dompurify';
 
@@ -16,6 +18,7 @@ export default {
   },
   i18n: {
     duoChatLabel: __('Active GitLab Duo Chat'),
+    currentChatLabel: __('Current GitLab Duo Chat'),
     newLabel: __('New GitLab Duo Chat'),
     historyLabel: __('GitLab Duo Chat history'),
     suggestionsLabel: __('GitLab Duo suggestions'),
@@ -38,12 +41,25 @@ export default {
       default: true,
     },
   },
+  data() {
+    return {
+      duoChatGlobalState,
+    };
+  },
   computed: {
+    isAgenticMode() {
+      return this.duoChatGlobalState.chatMode === CHAT_MODES.AGENTIC;
+    },
+    showSessionsButton() {
+      return this.isAgenticMode;
+    },
     duoShortcutKey() {
       return shouldDisableShortcuts() ? null : keysFor(DUO_CHAT);
     },
     formattedDuoShortcutTooltip() {
-      const description = this.$options.i18n.duoChatLabel;
+      const description = this.isAgenticMode
+        ? this.$options.i18n.currentChatLabel
+        : this.$options.i18n.duoChatLabel;
       const key = keysFor(DUO_CHAT);
       return shouldDisableShortcuts()
         ? description
@@ -113,24 +129,26 @@ export default {
       @mouseout="hideTooltips"
       @click="toggleTab('history')"
     />
-    <div
-      class="gl-my-4 gl-h-5 gl-w-1 gl-border-0 gl-border-r-1 gl-border-solid gl-border-[#7759C233] lg:gl-mx-auto lg:gl-h-1 lg:gl-w-5 lg:gl-border-r-0 lg:gl-border-t-1"
-      name="divider"
-    ></div>
-    <gl-button
-      v-gl-tooltip.left
-      icon="session-ai"
-      class="!gl-rounded-lg"
-      :class="['ai-nav-icon', { 'ai-nav-icon-active': activeTab === 'sessions' }]"
-      category="tertiary"
-      :aria-selected="activeTab === 'sessions'"
-      :aria-expanded="isExpanded"
-      :aria-label="$options.i18n.sessionsLabel"
-      :title="$options.i18n.sessionsLabel"
-      data-testid="ai-sessions-toggle"
-      @mouseout="hideTooltips"
-      @click="toggleTab('sessions')"
-    />
+    <template v-if="showSessionsButton">
+      <div
+        class="gl-my-4 gl-h-5 gl-w-1 gl-border-0 gl-border-r-1 gl-border-solid gl-border-[#7759C233] lg:gl-mx-auto lg:gl-h-1 lg:gl-w-5 lg:gl-border-r-0 lg:gl-border-t-1"
+        name="divider"
+      ></div>
+      <gl-button
+        v-gl-tooltip.left
+        icon="session-ai"
+        class="!gl-rounded-lg"
+        :class="['ai-nav-icon', { 'ai-nav-icon-active': activeTab === 'sessions' }]"
+        category="tertiary"
+        :aria-selected="activeTab === 'sessions'"
+        :aria-expanded="isExpanded"
+        :aria-label="$options.i18n.sessionsLabel"
+        :title="$options.i18n.sessionsLabel"
+        data-testid="ai-sessions-toggle"
+        @mouseout="hideTooltips"
+        @click="toggleTab('sessions')"
+      />
+    </template>
     <gl-button
       v-if="showSuggestionsTab"
       v-gl-tooltip.left
diff --git a/ee/app/assets/javascripts/ai/duo_agentic_chat/components/duo_agentic_chat.vue b/ee/app/assets/javascripts/ai/duo_agentic_chat/components/duo_agentic_chat.vue
index 4b468abd92a5d9bcd60be505e5e41f221b51978b..e655cd76088cc622134aa771e9e5b45cb063a091 100644
--- a/ee/app/assets/javascripts/ai/duo_agentic_chat/components/duo_agentic_chat.vue
+++ b/ee/app/assets/javascripts/ai/duo_agentic_chat/components/duo_agentic_chat.vue
@@ -413,6 +413,10 @@ export default {
       window.removeEventListener('resize', this.onWindowResize);
     }
     this.cleanupSocket();
+    // Clear messages when component is destroyed to prevent state leaking
+    // between mode switches (classic <-> agentic)
+    this.setMessages([]);
+    this.setLoading(false);
   },
   methods: {
     ...mapActions(['addDuoChatMessage', 'setMessages', 'setLoading']),
diff --git a/ee/app/assets/javascripts/ai/init_duo_panel.js b/ee/app/assets/javascripts/ai/init_duo_panel.js
index 291a102497a5ee5b19b5398bd5938d24daf7c51d..1a57c1053d928b24140e1af7ada55128f4bfc38c 100644
--- a/ee/app/assets/javascripts/ai/init_duo_panel.js
+++ b/ee/app/assets/javascripts/ai/init_duo_panel.js
@@ -5,6 +5,7 @@ import { parseBoolean } from '~/lib/utils/common_utils';
 import { __ } from '~/locale';
 import { createRouter } from 'ee/ai/duo_agents_platform/router/ai_panel_router';
 import DuoAgenticChat from 'ee/ai/duo_agentic_chat/components/duo_agentic_chat.vue';
+import DuoChat from 'ee/ai/tanuki_bot/components/duo_chat.vue';
 import { activeWorkItemIds } from '~/work_items/utils';
 import store from './tanuki_bot/store';
 import AIPanel from './components/ai_panel.vue';
@@ -28,8 +29,6 @@ export function initDuoPanel() {
     chatTitle,
   } = el.dataset;
 
-  const isAgenticAvailable = parseBoolean(agenticAvailable);
-
   const router = createRouter('/', 'user');
   Vue.use(VueApollo);
 
@@ -39,11 +38,21 @@ export function initDuoPanel() {
 
   // Configure chat-specific values in a single configuration object
   const chatConfiguration = {
-    component: isAgenticAvailable ? DuoAgenticChat : __('Chat is not available.'),
-    title: chatTitle || __('GitLab Duo Agentic Chat'),
-    isAgenticAvailable,
+    agenticComponent: DuoAgenticChat,
+    classicComponent: DuoChat,
+    agenticTitle: chatTitle || __('GitLab Duo Agentic Chat'),
+    classicTitle: __('GitLab Duo Chat'),
     defaultProps: {
       isEmbedded: true,
+      userId,
+      projectId,
+      namespaceId,
+      rootNamespaceId,
+      resourceId,
+      metadata,
+      userModelSelectionEnabled: parseBoolean(userModelSelectionEnabled),
+      agenticAvailable: parseBoolean(agenticAvailable),
+      chatTitle,
     },
   };
 
diff --git a/ee/app/assets/javascripts/ai/tanuki_bot/components/duo_chat.vue b/ee/app/assets/javascripts/ai/tanuki_bot/components/duo_chat.vue
index ca52a3368f57efff1c3bd45bafb9dbce700a0a8f..b0dd3edf2f11f79310b2f89999882fefd65bc72a 100644
--- a/ee/app/assets/javascripts/ai/tanuki_bot/components/duo_chat.vue
+++ b/ee/app/assets/javascripts/ai/tanuki_bot/components/duo_chat.vue
@@ -102,6 +102,11 @@ export default {
       required: false,
       default: 'default',
     },
+    isEmbedded: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   apollo: {
     // eslint-disable-next-line @gitlab/vue-no-undef-apollo-properties
@@ -113,7 +118,7 @@ export default {
         };
       },
       skip() {
-        return !this.duoChatGlobalState.isShown;
+        return this.shouldSkipQueries;
       },
       fetchPolicy: fetchPolicies.NETWORK_ONLY,
       result({ data }) {
@@ -128,7 +133,7 @@ export default {
     aiConversationThreads: {
       query: getAiConversationThreads,
       skip() {
-        return !this.duoChatGlobalState.isShown;
+        return this.shouldSkipQueries;
       },
       update(data) {
         return data?.aiConversationThreads?.nodes || [];
@@ -140,7 +145,7 @@ export default {
     aiSlashCommands: {
       query: getAiSlashCommands,
       skip() {
-        return !this.duoChatGlobalState.isShown;
+        return this.shouldSkipQueries;
       },
       variables() {
         return {
@@ -157,7 +162,7 @@ export default {
     contextPresets: {
       query: getAiChatContextPresets,
       skip() {
-        return !this.duoChatGlobalState.isShown;
+        return this.shouldSkipQueries;
       },
       variables() {
         return {
@@ -201,12 +206,16 @@ export default {
   },
   computed: {
     ...mapState(['loading', 'messages']),
+    shouldSkipQueries() {
+      // In embedded mode, always load; in drawer mode, only load when shown
+      return this.isEmbedded ? false : !this.duoChatGlobalState.isShown;
+    },
     duoAgenticModePreference: {
       get() {
         return getCookie(DUO_AGENTIC_MODE_COOKIE) === 'true';
       },
       set(value) {
-        setAgenticMode({ agenticMode: value, saveCookie: true });
+        setAgenticMode({ agenticMode: value, saveCookie: true, isEmbedded: this.isEmbedded });
       },
     },
     computedResourceId() {
@@ -217,6 +226,11 @@ export default {
       return this.resourceId || this.userId;
     },
     dimensions() {
+      // Only return dimensions for drawer mode; embedded mode doesn't need them
+      if (this.isEmbedded) {
+        return {};
+      }
+
       return {
         width: this.width,
         height: this.height,
@@ -268,13 +282,22 @@ export default {
     },
   },
   mounted() {
-    this.setDimensions();
-    window.addEventListener('resize', this.onWindowResize);
+    // Only manage dimensions and resize when not isEmbedded
+    if (!this.isEmbedded) {
+      this.setDimensions();
+      window.addEventListener('resize', this.onWindowResize);
+    }
     this.switchMode(this.mode);
   },
   beforeDestroy() {
     // Remove the event listener when the component is destroyed
-    window.removeEventListener('resize', this.onWindowResize);
+    if (!this.isEmbedded) {
+      window.removeEventListener('resize', this.onWindowResize);
+    }
+    // Clear messages when component is destroyed to prevent state leaking
+    // between mode switches (classic <-> agentic)
+    this.setMessages([]);
+    this.setLoading(false);
   },
   methods: {
     ...mapActions(['addDuoChatMessage', 'setMessages', 'setLoading']),
@@ -444,7 +467,11 @@ export default {
         });
     },
     onChatClose() {
-      this.duoChatGlobalState.isShown = false;
+      // Only manage global state when not isEmbedded
+      // When isEmbedded, the parent container (AI Panel) manages the visibility
+      if (!this.isEmbedded) {
+        this.duoChatGlobalState.isShown = false;
+      }
     },
     onCalloutDismissed() {
       this.duoChatGlobalState.isShown = true;
@@ -515,7 +542,7 @@ export default {
 
 <template>
   <div class="gl-grow-1 gl-flex gl-w-full">
-    <div v-if="duoChatGlobalState.isShown" class="gl-w-full">
+    <div v-if="isEmbedded || duoChatGlobalState.isShown" class="gl-w-full">
       <!-- Renderless component for subscriptions -->
       <tanuki-bot-subscriptions
         :user-id="userId"
@@ -541,12 +568,12 @@ export default {
         :messages="messages"
         :error="error"
         :is-loading="loading"
-        :should-render-resizable="true"
+        :should-render-resizable="!isEmbedded"
         :predefined-prompts="predefinedPrompts"
         :badge-type="null"
         :tool-name="toolName"
         :canceled-request-ids="cancelledRequestIds"
-        class="duo-chat-container gl-h-full"
+        :class="isEmbedded ? 'gl-h-full gl-w-full' : 'duo-chat-container gl-h-full'"
         @thread-selected="onThreadSelected"
         @new-chat="onNewChat"
         @back-to-list="onBackToList"
diff --git a/ee/app/assets/javascripts/ai/tanuki_bot/constants.js b/ee/app/assets/javascripts/ai/tanuki_bot/constants.js
index 8a45f3b0270ea569255d6445cb6fc0eb6be60962..e7f3ad8c7df338ed6b0a157a89edeeb771437328 100644
--- a/ee/app/assets/javascripts/ai/tanuki_bot/constants.js
+++ b/ee/app/assets/javascripts/ai/tanuki_bot/constants.js
@@ -1,5 +1,6 @@
 import { s__ } from '~/locale';
 import { GENIE_CHAT_MODEL_ROLES } from 'ee/ai/constants';
+import { CHAT_MODES } from '~/super_sidebar/constants';
 
 export const MESSAGE_TYPES = {
   USER: GENIE_CHAT_MODEL_ROLES.user,
@@ -33,3 +34,6 @@ export const MULTI_THREADED_CONVERSATION_TYPE = 'DUO_CHAT';
 
 export const DUO_AGENTIC_MODE_COOKIE = 'duo_agentic_mode_on';
 export const DUO_AGENTIC_MODE_COOKIE_EXPIRATION = 365 * 10;
+
+// Re-export CHAT_MODES for backward compatibility
+export { CHAT_MODES };
diff --git a/ee/app/assets/javascripts/ai/utils.js b/ee/app/assets/javascripts/ai/utils.js
index 7fd434e016f41e9ee751bcdc56d66e847f3e71b3..8d0dd534c1eab964b8e590744184b7cb19e07f26 100644
--- a/ee/app/assets/javascripts/ai/utils.js
+++ b/ee/app/assets/javascripts/ai/utils.js
@@ -1,10 +1,19 @@
 import { duoChatGlobalState } from '~/super_sidebar/constants';
-import { setCookie } from '~/lib/utils/common_utils';
+import { setCookie, getCookie } from '~/lib/utils/common_utils';
 import {
   DUO_AGENTIC_MODE_COOKIE,
   DUO_AGENTIC_MODE_COOKIE_EXPIRATION,
+  CHAT_MODES,
 } from 'ee/ai/tanuki_bot/constants';
 
+// Initialize chatMode from cookie on module load
+const savedMode = getCookie(DUO_AGENTIC_MODE_COOKIE);
+if (savedMode === 'true') {
+  duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+} else {
+  duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+}
+
 export const concatStreamedChunks = (arr) => {
   if (!arr) return '';
 
@@ -28,7 +37,7 @@ export const saveDuoAgenticModePreference = (isAgenticMode) => {
 };
 
 /**
- * Swith duo chat based on agenticMode value and save to cookie based on
+ * Switch duo chat based on agenticMode value and save to cookie based on
  * saveCookie value.
  *
  * @param {Object} params - The parameters object.
@@ -43,6 +52,10 @@ export const setAgenticMode = ({
   saveCookie = false,
   isEmbedded = false,
 } = {}) => {
+  // Update the single source of truth for chat mode
+  duoChatGlobalState.chatMode = agenticMode ? CHAT_MODES.AGENTIC : CHAT_MODES.CLASSIC;
+
+  // For drawer mode, also update the legacy isShown/isAgenticChatShown properties
   if (!isEmbedded) {
     duoChatGlobalState.isShown = !agenticMode;
     duoChatGlobalState.isAgenticChatShown = agenticMode;
@@ -57,6 +70,9 @@ export const setAgenticMode = ({
  * Sends a command to DuoChat to execute on. This should be use for
  * a single command.
  *
+ * External triggers always force classic mode and open the chat in whatever
+ * UI mode is currently active (drawer or embedded).
+ *
  * @param {question} String - Prompt to send to the chat endpoint
  * @param {resourceId} String - Unique ID to bind the streaming
  * @param {variables} Object - Additional variables to pass to graphql chat mutation
@@ -65,7 +81,21 @@ export const sendDuoChatCommand = ({ question, resourceId, variables = {} } = {}
   if (!question || !resourceId) {
     throw new Error('Both arguments `question` and `resourceId` are required');
   }
-  setAgenticMode({ agenticMode: false, saveCookie: true });
+
+  // Check if project studio (new design with embedded panel) is enabled
+  const isEmbedded = window.gon?.features?.projectStudioEnabled === true;
+
+  // External triggers always force classic mode
+  setAgenticMode({ agenticMode: false, saveCookie: true, isEmbedded });
+
+  if (isEmbedded) {
+    // Embedded mode: Open the AI panel to chat tab
+    duoChatGlobalState.activeTab = 'chat';
+  } else {
+    // Drawer mode: Open classic chat
+    duoChatGlobalState.isShown = true;
+    duoChatGlobalState.isAgenticChatShown = false;
+  }
 
   window.requestIdleCallback(() => {
     duoChatGlobalState.commands.push({
diff --git a/ee/spec/features/ai_sidepanel_spec.rb b/ee/spec/features/ai_sidepanel_spec.rb
deleted file mode 100644
index 4c7606c34466d33ebd90a25f6f0bb33f58f332cb..0000000000000000000000000000000000000000
--- a/ee/spec/features/ai_sidepanel_spec.rb
+++ /dev/null
@@ -1,152 +0,0 @@
-# frozen_string_literal: true
-
-require 'spec_helper'
-
-RSpec.describe 'AI Sidepanel', :js, feature_category: :duo_agent_platform do
-  let_it_be(:project) { create(:project, :repository) }
-  let_it_be(:user) { create(:user, :with_namespace) }
-  let(:ai_sidepanel_selector) { '.paneled-view.ai-panels' }
-  let(:sessions_toggle_selector) { 'ai-sessions-toggle' }
-
-  before_all do
-    project.add_developer(user)
-    project.project_setting.update!(duo_remote_flows_enabled: true, duo_features_enabled: true)
-  end
-
-  before do
-    sign_in(user)
-
-    stub_feature_flags(paneled_view: true, tailwind_container_queries: true)
-    user.update!(project_studio_enabled: true)
-
-    create(:callout, user: user, feature_name: :duo_chat_callout)
-
-    stub_feature_flags(duo_workflow_in_ci: true, duo_workflow: true)
-    stub_licensed_features(ai_workflows: true)
-    allow(::Ai::DuoWorkflow).to receive(:enabled?).and_return(true)
-    allow(::Gitlab::Llm::StageCheck).to receive(:available?).and_return(true)
-
-    allow(Ability).to receive(:allowed?).and_call_original
-    allow(Ability).to receive(:allowed?).with(user, :read_duo_workflow, anything).and_return(true)
-    allow(Ability).to receive(:allowed?).with(user, :duo_workflow, anything).and_return(true)
-
-    allow(::Ai::AmazonQ).to receive(:enabled?).and_return(false)
-    allow(::Gitlab::Llm::TanukiBot).to receive_messages(show_breadcrumbs_entry_point?: true, enabled_for?: true)
-  end
-
-  describe 'sidepanel visibility' do
-    it 'shows the AI sidepanel toggle and can expand' do
-      visit project_path(project)
-
-      expect(page).to have_css(ai_sidepanel_selector)
-
-      expect(page).not_to have_content("Sessions")
-
-      within(ai_sidepanel_selector) do
-        find_by_testid(sessions_toggle_selector).click
-      end
-
-      # Verify we're now in the agent sessions view
-      expect(page).to have_content("Sessions")
-    end
-
-    context 'when Project Studio is not available' do
-      before do
-        stub_feature_flags(paneled_view: false)
-      end
-
-      it 'does not show AI sidepanel' do
-        visit project_path(project)
-
-        expect(page).not_to have_css(ai_sidepanel_selector)
-      end
-    end
-
-    context 'when Project Studio is not enabled for user' do
-      before do
-        user.update!(project_studio_enabled: false)
-      end
-
-      it 'does not show AI sidepanel' do
-        visit project_path(project)
-
-        expect(page).not_to have_css(ai_sidepanel_selector)
-      end
-    end
-  end
-
-  describe 'agent sessions in sidepanel' do
-    let_it_be(:workflow1) do
-      create(:duo_workflows_workflow,
-        project: project,
-        user: user,
-        goal: 'Fix pipeline issues',
-        workflow_definition: 'issue_to_mr',
-        environment: :web)
-    end
-
-    let_it_be(:workflow2) do
-      create(:duo_workflows_workflow,
-        project: project,
-        user: user,
-        goal: 'Review code changes',
-        workflow_definition: 'code_review',
-        environment: :web)
-    end
-
-    before do
-      visit project_path(project)
-
-      within(ai_sidepanel_selector) do
-        find_by_testid(sessions_toggle_selector).click
-      end
-    end
-
-    it 'displays the sessions list' do
-      expect(page).to have_content("Issue to mr ##{workflow1.id}")
-      expect(page).to have_content("Code review ##{workflow2.id}")
-    end
-
-    it 'navigates to session details when clicked' do
-      expect(page).not_to have_content('Activity')
-      expect(page).not_to have_content('Details')
-
-      expect(page).to have_selector('a[href*="/agent-sessions/"]')
-      session_link = page.first('a[href*="/agent-sessions/"]')
-      session_link.click
-
-      expect(page).to have_content('Activity')
-      expect(page).to have_content('Details')
-
-      expect(page).to have_selector('.gl-tab-nav-item.active', text: 'Activity')
-      expect(page).to have_no_content('GraphQL error:')
-    end
-
-    it 'can view session details tab' do
-      session_link = page.first('a[href*="/agent-sessions/"]')
-      session_link.click
-
-      click_link 'Details'
-
-      expect(page).to have_content('Details')
-      expect(page).to have_content(project.name)
-      expect(page).to have_no_content('GraphQL error:')
-    end
-  end
-
-  describe 'agent sessions empty state in sidepanel' do
-    before do
-      Ai::DuoWorkflows::Workflow.where(project: project).delete_all
-
-      visit project_path(project)
-
-      within(ai_sidepanel_selector) do
-        find_by_testid(sessions_toggle_selector).click
-      end
-    end
-
-    it 'shows empty state when no sessions exist' do
-      expect(page).to have_content('No agent sessions yet', wait: 10)
-    end
-  end
-end
diff --git a/ee/spec/frontend/ai/components/ai_panel_spec.js b/ee/spec/frontend/ai/components/ai_panel_spec.js
index 86f6548072068f398042f3e4e243ffa4045da554..c291889bde00dcd50d12a3da19afd002b4807ff7 100644
--- a/ee/spec/frontend/ai/components/ai_panel_spec.js
+++ b/ee/spec/frontend/ai/components/ai_panel_spec.js
@@ -6,8 +6,11 @@ import AiContentContainer from 'ee/ai/components/content_container.vue';
 import NavigationRail from 'ee/ai/components/navigation_rail.vue';
 import AgentSessionsRoot from '~/vue_shared/spa/components/spa_root.vue';
 import DuoAgenticChat from 'ee/ai/duo_agentic_chat/components/duo_agentic_chat.vue';
+import DuoChat from 'ee/ai/tanuki_bot/components/duo_chat.vue';
 import { AGENTS_PLATFORM_SHOW_ROUTE } from 'ee/ai/duo_agents_platform/router/constants';
+import { CHAT_MODES } from 'ee/ai/tanuki_bot/constants';
 import Cookies from '~/lib/utils/cookies';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
 
 const aiPanelStateCookie = 'ai_panel_active_tab';
 
@@ -41,8 +44,10 @@ describe('AiPanel', () => {
         isAgenticAvailable: true,
         chatTitle: null,
         chatConfiguration: {
-          title: 'GitLab Duo Agentic Chat',
-          component: DuoAgenticChat,
+          agenticTitle: 'GitLab Duo Agentic Chat',
+          classicTitle: 'GitLab Duo Chat',
+          agenticComponent: DuoAgenticChat,
+          classicComponent: DuoChat,
           defaultProps: {
             isAgenticAvailable: true,
             isEmbedded: true,
@@ -72,6 +77,9 @@ describe('AiPanel', () => {
 
   beforeEach(() => {
     Cookies.remove(aiPanelStateCookie);
+    // Reset global state before each test
+    duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+    duoChatGlobalState.activeTab = null;
   });
 
   it('renders initial collapsed state', () => {
@@ -456,4 +464,127 @@ describe('AiPanel', () => {
       });
     });
   });
+
+  describe('chat mode switching', () => {
+    describe('component switching based on chat mode', () => {
+      it('renders agentic chat component when in agentic mode', async () => {
+        duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+        createComponent();
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+
+        expect(findContentContainer().props('activeTab')).toEqual({
+          title: 'GitLab Duo Agentic Chat',
+          component: DuoAgenticChat,
+          props: {
+            mode: 'active',
+            isAgenticAvailable: true,
+            isEmbedded: true,
+            showStudioHeader: true,
+          },
+        });
+      });
+
+      it('renders classic chat component when in classic mode', async () => {
+        duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+        createComponent();
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+
+        expect(findContentContainer().props('activeTab')).toEqual({
+          title: 'GitLab Duo Chat',
+          component: DuoChat,
+          props: {
+            mode: 'active',
+            isAgenticAvailable: true,
+            isEmbedded: true,
+            showStudioHeader: true,
+          },
+        });
+      });
+
+      it('switches component when chat mode changes from agentic to classic', async () => {
+        duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+        createComponent();
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+
+        expect(findContentContainer().props('activeTab').component).toBe(DuoAgenticChat);
+        expect(findContentContainer().props('activeTab').title).toBe('GitLab Duo Agentic Chat');
+
+        duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+        await nextTick();
+
+        expect(findContentContainer().props('activeTab').component).toBe(DuoChat);
+        expect(findContentContainer().props('activeTab').title).toBe('GitLab Duo Chat');
+      });
+
+      it('applies classic mode to all chat tabs (active, new, history)', async () => {
+        duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+        createComponent();
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoChat);
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'new');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoChat);
+        expect(findContentContainer().props('activeTab').title).toBe('New Chat');
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'history');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoChat);
+        expect(findContentContainer().props('activeTab').title).toBe('History');
+      });
+
+      it('applies agentic mode to all chat tabs (active, new, history)', async () => {
+        duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+        createComponent();
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoAgenticChat);
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'new');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoAgenticChat);
+        expect(findContentContainer().props('activeTab').title).toBe('New Chat');
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'history');
+        await nextTick();
+        expect(findContentContainer().props('activeTab').component).toBe(DuoAgenticChat);
+        expect(findContentContainer().props('activeTab').title).toBe('History');
+      });
+    });
+
+    describe('activeTab reactivity with global state', () => {
+      it('opens panel when global state activeTab changes externally', async () => {
+        createComponent();
+        expect(findContentContainer().exists()).toBe(false);
+
+        // Simulate external trigger (e.g., from sendDuoChatCommand)
+        duoChatGlobalState.activeTab = 'chat';
+        await nextTick();
+
+        expect(findContentContainer().exists()).toBe(true);
+        expect(findContentContainer().props('activeTab').component).toBe(DuoAgenticChat);
+      });
+
+      it('clears global state and cookie when panel is closed', async () => {
+        createComponent();
+
+        findNavigationRail().vm.$emit('handleTabToggle', 'chat');
+        await nextTick();
+        expect(duoChatGlobalState.activeTab).toBe('chat');
+
+        findContentContainer().vm.$emit('closePanel');
+        await nextTick();
+
+        expect(duoChatGlobalState.activeTab).toBeUndefined();
+        expect(Cookies.get(aiPanelStateCookie)).toBeUndefined();
+        expect(findContentContainer().exists()).toBe(false);
+      });
+    });
+  });
 });
diff --git a/ee/spec/frontend/ai/components/content_container_spec.js b/ee/spec/frontend/ai/components/content_container_spec.js
index 7b1a605bfabfee7f9c19df4edc47bbb481f39f62..f22f7095d0aaa0c819eaa914b810281ebe32b133 100644
--- a/ee/spec/frontend/ai/components/content_container_spec.js
+++ b/ee/spec/frontend/ai/components/content_container_spec.js
@@ -3,9 +3,14 @@ import { GlButton } from '@gitlab/ui';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import { createMockDirective } from 'helpers/vue_mock_directive';
 import AiContentContainer from 'ee/ai/components/content_container.vue';
+import { CHAT_MODES } from 'ee/ai/tanuki_bot/constants';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
+import DuoAgenticChat from 'ee/ai/duo_agentic_chat/components/duo_agentic_chat.vue';
+import DuoChat from 'ee/ai/tanuki_bot/components/duo_chat.vue';
 
 describe('AiContentContainer', () => {
   let wrapper;
+  let mockStore;
 
   const activeTabMock = {
     title: 'Test Tab Title',
@@ -16,7 +21,12 @@ describe('AiContentContainer', () => {
     activeTab = activeTabMock,
     showBackButton = false,
     propsData = {},
+    provide = {},
   } = {}) => {
+    mockStore = {
+      dispatch: jest.fn(),
+    };
+
     wrapper = shallowMountExtended(AiContentContainer, {
       directives: {
         GlTooltip: createMockDirective('gl-tooltip'),
@@ -33,6 +43,19 @@ describe('AiContentContainer', () => {
         userModelSelectionEnabled: false,
         ...propsData,
       },
+      provide: {
+        chatConfiguration: {
+          agenticTitle: 'GitLab Duo Agentic Chat',
+          classicTitle: 'GitLab Duo Chat',
+          agenticComponent: DuoAgenticChat,
+          classicComponent: DuoChat,
+          defaultProps: {},
+        },
+        ...provide,
+      },
+      mocks: {
+        $store: mockStore,
+      },
       stubs: {
         GlButton,
       },
@@ -45,6 +68,8 @@ describe('AiContentContainer', () => {
   const findBackButton = () => wrapper.findByTestId('content-container-back-button');
 
   beforeEach(() => {
+    // Reset global state before each test
+    duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
     createComponent();
   });
 
@@ -177,4 +202,32 @@ describe('AiContentContainer', () => {
       }).not.toThrow();
     });
   });
+
+  describe('chat component key', () => {
+    const agenticTabMock = {
+      title: 'Agentic Chat',
+      component: DuoAgenticChat,
+      props: { mode: 'active' },
+    };
+
+    it('recreates component when chatMode changes', async () => {
+      duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+      createComponent({ activeTab: agenticTabMock });
+
+      // Get the initial component instance
+      const initialComponent = wrapper.findComponent(DuoAgenticChat);
+      expect(initialComponent.exists()).toBe(true);
+
+      // Switch to classic mode - this should destroy and recreate the component
+      duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+      await nextTick();
+
+      // Get the component instance after mode switch
+      const newComponent = wrapper.findComponent(DuoAgenticChat);
+      expect(newComponent.exists()).toBe(true);
+
+      // Verify the component was recreated (different Vue instance)
+      expect(newComponent.vm).not.toBe(initialComponent.vm);
+    });
+  });
 });
diff --git a/ee/spec/frontend/ai/components/navigation_rail_spec.js b/ee/spec/frontend/ai/components/navigation_rail_spec.js
index e50c4a6cef67c098c2cea16a699f7429f55ef439..82af13bfdb8563320ef5651ef75c945dc06613c2 100644
--- a/ee/spec/frontend/ai/components/navigation_rail_spec.js
+++ b/ee/spec/frontend/ai/components/navigation_rail_spec.js
@@ -4,6 +4,8 @@ import { createMockDirective } from 'helpers/vue_mock_directive';
 import { shouldDisableShortcuts } from '~/behaviors/shortcuts/shortcuts_toggle';
 import { keysFor, DUO_CHAT } from '~/behaviors/shortcuts/keybindings';
 import NavigationRail from 'ee/ai/components/navigation_rail.vue';
+import { CHAT_MODES } from 'ee/ai/tanuki_bot/constants';
+import { duoChatGlobalState } from '~/super_sidebar/constants';
 
 jest.mock('~/behaviors/shortcuts/shortcuts_toggle');
 jest.mock('~/behaviors/shortcuts/keybindings');
@@ -30,10 +32,13 @@ describe('NavigationRail', () => {
   const findChatToggle = () => wrapper.findByTestId('ai-chat-toggle');
   const findSuggestionsToggle = () => wrapper.findByTestId('ai-suggestions-toggle');
   const findSessionsToggle = () => wrapper.findByTestId('ai-sessions-toggle');
+  const findDivider = () => wrapper.find('[name="divider"]');
 
   beforeEach(() => {
     shouldDisableShortcuts.mockReturnValue(false);
     keysFor.mockReturnValue([DUO_CHAT]);
+    // Reset global state before each test
+    duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
 
     createComponent();
   });
@@ -70,4 +75,22 @@ describe('NavigationRail', () => {
 
     expect(findSuggestionsToggle().exists()).toBe(false);
   });
+
+  describe('sessions button visibility', () => {
+    it('shows sessions button when in agentic mode', () => {
+      duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+      createComponent();
+
+      expect(findSessionsToggle().exists()).toBe(true);
+      expect(findDivider().exists()).toBe(true);
+    });
+
+    it('hides sessions button when in classic mode', () => {
+      duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+      createComponent();
+
+      expect(findSessionsToggle().exists()).toBe(false);
+      expect(findDivider().exists()).toBe(false);
+    });
+  });
 });
diff --git a/ee/spec/frontend/ai/duo_agentic_chat/components/duo_agentic_chat_spec.js b/ee/spec/frontend/ai/duo_agentic_chat/components/duo_agentic_chat_spec.js
index 060bdba22b1c3f2032d2cae6f977c17570a25085..8ac27c900b26e45324e3df47ca777cade3a105c3 100644
--- a/ee/spec/frontend/ai/duo_agentic_chat/components/duo_agentic_chat_spec.js
+++ b/ee/spec/frontend/ai/duo_agentic_chat/components/duo_agentic_chat_spec.js
@@ -1192,7 +1192,7 @@ describe('Duo Agentic Chat', () => {
       jest.clearAllMocks();
     });
 
-    it('cleans up socket on component destroy', () => {
+    it('cleans up socket and clears state on component destroy', () => {
       duoChatGlobalState.isAgenticChatShown = true;
       createComponent();
       wrapper.vm.socketManager = mockSocketManager;
@@ -1200,6 +1200,8 @@ describe('Duo Agentic Chat', () => {
       wrapper.destroy();
 
       expect(closeSocket).toHaveBeenCalledWith(mockSocketManager);
+      expect(actionSpies.setMessages).toHaveBeenCalledWith(expect.anything(), []);
+      expect(actionSpies.setLoading).toHaveBeenCalledWith(expect.anything(), false);
     });
 
     it('sets isProcessingToolApproval to false on socket close when not waiting for approval', async () => {
diff --git a/ee/spec/frontend/ai/tanuki_bot/components/app_spec.js b/ee/spec/frontend/ai/tanuki_bot/components/app_spec.js
index 3c833fa3e0bbd9333b3b8d53a32d10a448da1373..0ac5b86aa016142d97a8191ac9aeeeef5556004d 100644
--- a/ee/spec/frontend/ai/tanuki_bot/components/app_spec.js
+++ b/ee/spec/frontend/ai/tanuki_bot/components/app_spec.js
@@ -1332,7 +1332,11 @@ describeSkipVue3(skipReason, () => {
       `('calls setAgenticMode with $description and saveCookie=true', ({ value }) => {
         wrapper.vm.duoAgenticModePreference = value;
 
-        expect(setAgenticMode).toHaveBeenCalledWith({ agenticMode: value, saveCookie: true });
+        expect(setAgenticMode).toHaveBeenCalledWith({
+          agenticMode: value,
+          saveCookie: true,
+          isEmbedded: false,
+        });
       });
     });
   });
@@ -1386,7 +1390,11 @@ describeSkipVue3(skipReason, () => {
       toggle.vm.$emit('change', true);
       await nextTick();
 
-      expect(setAgenticMode).toHaveBeenCalledWith({ agenticMode: true, saveCookie: true });
+      expect(setAgenticMode).toHaveBeenCalledWith({
+        agenticMode: true,
+        saveCookie: true,
+        isEmbedded: false,
+      });
     });
 
     it('updates the toggle value when duoAgenticModePreference changes', async () => {
diff --git a/ee/spec/frontend/ai/utils_spec.js b/ee/spec/frontend/ai/utils_spec.js
index de1eae300170215cbb7f12e65f64a4ec670a4d22..363a2b4399c0e10b7682ffc6e761954d23759bfe 100644
--- a/ee/spec/frontend/ai/utils_spec.js
+++ b/ee/spec/frontend/ai/utils_spec.js
@@ -11,10 +11,12 @@ import { setCookie } from '~/lib/utils/common_utils';
 import {
   DUO_AGENTIC_MODE_COOKIE,
   DUO_AGENTIC_MODE_COOKIE_EXPIRATION,
+  CHAT_MODES,
 } from 'ee/ai/tanuki_bot/constants';
 
 jest.mock('~/lib/utils/common_utils', () => ({
   setCookie: jest.fn(),
+  getCookie: jest.fn(),
 }));
 
 describe('AI Utils', () => {
@@ -251,12 +253,14 @@ describe('AI Utils', () => {
     beforeEach(() => {
       duoChatGlobalState.isShown = false;
       duoChatGlobalState.isAgenticChatShown = false;
+      duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
       jest.clearAllMocks();
     });
 
     afterEach(() => {
       duoChatGlobalState.isShown = false;
       duoChatGlobalState.isAgenticChatShown = false;
+      duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
     });
 
     describe('when agenticMode is true', () => {
@@ -353,5 +357,117 @@ describe('AI Utils', () => {
         },
       );
     });
+
+    describe('chatMode', () => {
+      it('sets chatMode to AGENTIC when agenticMode is true', () => {
+        setAgenticMode({ agenticMode: true });
+
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.AGENTIC);
+      });
+
+      it('sets chatMode to CLASSIC when agenticMode is false', () => {
+        setAgenticMode({ agenticMode: false });
+
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.CLASSIC);
+      });
+    });
+
+    describe('isEmbedded parameter', () => {
+      it('updates isShown and isAgenticChatShown when isEmbedded is false', () => {
+        setAgenticMode({ agenticMode: true, isEmbedded: false });
+
+        expect(duoChatGlobalState.isShown).toBe(false);
+        expect(duoChatGlobalState.isAgenticChatShown).toBe(true);
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.AGENTIC);
+      });
+
+      it('does not update isShown and isAgenticChatShown when isEmbedded is true', () => {
+        duoChatGlobalState.isShown = true;
+        duoChatGlobalState.isAgenticChatShown = false;
+
+        setAgenticMode({ agenticMode: true, isEmbedded: true });
+
+        // Legacy properties should not be touched in embedded mode
+        expect(duoChatGlobalState.isShown).toBe(true);
+        expect(duoChatGlobalState.isAgenticChatShown).toBe(false);
+        // But chatMode should still be updated
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.AGENTIC);
+      });
+
+      it('defaults isEmbedded to false', () => {
+        setAgenticMode({ agenticMode: false });
+
+        expect(duoChatGlobalState.isShown).toBe(true);
+        expect(duoChatGlobalState.isAgenticChatShown).toBe(false);
+      });
+    });
+  });
+
+  describe('sendDuoChatCommand with embedded mode', () => {
+    let originalRequestIdleCallback;
+    let originalGon;
+
+    beforeEach(() => {
+      originalRequestIdleCallback = window.requestIdleCallback;
+      window.requestIdleCallback = (callback) => callback();
+      originalGon = window.gon;
+
+      duoChatGlobalState.isShown = false;
+      duoChatGlobalState.isAgenticChatShown = false;
+      duoChatGlobalState.activeTab = null;
+      duoChatGlobalState.chatMode = CHAT_MODES.AGENTIC;
+      duoChatGlobalState.commands = [];
+
+      jest.clearAllMocks();
+    });
+
+    afterEach(() => {
+      window.requestIdleCallback = originalRequestIdleCallback;
+      window.gon = originalGon;
+      duoChatGlobalState.isShown = false;
+      duoChatGlobalState.activeTab = null;
+      duoChatGlobalState.chatMode = CHAT_MODES.CLASSIC;
+    });
+
+    describe('when projectStudioEnabled is false (drawer mode)', () => {
+      beforeEach(() => {
+        window.gon = { features: { projectStudioEnabled: false } };
+      });
+
+      it('opens drawer mode chat', () => {
+        sendDuoChatCommand({ question: '/help', resourceId: '123' });
+
+        expect(duoChatGlobalState.isShown).toBe(true);
+        expect(duoChatGlobalState.isAgenticChatShown).toBe(false);
+        expect(duoChatGlobalState.activeTab).toBeNull();
+      });
+
+      it('forces classic mode', () => {
+        sendDuoChatCommand({ question: '/help', resourceId: '123' });
+
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.CLASSIC);
+      });
+    });
+
+    describe('when projectStudioEnabled is true (embedded mode)', () => {
+      beforeEach(() => {
+        window.gon = { features: { projectStudioEnabled: true } };
+      });
+
+      it('opens embedded panel to chat tab', () => {
+        sendDuoChatCommand({ question: '/help', resourceId: '123' });
+
+        expect(duoChatGlobalState.activeTab).toBe('chat');
+        // Legacy drawer properties should not be touched
+        expect(duoChatGlobalState.isShown).toBe(false);
+        expect(duoChatGlobalState.isAgenticChatShown).toBe(false);
+      });
+
+      it('forces classic mode', () => {
+        sendDuoChatCommand({ question: '/help', resourceId: '123' });
+
+        expect(duoChatGlobalState.chatMode).toBe(CHAT_MODES.CLASSIC);
+      });
+    });
   });
 });
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index d2c2fe7a02714885d07497a5e273863059c7cdf5..4649e259f8e5038ea24f14d6dba7881ffd0ed3ec 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -13293,9 +13293,6 @@ msgstr ""
 msgid "Characters over limit"
 msgstr ""
 
-msgid "Chat is not available."
-msgstr ""
-
 msgid "ChatMessage|%{project_link}: Pipeline %{pipeline_link} of %{ref_type} %{ref_link} by %{user_combined_name} %{humanized_status} in %{duration}"
 msgstr ""
 
@@ -20453,6 +20450,9 @@ msgstr ""
 msgid "Current Chat"
 msgstr ""
 
+msgid "Current GitLab Duo Chat"
+msgstr ""
+
 msgid "Current Project"
 msgstr ""