From ca23cd285f50a0935930c73da3477aa1de12be94 Mon Sep 17 00:00:00 2001
From: Andrey <drmariarty00@gmail.com>
Date: Thu, 17 Sep 2026 11:38:40 +0300
Subject: [PATCH] =?UTF-8?q?:bug:=20fix(vk):=20=D0=BC=D0=B0=D1=80=D0=BA?=
 =?UTF-8?q?=D0=B0=20=D0=92=D0=9A=D0=BE=D0=BD=D1=82=D0=B0=D0=BA=D1=82=D0=B5?=
 =?UTF-8?q?=20=D0=B2=D0=BC=D0=B5=D1=81=D1=82=D0=BE=20=D1=87=D1=83=D0=B6?=
 =?UTF-8?q?=D0=BE=D0=B3=D0=BE=20=D0=B7=D0=BD=D0=B0=D1=87=D0=BA=D0=B0=20?=
 =?UTF-8?q?=D0=B2=20=D0=BB=D0=B5=D0=BD=D1=82=D0=B5=20=D0=B8=20=D0=BA=D0=B0?=
 =?UTF-8?q?=D1=80=D1=82=D0=BE=D1=87=D0=BA=D0=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Канал ВКонтакте появился, а марки у него не было: в ленте диалогов и в
карточке контакта рисовался общий пузырь сообщения, а в строке логина —
значок отправки, который для Telegram выглядел уместно только по
совпадению. Клиент из ВКонтакте выглядел пришедшим непонятно откуда.

Теперь `ChannelGlyph` знает ВКонтакте и отдаёт тот же официальный
монохромный глиф, что стоит на плитке подключения, а строка логина берёт
марку своего канала вместо общего значка: Telegram, MAX и ВКонтакте —
каждый свой.

Проверено: глифы на 13-18px в тёмной теме рядом с Telegram и MAX, лента
диалогов, строка логина и плитки каналов в карточке контакта; tsc.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 .../features/sales/dialogs/context/ClientContext.tsx  | 11 +++++++----
 apps/internal-ui/src/shared/badges.tsx                |  7 ++++---
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/apps/internal-ui/src/features/sales/dialogs/context/ClientContext.tsx b/apps/internal-ui/src/features/sales/dialogs/context/ClientContext.tsx
index 9f670a7..ad9f08e 100644
--- a/apps/internal-ui/src/features/sales/dialogs/context/ClientContext.tsx
+++ b/apps/internal-ui/src/features/sales/dialogs/context/ClientContext.tsx
@@ -1,5 +1,6 @@
-import { useEffect, useState } from "react";
+import { useEffect, useState, type ReactNode } from "react";
 
+import { ChannelGlyph } from "../../../../shared/badges";
 import { Icon } from "../../../../shared/icons";
 import { CopyButton } from "../../../../shared/ui-controls";
 import { providerMeta } from "../../../../shared/providers";
@@ -73,10 +74,12 @@ export function ClientContext({
     }
   }
 
-  const fields: Array<{ key: string; icon: Parameters<typeof Icon>[0]["name"]; text: string; copy?: string; muted?: boolean }> = [];
+  // Логин показывается маркой своего канала: общий значок отправки годился,
+  // пока каналов с логином было два, и врал уже на третьем.
+  const fields: Array<{ key: string; icon: Parameters<typeof Icon>[0]["name"]; glyph?: ReactNode; text: string; copy?: string; muted?: boolean }> = [];
   if (phone) fields.push({ key: "phone", icon: "phone", text: phone, copy: phone });
   if (dialog.channel === "EMAIL" && email) fields.push({ key: "email", icon: "mail", text: email, copy: email });
-  if (username) fields.push({ key: "username", icon: "send", text: `@${username} · ${channel.label}`, copy: `@${username}` });
+  if (username) fields.push({ key: "username", icon: "send", glyph: <ChannelGlyph provider={dialog.channel} size={15} />, text: `@${username} · ${channel.label}`, copy: `@${username}` });
   if (isGuest) fields.push({ key: "guest", icon: "message", text: t("sales.anonymous_session", { channel: channel.label, connection: detail?.connection?.name ?? t("sales.widget") }), muted: true });
   if (fields.length === 0 && detail?.connection) fields.push({ key: "connection", icon: "plug", text: `${channel.label} · ${detail.connection.name}`, muted: true });
   // Компания и город — из карточки контакта (решение 5), без «копировать».
@@ -109,7 +112,7 @@ export function ClientContext({
         <div className="ctx-contact-fields">
           {fields.map((field) => (
             <div className={`ctx-contact-field ${field.muted ? "is-muted" : ""}`} key={field.key}>
-              <span><Icon name={field.icon} size={15} /></span>
+              <span>{field.glyph ?? <Icon name={field.icon} size={15} />}</span>
               <span>{field.text}</span>
               {field.copy && <CopyButton value={field.copy} />}
             </div>
diff --git a/apps/internal-ui/src/shared/badges.tsx b/apps/internal-ui/src/shared/badges.tsx
index c028785..07c4009 100644
--- a/apps/internal-ui/src/shared/badges.tsx
+++ b/apps/internal-ui/src/shared/badges.tsx
@@ -1,12 +1,13 @@
-import { Icon, MaxLogo, TelegramLogo } from "./icons";
+import { Icon, MaxLogo, TelegramLogo, VkLogo } from "./icons";
 import { providerKey } from "./providers";
 
-/** Иконка канала без подложки (дизайн-базлайн v2, решение 4): Telegram/MAX —
- * фирменные глифы, Email/Web — линейные. */
+/** Иконка канала без подложки (дизайн-базлайн v2, решение 4): Telegram, MAX и
+ * ВКонтакте — фирменные глифы, Email/Web — линейные. */
 export function ChannelGlyph({ provider, size = 13 }: { provider: string; size?: number }) {
   const key = providerKey(provider);
   if (key === "TG") return <TelegramLogo size={size} />;
   if (key === "MAX") return <MaxLogo size={size} />;
+  if (key === "VK") return <VkLogo size={size} />;
   if (key === "EMAIL") return <Icon name="mail" size={size} />;
   return <Icon name="message" size={size} />;
 }