Add Telegram and Discord IM channels

plugin-src/client/index.js

@@ -2,19 +2,27 @@ import * as React from 'react';
 
 import {
   DingtalkLogoGlyph,
+  DiscordLogoGlyph,
   FeishuLogoGlyph,
   QqLogoGlyph,
+  TelegramLogoGlyph,
   WecomLogoGlyph,
   WeixinLogoGlyph,
 } from './channel-logos.js';
 import { DINGTALK_RPC_CHANNEL } from './channels/dingtalk/api.js';
 import { DingtalkSettingsTab } from './channels/dingtalk/index.js';
+import { DISCORD_RPC_CHANNEL } from './channels/discord/api.js';
+import { DiscordSettingsTab } from './channels/discord/index.js';
+import { installDiscordStyles } from './channels/discord/styles.js';
 import { FeishuSettingsTab } from './channels/feishu/index.js';
 import { FEISHU_RPC_CHANNEL } from './channels/feishu/api.js';
 import { installFeishuStyles } from './channels/feishu/styles.js';
 import { QQ_RPC_CHANNEL } from './channels/qq/api.js';
 import { QqSettingsTab } from './channels/qq/index.js';
 import { installQqStyles } from './channels/qq/styles.js';
+import { TELEGRAM_RPC_CHANNEL } from './channels/telegram/api.js';
+import { TelegramSettingsTab } from './channels/telegram/index.js';
+import { installTelegramStyles } from './channels/telegram/styles.js';
 import { WECOM_RPC_CHANNEL } from './channels/wecom/api.js';
 import { WecomSettingsTab } from './channels/wecom/index.js';
 import { installWecomStyles } from './channels/wecom/styles.js';
@@ -34,6 +42,8 @@ const CHANNELS = Object.freeze([
   { id: 'dingtalk', label: '钉钉' },
   { id: 'wecom', label: '企业微信' },
   { id: 'qq', label: 'QQ' },
+  { id: 'telegram', label: 'Telegram' },
+  { id: 'discord', label: 'Discord' },
 ]);
 
 function WeixinLogo() {
@@ -59,20 +69,40 @@ function WecomLogo() {
   return h('span', { className: 'dim-logo dim-logoWecom', 'aria-hidden': 'true' }, h(WecomLogoGlyph));
 }
 
+function TelegramLogo() {
+  return h('span', { className: 'dim-logo dim-logoTelegram', 'aria-hidden': 'true' },
+    h(TelegramLogoGlyph));
+}
+
+function DiscordLogo() {
+  return h('span', { className: 'dim-logo dim-logoDiscord', 'aria-hidden': 'true' },
+    h(DiscordLogoGlyph));
+}
+
 function ChannelLogo({ channel }) {
   if (channel === 'weixin') return h(WeixinLogo);
   if (channel === 'feishu') return h(FeishuLogo);
   if (channel === 'dingtalk') return h(DingtalkLogo);
   if (channel === 'wecom') return h(WecomLogo);
-  return h(QqLogo);
+  if (channel === 'qq') return h(QqLogo);
+  if (channel === 'telegram') return h(TelegramLogo);
+  return h(DiscordLogo);
 }
 
-export function IMSettingsTab({ dingtalkRpcCall, feishuRpcCall, qqRpcCall, wecomRpcCall, weixinRpcCall }) {
+export function IMSettingsTab({
+  dingtalkRpcCall,
+  discordRpcCall,
+  feishuRpcCall,
+  qqRpcCall,
+  telegramRpcCall,
+  wecomRpcCall,
+  weixinRpcCall,
+}) {
   const [selected, setSelected] = React.useState('weixin');
   const active = CHANNELS.find((channel) => channel.id === selected) ?? CHANNELS[0];
   return h('section', { className: 'dim-page', 'aria-label': 'IM机器人设置' },
     h('header', { className: 'dim-title' },
-      h('p', null, '通过扫码把机器人接入 DeepSeek Harness'),
+      h('p', null, '把机器人接入 DeepSeek Harness'),
     ),
     h('div', { className: 'dim-layout' },
       h('nav', { className: 'dim-rail', role: 'tablist', 'aria-label': 'IM 渠道' },
@@ -104,7 +134,11 @@ export function IMSettingsTab({ dingtalkRpcCall, feishuRpcCall, qqRpcCall, wecom
             ? h(DingtalkSettingsTab, { rpcCall: dingtalkRpcCall })
             : active.id === 'wecom'
               ? h(WecomSettingsTab, { rpcCall: wecomRpcCall })
-              : h(QqSettingsTab, { rpcCall: qqRpcCall })),
+              : active.id === 'qq'
+                ? h(QqSettingsTab, { rpcCall: qqRpcCall })
+                : active.id === 'telegram'
+                  ? h(TelegramSettingsTab, { rpcCall: telegramRpcCall })
+                  : h(DiscordSettingsTab, { rpcCall: discordRpcCall })),
     ),
   );
 }
@@ -116,6 +150,8 @@ export function apply(ctx) {
       installWeixinStyles(),
       installWecomStyles(),
       installQqStyles(),
+      installTelegramStyles(),
+      installDiscordStyles(),
       installImStyles(),
     ];
     return () => {
@@ -133,12 +169,24 @@ export function apply(ctx) {
     ctx.connection.rpc.call(QQ_RPC_CHANNEL, endpoint, payload, signal);
   const wecomRpcCall = (endpoint, payload, signal) =>
     ctx.connection.rpc.call(WECOM_RPC_CHANNEL, endpoint, payload, signal);
+  const telegramRpcCall = (endpoint, payload, signal) =>
+    ctx.connection.rpc.call(TELEGRAM_RPC_CHANNEL, endpoint, payload, signal);
+  const discordRpcCall = (endpoint, payload, signal) =>
+    ctx.connection.rpc.call(DISCORD_RPC_CHANNEL, endpoint, payload, signal);
 
   ctx.slots.inject('settings.plugins.tab', () => ctx.slots.register({
     name: 'settings.plugins.tab',
     id: 'im',
     order: 20,
     label: 'IM机器人',
-    inject: () => ({ dingtalkRpcCall, feishuRpcCall, qqRpcCall, wecomRpcCall, weixinRpcCall }),
+    inject: () => ({
+      dingtalkRpcCall,
+      discordRpcCall,
+      feishuRpcCall,
+      qqRpcCall,
+      telegramRpcCall,
+      wecomRpcCall,
+      weixinRpcCall,
+    }),
   }, IMSettingsTab));
 }