diff --git a/tools/server/webui/src/lib/components/app/actions/ActionButton.svelte b/tools/server/webui/src/lib/components/app/actions/ActionButton.svelte
index 411a8b6094..4494ea880b 100644
--- a/tools/server/webui/src/lib/components/app/actions/ActionButton.svelte
+++ b/tools/server/webui/src/lib/components/app/actions/ActionButton.svelte
@@ -37,6 +37,7 @@
 			aria-label={ariaLabel || tooltip}
 		>
 			{@const IconComponent = icon}
+
 			<IconComponent class="h-3 w-3" />
 		</Button>
 	</Tooltip.Trigger>
diff --git a/tools/server/webui/src/lib/components/app/chat/ChatFormResourceAttachments.svelte b/tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentMcpResources.svelte
similarity index 100%
rename from tools/server/webui/src/lib/components/app/chat/ChatFormResourceAttachments.svelte
rename to tools/server/webui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentMcpResources.svelte
diff --git a/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatForm.svelte b/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatForm.svelte
index bf628b25e2..c52a33dfcf 100644
--- a/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatForm.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatForm.svelte
@@ -1,13 +1,13 @@
 <script lang="ts">
 	import {
 		ChatAttachmentsList,
+		ChatAttachmentMcpResources,
 		ChatFormActions,
 		ChatFormFileInputInvisible,
 		ChatFormPromptPicker,
 		ChatFormTextarea,
 		McpResourcePicker
 	} from '$lib/components/app';
-	import ChatFormResourceAttachments from '../ChatFormResourceAttachments.svelte';
 	import { INPUT_CLASSES } from '$lib/constants/css-classes';
 	import { SETTING_CONFIG_DEFAULT } from '$lib/constants/settings-config';
 	import { MimeTypeText, SpecialFileType } from '$lib/enums';
@@ -509,7 +509,7 @@
 			/>
 
 			{#if mcpHasResourceAttachments()}
-				<ChatFormResourceAttachments
+				<ChatAttachmentMcpResources
 					class="mb-3"
 					onResourceClick={(uri) => {
 						preSelectedResourceUri = uri;
diff --git a/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte b/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte
index 458cd2f622..bbbdf39bd7 100644
--- a/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte
@@ -6,7 +6,7 @@
 		ChatFormActionRecord,
 		ChatFormActionSubmit,
 		DialogMcpServersSettings,
-		McpServerSelector,
+		McpServersSelector,
 		ModelsSelector
 	} from '$lib/components/app';
 	import { mcpStore } from '$lib/stores/mcp.svelte';
@@ -191,7 +191,7 @@
 			onMcpServersClick={() => (showMcpDialog = true)}
 		/>
 
-		<McpServerSelector {disabled} onSettingsClick={() => (showMcpDialog = true)} />
+		<McpServersSelector {disabled} onSettingsClick={() => (showMcpDialog = true)} />
 	</div>
 
 	<div class="ml-auto flex items-center gap-1.5">
diff --git a/tools/server/webui/src/lib/components/app/chat/index.ts b/tools/server/webui/src/lib/components/app/chat/index.ts
index 2673f0b6b6..989acd26d8 100644
--- a/tools/server/webui/src/lib/components/app/chat/index.ts
+++ b/tools/server/webui/src/lib/components/app/chat/index.ts
@@ -70,6 +70,12 @@ export { default as ChatAttachmentMcpResource } from './ChatAttachments/ChatAtta
  */
 export { default as ChatAttachmentPreview } from './ChatAttachments/ChatAttachmentPreview.svelte';
 
+/**
+ * Displays MCP Resource attachments as a horizontal carousel.
+ * Shows resource name, URI, and allows clicking to view resource content.
+ */
+export { default as ChatAttachmentMcpResources } from './ChatAttachments/ChatAttachmentMcpResources.svelte';
+
 /**
  * Thumbnail for non-image file attachments. Displays file type icon based on extension,
  * file name (truncated), and file size.
diff --git a/tools/server/webui/src/lib/components/app/mcp/McpServerSelector.svelte b/tools/server/webui/src/lib/components/app/mcp/McpServersSelector.svelte
similarity index 100%
rename from tools/server/webui/src/lib/components/app/mcp/McpServerSelector.svelte
rename to tools/server/webui/src/lib/components/app/mcp/McpServersSelector.svelte
diff --git a/tools/server/webui/src/lib/components/app/mcp/index.ts b/tools/server/webui/src/lib/components/app/mcp/index.ts
index ea353ca5c0..45b1cbd346 100644
--- a/tools/server/webui/src/lib/components/app/mcp/index.ts
+++ b/tools/server/webui/src/lib/components/app/mcp/index.ts
@@ -70,7 +70,7 @@ export { default as McpServersSettings } from './McpServersSettings.svelte';
 export { default as McpActiveServersAvatars } from './McpActiveServersAvatars.svelte';
 
 /**
- * **McpServerSelector** - Quick MCP server toggle dropdown
+ * **McpServersSelector** - Quick MCP server toggle dropdown
  *
  * Compact dropdown for quickly enabling/disabling MCP servers for the current chat.
  * Uses McpActiveServersAvatars as trigger and shows searchable server list with switches.
@@ -89,12 +89,12 @@ export { default as McpActiveServersAvatars } from './McpActiveServersAvatars.sv
  *
  * @example
  * ```svelte
- * <McpServerSelector
+ * <McpServersSelector
  *   onSettingsClick={() => showMcpSettings = true}
  * />
  * ```
  */
-export { default as McpServerSelector } from './McpServerSelector.svelte';
+export { default as McpServersSelector } from './McpServersSelector.svelte';
 
 /**
  * **McpCapabilitiesBadges** - Server capabilities display