From c53ce35312d481d06e61b5834c9fd09f953fc270 Mon Sep 17 00:00:00 2001
From: claude_code <claude_code@vvzvlad.xyz>
Date: Mon, 22 Jun 2026 20:34:39 +0300
Subject: [PATCH] feat(ui): swap AI-chat and comments icons to avoid confusion

The AI chat button used IconSparkles and the page comments button used
IconMessage, which read as visually similar speech bubbles. Replace the
AI icon with IconMessageCircleStar (chat bubble + star) and the comments
icon with IconMessages (overlapping bubbles) so the two are clearly
distinct.

- app-header.tsx: IconSparkles -> IconMessageCircleStar
- page-header-menu.tsx: IconMessage -> IconMessages
---
 apps/client/src/components/layouts/global/app-header.tsx      | 4 ++--
 .../src/features/page/components/header/page-header-menu.tsx  | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/client/src/components/layouts/global/app-header.tsx b/apps/client/src/components/layouts/global/app-header.tsx
index 8eb7c303..d066ea6b 100644
--- a/apps/client/src/components/layouts/global/app-header.tsx
+++ b/apps/client/src/components/layouts/global/app-header.tsx
@@ -5,7 +5,7 @@ import {
   Text,
   Tooltip,
 } from "@mantine/core";
-import { IconSparkles } from "@tabler/icons-react";
+import { IconMessageCircleStar } from "@tabler/icons-react";
 import classes from "./app-header.module.css";
 import { BrandLogo } from "@/components/ui/brand-logo";
 import TopMenu from "@/components/layouts/global/top-menu.tsx";
@@ -107,7 +107,7 @@ export function AppHeader() {
                 aria-label={t("AI chat")}
                 onClick={() => setAiChatWindowOpen((v) => !v)}
               >
-                <IconSparkles size={20} />
+                <IconMessageCircleStar size={20} />
               </ActionIcon>
             </Tooltip>
           )}
diff --git a/apps/client/src/features/page/components/header/page-header-menu.tsx b/apps/client/src/features/page/components/header/page-header-menu.tsx
index ab7827d6..8653d0bd 100644
--- a/apps/client/src/features/page/components/header/page-header-menu.tsx
+++ b/apps/client/src/features/page/components/header/page-header-menu.tsx
@@ -10,7 +10,7 @@ import {
   IconLink,
   IconList,
   IconMarkdown,
-  IconMessage,
+  IconMessages,
   IconPrinter,
   IconStar,
   IconStarFilled,
@@ -111,7 +111,7 @@ export default function PageHeaderMenu({ readOnly }: PageHeaderMenuProps) {
           aria-label={t("Comments")}
           {...commentsTriggerProps}
         >
-          <IconMessage size={20} stroke={2} />
+          <IconMessages size={20} stroke={2} />
         </ActionIcon>
       </Tooltip>