@xmanrui/dsh-im 4.19.0 → 4.19.2

package/README.en.md

@@ -224,7 +224,7 @@ DingTalk menus use a shared template built into the plugin; no template setup is
 
 - Registers one top-level **IM Bot** settings page containing the built-in IM channels and one AI Office Connector.
 - Maintains the Host, client, and runtime sources for the built-in channels and the Office Connector in this repository without external standalone plugins.
-- Follows the DeepSeek Harness language preference and switches the settings UI live between Chinese and English. Bot chat messages follow the Host's `language` config (Chinese by default; `en` switches them to English), with Chinese always as the fallback so untranslated text is sent verbatim.
+- Follows the DeepSeek Harness language preference and switches the settings UI live between Chinese and English. Bot chat messages, command help, and the Telegram command menu follow the same interface language and switch live, with Chinese always as the fallback so untranslated text is sent verbatim.
 - Uses logos for WeChat, Feishu, DingTalk, WeCom, QQ, Slack, Telegram, Discord, WhatsApp, iMessage, and AI Office navigation without enable/disable switches.
 - Keeps RPC endpoints, credentials, connection supervision, and session mappings isolated by IM channel; the Office Connector separately owns Device credentials, Job leases, approval waits, and concurrency limits.
 - Returns only QR codes, the public Slack Manifest, redacted status data, and access modes or allowlist identifiers explicitly saved for the current Telegram or WhatsApp bot. Manually entered secrets and Tokens travel one way to the local Host; no RPC response returns App Secrets, `bot_token`, DingTalk `client_secret`, WeCom Secrets, QQ `app_secret`, Slack Bot/App Tokens, Telegram/Discord Bot Tokens, WhatsApp linked-device keys, AI Office Device Tokens, or other raw user identifiers observed from platform messages.
@@ -257,7 +257,23 @@ After building the plugin, run `node scripts/verify-lan-management.mjs /path/to/
 
 ### Bot chat message language
 
-Bot chat messages are in Chinese by default. To switch them to English, set `language: en` in the plugin config (also accepts `en-US` or `english`), or set the `DSH_IM_LANGUAGE=en` environment variable:
+**Nothing to configure.** Bot chat messages, command help, and the Telegram command menu follow the DeepSeek Harness interface language. Set DSH to English in **Settings → General → Language** and the bot answers in English — the change applies live, with no Host restart and no bot reconnect.
+
+The language is resolved from the first of these that names one:
+
+1. The plugin's own `language` option (or the `DSH_IM_LANGUAGE` environment variable). This is the operator override described below; when it is set, DSH's interface language is ignored.
+2. The explicit selection in DSH's **Language** row, read from the Host user-settings document. This is what "DSH is set to English" means, and it applies to every channel.
+3. The interface language the settings page is actually rendered in. DSH stores no preference when the language came from the browser's language list, so dsh-im mirrors the effective language to the Host and keeps it in `~/.dsh/integrations/dsh-im/interface-language.json`. That way bots keep answering in your language after a Host restart, before any browser has connected.
+
+Chinese is always the fallback language — any text missing from the English dictionary is sent verbatim in Chinese, so this never changes the behavior of existing Chinese users.
+
+Bot messages switch from the next message onward. The Telegram command menu is re-sent to Telegram right away, but **Telegram clients cache the `/` menu**, so your own app can keep showing the previous language for a while even though Telegram already holds the new one. Reopening the app refreshes it, and `getMyCommands` always shows what was actually stored.
+
+One Telegram label is outside a bot's control and does not follow this setting: the blue **Menu** button beside the input box. dsh-im sets it to `MenuButtonCommands`, which the Bot API defines with no text field, so Telegram renders that label in the *reader's own app language*. Only `MenuButtonWebApp` carries text, and it requires a Web App URL.
+
+Run `node scripts/verify-interface-language.mjs /path/to/deepseek-harness` to verify this end to end against an unmodified DSH CLI: it uses an isolated temporary home, asserts each resolution layer over the real `/api` carrier, and checks that a restart and an operator-pinned `language` both behave. Set `DSH_IM_TELEGRAM_TOKEN` to additionally bind a real bot and assert the command menu Telegram itself stores, which is restored when the check finishes.
+
+To pin one language regardless of who is reading the interface, set `language` in the plugin config (also accepts `en-US` or `english`), or set the `DSH_IM_LANGUAGE=en` environment variable:
 
 ```yaml
 - id: xmanrui-dsh-im
@@ -265,8 +281,6 @@ Bot chat messages are in Chinese by default. To switch them to English, set `lan
     language: en
 ```
 
-Without a setting, Chinese is used. Chinese is always the fallback language — any text missing from the English dictionary is sent verbatim in Chinese, so this feature never changes the behavior of existing Chinese users.
-
 ---
 
 ## Contact

package/README.md

@@ -227,7 +227,7 @@ Logo 由 dsh-im 的浏览器适配显示，无需修改 DSH。适配保留原始
 
 - Harness 一级设置菜单中只注册一个「IM机器人」设置页，其中包含内置 IM 渠道和一个 AI Office Connector；
 - 内置渠道及 Office Connector 的 Host、客户端与运行时源码都在本仓库维护，不依赖外部独立插件；
-- 设置页跟随 DeepSeek Harness 的语言选择，在中文和 English 之间即时切换；机器人发出的聊天消息跟随 Host 的 `language` 配置（默认中文；设为 `en` 即为英文），中文始终为兜底，未收录的文案原样输出；
+- 设置页跟随 DeepSeek Harness 的语言选择，在中文和 English 之间即时切换；机器人发出的聊天消息、命令帮助和 Telegram 命令菜单同样跟随该界面语言并即时切换，中文始终为兜底，未收录的文案原样输出；
 - 左侧使用 Logo 切换微信、飞书、钉钉、企业微信、企业微信应用、QQ、Slack、Telegram、Discord、WhatsApp、iMessage 和 AI Office，不使用启用/停用开关；
 - 各 IM 渠道保持独立的 RPC、凭据、连接监督和会话映射；Office Connector 另行维护设备凭据、Job 租约、审批等待与并发上限；
 - 浏览器只获得二维码、Manifest、脱敏状态，以及用户为当前 Telegram 或 WhatsApp 机器人主动保存的访问模式和白名单标识；手动输入的 Secret 或 Token 仅单向提交给本机 Host，任何 RPC 响应都不会返回 App Secret、`bot_token`、钉钉 `client_secret`、企业微信 Secret、QQ `app_secret`、Slack Bot/App Token、Telegram/Discord Bot Token、WhatsApp 关联设备密钥、AI Office Device Token，或从平台消息中观察到的其他原始用户标识。
@@ -260,7 +260,23 @@ IM 管理接口默认沿用 Harness 的浏览器认证和 Host／Origin 信任
 
 ### 聊天消息语言
 
-机器人发出的聊天消息默认使用中文。要切换为英文，在插件配置中设置 `language: en`（也接受 `en-US`、`english`），或设置环境变量 `DSH_IM_LANGUAGE=en`：
+**无需配置。** 机器人发出的聊天消息、命令帮助和 Telegram 命令菜单跟随 DeepSeek Harness 的界面语言。在 **设置 → 通用 → 语言** 中把 DSH 切换为 English，机器人即以英文回复；切换即时生效，无需重启 Host，也无需重连机器人。
+
+语言按以下顺序取第一个有效值：
+
+1. 插件自身的 `language` 配置（或环境变量 `DSH_IM_LANGUAGE`）。这是下文的运维级固定值；一旦设置，就不再跟随 DSH 的界面语言。
+2. DSH「语言」设置项中的显式选择，从 Host 用户设置文档读取。这就是「DSH 设为 English」的含义，对所有渠道生效。
+3. 设置页实际渲染所用的界面语言。当界面语言来自浏览器语言列表时 DSH 不会存储任何偏好，因此 dsh-im 会把生效语言回传 Host 并保存在 `~/.dsh/integrations/dsh-im/interface-language.json`，这样 Host 重启后、尚无浏览器连接时机器人仍以该语言回复。
+
+中文始终是兜底语言，任何未收录到英文词典的文案都会原样以中文输出，因此该功能不会改变现有中文用户的行为。
+
+聊天消息从下一条起即切换语言。Telegram 命令菜单会立即重新下发，但 **Telegram 客户端会缓存 `/` 菜单**，因此即使 Telegram 侧已保存新语言，你自己的客户端仍可能在一段时间内显示切换前的语言；重开客户端即可刷新，`getMyCommands` 始终反映实际存储的内容。
+
+输入框旁的蓝色 **Menu 按钮**不受机器人控制，也不会跟随该设置：dsh-im 将其设为 `MenuButtonCommands`，而 Bot API 中该类型没有文本字段，因此按钮文案由 Telegram 按**阅读者客户端自身的语言**渲染。只有 `MenuButtonWebApp` 带有文本字段，但它需要一个 Web App URL。
+
+端到端验证可运行 `node scripts/verify-interface-language.mjs /path/to/deepseek-harness`：脚本使用原版 DSH CLI 与独立临时 home，通过真实 `/api` 通道逐层校验语言解析顺序，并验证重启后与运维固定 `language` 时的行为。设置 `DSH_IM_TELEGRAM_TOKEN` 可额外接入真实机器人，断言 Telegram 侧实际存储的命令菜单，检查结束后会恢复其原有菜单。
+
+如需固定一种语言、不随阅读者的界面语言变化，可在插件配置中设置 `language`（也接受 `en-US`、`english`），或设置环境变量 `DSH_IM_LANGUAGE=en`：
 
 ```yaml
 - id: xmanrui-dsh-im
@@ -268,8 +284,6 @@ IM 管理接口默认沿用 Harness 的浏览器认证和 Host／Origin 信任
     language: en
 ```
 
-未设置时保持中文；中文始终是兜底语言，任何未收录到英文词典的文案都会原样以中文输出，因此该功能不会改变现有中文用户的行为。
-
 ---
 
 ## 联系方式

package/lib/client.js

@@ -582,7 +582,7 @@ var React30 = __toESM(require("react"), 1);
 // package.json
 var package_default = {
   name: "@xmanrui/dsh-im",
-  version: "4.19.0",
+  version: "4.19.2",
   description: "\u628A\u5341\u4E00\u79CD IM \u6E20\u9053\u548C\u516C\u7F51 AI Office \u63A5\u5165\u672C\u673A DeepSeek Harness\u3002 Connect eleven IM channels and a public AI Office to a local DeepSeek Harness.",
   keywords: [
     "deepseek-harness",
@@ -634,6 +634,10 @@ var package_default = {
     {
       name: "geekyfoxlab",
       url: "https://github.com/geekyfoxlab"
+    },
+    {
+      name: "grloper",
+      url: "https://github.com/grloper"
     }
   ],
   license: "MIT",
@@ -3105,12 +3109,109 @@ function AliasDialog({ bot, onSave, onClose }) {
   );
   return globalThis.document?.body ? (0, import_react_dom.createPortal)(content, document.body) : content;
 }
+function BotNameTooltip({ anchorRef, id: id6, name: name2, onDismiss }) {
+  const tooltipRef = React5.useRef(null);
+  const [position, setPosition] = React5.useState(null);
+  React5.useLayoutEffect(() => {
+    const anchor = anchorRef.current;
+    const tooltip = tooltipRef.current;
+    if (!anchor || !tooltip) return void 0;
+    const document2 = anchor.ownerDocument;
+    const view = document2.defaultView;
+    const place = () => {
+      const rect = anchor.getBoundingClientRect();
+      const { width, height } = tooltip.getBoundingClientRect();
+      const viewport = document2.documentElement;
+      const margin = 8;
+      const below = rect.bottom + 6;
+      setPosition({
+        left: Math.max(margin, Math.min(rect.left, viewport.clientWidth - width - margin)),
+        top: Math.max(margin, Math.min(
+          below + height <= viewport.clientHeight - margin ? below : rect.top - height - 6,
+          viewport.clientHeight - height - margin
+        ))
+      });
+    };
+    const dismiss = (event) => {
+      if (event.key === "Escape") {
+        event.stopPropagation();
+        onDismiss();
+      }
+    };
+    place();
+    view.addEventListener("resize", place);
+    document2.addEventListener("scroll", onDismiss, true);
+    document2.addEventListener("keydown", dismiss, true);
+    return () => {
+      view.removeEventListener("resize", place);
+      document2.removeEventListener("scroll", onDismiss, true);
+      document2.removeEventListener("keydown", dismiss, true);
+    };
+  }, [anchorRef, name2, onDismiss]);
+  const body = anchorRef.current?.ownerDocument.body;
+  return body ? (0, import_react_dom.createPortal)(h2("span", {
+    ref: tooltipRef,
+    id: id6,
+    role: "tooltip",
+    className: "dim-botNameTooltip",
+    style: position ?? { visibility: "hidden" }
+  }, name2), body) : null;
+}
 function BotName({ bot, id: id6, disabled = false, onSave }) {
   const [open, setOpen] = React5.useState(false);
+  const nameRef = React5.useRef(null);
+  const tooltipId = React5.useId();
+  const [truncated, setTruncated] = React5.useState(false);
+  const [hovered, setHovered] = React5.useState(false);
+  const [focused, setFocused] = React5.useState(false);
+  const [dismissed, setDismissed] = React5.useState(false);
+  const dismissTooltip = React5.useCallback(() => setDismissed(true), []);
+  const measure = React5.useCallback(() => {
+    const node = nameRef.current;
+    setTruncated(Boolean(node && node.scrollWidth > node.clientWidth));
+  }, []);
+  React5.useEffect(() => {
+    const node = nameRef.current;
+    if (!node) return void 0;
+    measure();
+    const view = node.ownerDocument.defaultView;
+    const observer = view.ResizeObserver ? new view.ResizeObserver(measure) : null;
+    observer?.observe(node);
+    view.addEventListener("resize", measure);
+    return () => {
+      observer?.disconnect();
+      view.removeEventListener("resize", measure);
+    };
+  }, [bot.name, measure]);
+  const showTooltip = truncated && !dismissed && !open && (hovered || focused);
   return h2(
     "div",
     { className: "dim-aliasName" },
-    h2("h3", { id: id6, title: bot.name }, bot.name),
+    h2("h3", {
+      id: id6,
+      ref: nameRef,
+      tabIndex: truncated ? 0 : void 0,
+      "aria-describedby": showTooltip ? tooltipId : void 0,
+      onMouseEnter: () => {
+        measure();
+        setHovered(true);
+        setDismissed(false);
+      },
+      onMouseLeave: () => setHovered(false),
+      onFocus: () => {
+        measure();
+        setFocused(true);
+        setDismissed(false);
+      },
+      onBlur: () => setFocused(false),
+      onClick: dismissTooltip
+    }, bot.name),
+    showTooltip ? h2(BotNameTooltip, {
+      anchorRef: nameRef,
+      id: tooltipId,
+      name: bot.name,
+      onDismiss: dismissTooltip
+    }) : null,
     h2(
       "span",
       {
@@ -13841,6 +13942,68 @@ var channel4 = createTokenChannelSettings({
 var IMessageSettingsTab = channel4.SettingsTab;
 var IMessageAccountCard = channel4.AccountCard;
 
+// src/channels/shared/interface-language.mjs
+var LANGUAGE_TAG = /^[A-Za-z]{2,8}(?:-[A-Za-z0-9]{1,8})*$/u;
+var HOST_LANGUAGE_SOURCES = Object.freeze(["config", "settings", "mirror"]);
+function normalizeInterfaceLanguageTag(value) {
+  if (typeof value !== "string") return null;
+  const trimmed = value.trim();
+  return LANGUAGE_TAG.test(trimmed) ? trimmed : null;
+}
+
+// plugin-src/client/interface-language.js
+var HOST_LANGUAGE_RPC_CHANNEL = "/dsh-im-language";
+var HOST_LANGUAGE_ENDPOINTS = Object.freeze({
+  get: "settings.language.get",
+  mirror: "settings.language.mirror"
+});
+var RETRY_DELAYS_MS = Object.freeze([1e3, 4e3, 15e3]);
+function installInterfaceLanguageMirror(ctx, {
+  rpcCall,
+  setTimeoutFn = (callback, delayMs) => globalThis.setTimeout(callback, delayMs),
+  clearTimeoutFn = (timer) => globalThis.clearTimeout(timer),
+  retryDelaysMs = RETRY_DELAYS_MS
+} = {}) {
+  if (typeof rpcCall !== "function" || typeof ctx?.locale?.getLocale !== "function") {
+    return () => {
+    };
+  }
+  const delays = retryDelaysMs.length > 0 ? retryDelaysMs : RETRY_DELAYS_MS;
+  const scheduler = createPollScheduler({ setTimeoutFn, clearTimeoutFn });
+  let mirrored = null;
+  let attempt = 0;
+  const retry = (active) => {
+    if (mirrored === active) mirrored = null;
+    scheduler.schedule(report, delays[Math.min(attempt, delays.length - 1)]);
+    attempt += 1;
+  };
+  const report = () => {
+    if (scheduler.disposed) return;
+    const active = normalizeInterfaceLanguageTag(ctx.locale.getLocale()?.active);
+    if (active === null || active === mirrored) return;
+    mirrored = active;
+    Promise.resolve(rpcCall(HOST_LANGUAGE_ENDPOINTS.mirror, { locale: active })).then(
+      (result) => {
+        if (result?.ok === true) {
+          attempt = 0;
+          return;
+        }
+        retry(active);
+      },
+      () => retry(active)
+    );
+  };
+  report();
+  const off = typeof ctx.on === "function" ? ctx.on("locale/change", () => {
+    attempt = 0;
+    report();
+  }) : null;
+  return () => {
+    scheduler.dispose();
+    if (typeof off === "function") off();
+  };
+}
+
 // plugin-src/client/delivery-settings.js
 var React27 = __toESM(require("react"), 1);
 
@@ -16178,9 +16341,15 @@ var IM_STYLE_ID = "xmanrui-dsh-im-settings";
 var CSS13 = String.raw`
 .dim-aliasName { display: flex; align-items: center; gap: 4px; min-width: 0; }
 .dim-aliasName h3 { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dim-aliasName h3:focus-visible { outline: 2px solid var(--dsw-alias-state-business-primary, #3370ff); outline-offset: 2px; border-radius: 3px; }
+.dim-botNameTooltip { position: fixed; z-index: 1000; box-sizing: border-box; width: max-content; max-width: min(320px, calc(100vw - 16px)); padding: 6px 9px; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 7px; color: var(--dsw-alias-label-primary, #1f2329); background: var(--dsw-alias-bg-layer-3, #fff); box-shadow: 0 8px 24px rgb(31 35 41 / 14%); font: 500 12px/18px -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; white-space: normal; overflow-wrap: anywhere; pointer-events: none; animation: dim-botNameTooltip-in .15s ease; }
+@keyframes dim-botNameTooltip-in { from { opacity: 0; } to { opacity: 1; } }
+@media (prefers-reduced-motion: reduce) { .dim-botNameTooltip { animation: none; } }
 .dim-aliasEntry { display: inline-flex; flex: none; }
-.dim-aliasEdit { display: grid; place-items: center; width: 28px; height: 28px; padding: 4px; border: 0; border-radius: 5px; color: var(--dsw-alias-label-secondary, #646a73); background: transparent; cursor: pointer; }
-.dim-aliasEdit:hover:not(:disabled) { color: var(--dsw-alias-state-business-primary, #3370ff); background: var(--dsw-alias-interactive-bg-hover, #f7f8fa); }
+.dim-aliasEdit { display: grid; place-items: center; width: 28px; height: 28px; padding: 4px; border: 0; border-radius: 5px; color: var(--dsw-alias-label-tertiary, #8f959e); background: transparent; cursor: pointer; }
+.dim-aliasEdit svg { opacity: .55; transition: opacity .15s ease; }
+.dim-aliasName:hover .dim-aliasEdit:not(:disabled) svg, .dim-aliasEdit:focus-visible svg { opacity: 1; }
+.dim-aliasEdit:hover:not(:disabled), .dim-aliasEdit:focus-visible { color: var(--dsw-alias-state-business-primary, #3370ff); background: var(--dsw-alias-interactive-bg-hover, #f7f8fa); }
 .dim-aliasDialog { box-sizing: border-box; width: min(380px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 22px; border: 1px solid var(--dsw-alias-border-l2, #dfe1e5); border-radius: 12px; color: var(--dsw-alias-label-primary, #1f2329); background: var(--dsw-alias-bg-layer-3, #fff); box-shadow: 0 12px 36px rgb(0 0 0 / 18%); font: 13px/1.5 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
 .dim-aliasDialog * { box-sizing: border-box; }
 .dim-aliasDialog::backdrop { background: rgb(15 17 21 / 30%); }
@@ -16576,9 +16745,9 @@ var CSS13 = String.raw`
 /* Header tooltips may extend beyond the card; the collapsible body clips its own content. */
 .dim-panel .dim-botCard { position: relative; min-width: 0; width: 100%; max-width: 100%; overflow: visible; border: 1px solid var(--dsw-alias-border-l2, #e5e6eb); border-radius: 14px; background: var(--dsw-alias-bg-layer-1, #fff); box-shadow: 0 1px 2px rgb(31 35 41 / 3%); }
 .dim-panel .dim-botCard::before { display: none; }
-.dim-panel .dim-botCardBody { position: relative; min-width: 0; width: 100%; max-width: 100%; padding: 12px; }
+.dim-panel .dim-botCardBody { position: relative; min-width: 0; width: 100%; max-width: 100%; padding: 12px 8px; }
 .dim-collapsibleAccount { min-width: 0; display: flex; flex-direction: column; }
-.dim-collapsibleHead { min-width: 0; display: flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; -webkit-user-select: none; }
+.dim-collapsibleHead { min-width: 0; display: flex; align-items: center; gap: 4px; cursor: pointer; user-select: none; -webkit-user-select: none; }
 .dim-collapsibleHead:focus-visible { outline: 2px solid var(--dsw-alias-state-business-primary, #3370ff); outline-offset: 2px; border-radius: 8px; }
 .dim-collapsibleHeaderContent { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; }
 .dim-collapsibleChevron { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 9px; height: 9px; border-right: 1.6px solid var(--dsw-alias-label-tertiary, #8f959e); border-bottom: 1.6px solid var(--dsw-alias-label-tertiary, #8f959e); transform: rotate(-45deg); transition: transform .22s cubic-bezier(.4, 0, .2, 1); transform-origin: 50% 50%; }
@@ -16588,14 +16757,17 @@ var CSS13 = String.raw`
 .dim-collapsibleAccount.is-open > .dim-collapsibleBody { grid-template-rows: 1fr; }
 .dim-collapsibleBodyInner { min-height: 0; overflow: hidden; }
 .dim-collapsibleAccount:not(.is-open) .dim-collapsibleBodyInner { visibility: hidden; }
-.dim-panel .dim-botCardTop { min-width: 0; max-width: 100%; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
-.dim-panel .dim-botIdentity { min-width: 0; flex: 1 1 0; display: flex; align-items: center; gap: 10px; }
+/* Reclaim horizontal spacing for names while keeping status on the same row,
+   including when a channel's mobile stylesheet requests a column layout. */
+.dim-panel .dim-botCardTop { min-width: 0; width: 100%; max-width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; gap: 6px; }
+.dim-panel .dim-botIdentity { min-width: 0; flex: 1 1 0; display: flex; align-items: center; gap: 6px; }
 .dim-panel .dim-botAvatar { flex: none; width: 38px; height: 38px; display: grid; place-items: center; overflow: hidden; border-radius: 11px; box-shadow: none; }
 .dim-panel .dim-botAvatar svg { width: 27px; height: 27px; }
-.dim-panel .dim-botName { min-width: 0; }
+.dim-panel .dim-botName { min-width: 0; flex: 1; }
+.dim-panel .dim-aliasName { gap: 2px; }
 .dim-panel .dim-botName h3 { overflow: hidden; margin: 0; color: var(--dsw-alias-label-primary, #1f2329); font-size: 15px; font-weight: 650; line-height: normal; text-overflow: ellipsis; white-space: nowrap; }
 .dim-panel .dim-botName p { overflow: hidden; margin: 4px 0 0; color: var(--dsw-alias-label-secondary, #646a73); font: 12px ui-monospace, SFMono-Regular, monospace; line-height: normal; text-overflow: ellipsis; white-space: nowrap; }
-.dim-panel .dim-botCardTools { flex: none; display: flex; align-items: flex-start; gap: 8px; }
+.dim-panel .dim-botCardTools { flex: none; display: flex; align-items: flex-start; gap: 4px; }
 .dim-panel .dim-botHealthGroup { min-width: 0; max-width: 100%; flex: none; display: grid; justify-items: end; gap: 5px; }
 .dim-panel .dim-botCard .dim-botHealth { flex: none; min-height: 0; display: inline-flex; align-items: center; gap: 7px; padding: 0; border: 0; border-radius: 0; color: var(--dsw-alias-label-secondary, #646a73); background: transparent; font: inherit; font-size: 12px; font-weight: 400; line-height: normal; white-space: nowrap; }
 .dim-panel .dim-lastChecked { display: inline-flex; align-items: baseline; gap: 4px; color: var(--dsw-alias-label-tertiary, #8f959e); font: inherit; font-size: 11px; font-weight: 400; line-height: normal; white-space: nowrap; }
@@ -17978,6 +18150,12 @@ function apply(ctx) {
   );
   const t = ctx.locale.bind(IM_LOCALE_NAMESPACE);
   setImTranslator(t);
+  ctx.effect(
+    () => installInterfaceLanguageMirror(ctx, {
+      rpcCall: (endpoint, payload, signal) => callManagementRpc(ctx.connection, HOST_LANGUAGE_RPC_CHANNEL, endpoint, payload, signal)
+    }),
+    "im-settings: mirror the DSH interface language"
+  );
   ctx.effect(() => installSessionChannelLogos(), "im-settings: Session channel logos");
   ctx.effect(() => {
     const disposers = [