@tencentcloud/roomkit-electron-vue3 2.6.0 → 2.6.2

package/src/TUIRoom/components/Chat/ChatKit/components/TUIChat/emoji-config/index.ts

@@ -0,0 +1,140 @@
+import { TUITranslateService } from '@tencentcloud/chat-uikit-engine';
+import { CUSTOM_BASIC_EMOJI_URL, CUSTOM_BIG_EMOJI_URL, CUSTOM_BASIC_EMOJI_URL_MAPPING, CUSTOM_BIG_EMOJI_GROUP_LIST } from './custom-emoji';
+import { DEFAULT_BASIC_EMOJI_URL, BIG_EMOJI_GROUP_LIST, DEFAULT_BASIC_EMOJI_URL_MAPPING, BASIC_EMOJI_NAME_TO_KEY_MAPPING, DEFAULT_BIG_EMOJI_URL } from './default-emoji';
+import { default as emojiCNLocales } from './locales/zh_cn';
+import { IEmojiGroupList } from '../../../interface';
+import { EMOJI_TYPE } from '../../../constant';
+import { isWeChat } from '../../../utils/env';
+
+const hasCustomBasicEmoji = CUSTOM_BASIC_EMOJI_URL && Object.keys(CUSTOM_BASIC_EMOJI_URL_MAPPING).length;
+
+const BASIC_EMOJI_URL = hasCustomBasicEmoji ? CUSTOM_BASIC_EMOJI_URL : DEFAULT_BASIC_EMOJI_URL;
+
+const BASIC_EMOJI_URL_MAPPING = hasCustomBasicEmoji ? CUSTOM_BASIC_EMOJI_URL_MAPPING : DEFAULT_BASIC_EMOJI_URL_MAPPING;
+
+const EMOJI_GROUP_LIST: IEmojiGroupList = [
+  {
+    emojiGroupID: 0,
+    type: EMOJI_TYPE.BASIC,
+    url: BASIC_EMOJI_URL,
+    list: Object.keys(BASIC_EMOJI_URL_MAPPING),
+  },
+  ...BIG_EMOJI_GROUP_LIST,
+  ...CUSTOM_BIG_EMOJI_GROUP_LIST,
+];
+
+/**
+ * Converts a basic emoji key into its corresponding name.
+ * Example:
+ * '[Smile]' => '[TUIEmoji_Smile]'
+ * @param {string} key - The emoji key.
+ * @return {string} The corresponding emoji name.
+ */
+const convertKeyToEmojiName = (key: string): string => {
+  // WeChat does not support emoji translation
+  return isWeChat ? emojiCNLocales[key] : TUITranslateService.t(`Emoji.${key}`);
+};
+
+/**
+ * Transforms a text containing emoji keys into a text with Chinese or English basic emoji names
+ * Example:
+ * 'hello[TUIEmoji_Smile]!' => 'hello[Smile]!''
+ * @param {string} text - The text containing emoji keys.
+ * @return {string} The transformed text with emoji keys replaced by emoji names.
+ */
+const transformTextWithKeysToEmojiNames = (text: string): string => {
+  if (!text) {
+    return '';
+  }
+  const reg = /(\[.+?\])/g;
+  let txt: string = text;
+  if (reg.test(text)) {
+    txt = text.replace(reg, match => BASIC_EMOJI_URL_MAPPING[match] ? convertKeyToEmojiName(match) : match);
+  }
+  return txt;
+};
+
+/**
+ * Transforms a text containing Chinese or English basic emoji names into a text with emoji keys.
+ * Example:
+ * 'hello[Smile]!' => 'hello[TUIEmoji_Smile]!'
+ * @param {string} text - The text containing emoji names.
+ * @return {string} The transformed text with emoji names replaced by emoji keys.
+ */
+const transformTextWithEmojiNamesToKeys = (text: string) => {
+  if (!text) {
+    return '';
+  }
+  const reg = /(\[.+?\])/g;
+  let txt: string = text;
+  if (reg.test(text)) {
+    txt = text.replace(reg, match => BASIC_EMOJI_NAME_TO_KEY_MAPPING[match] || match);
+  }
+  return txt;
+};
+
+/**
+* The configuration aims to provide compatibility with versions prior to 2.2.0
+*/
+const emojiConfig = {
+  emojiBaseUrl: BASIC_EMOJI_URL,
+  emojiUrlMapping: BASIC_EMOJI_URL_MAPPING,
+  emojiNameMapping: {
+    ...emojiCNLocales,
+  },
+};
+
+/**
+ * Transform text message to renderable array contains image and text.
+ * Example: hello[TUIEmoji_Smile], I am happy.
+ * -> [{type: 'text', content: 'hello'}, {type: 'image', content: 'https://.../smile.png'}, {type: 'text', content: ', I am happy.'}]
+ * @param text
+ * @returns Array<{ type: 'text' | 'image'; content: string; emojiKey?: string; }>
+ */
+const parseTextToRenderArray = (text: string): Array<{ type: 'text' | 'image'; content: string; emojiKey?: string }> => {
+  const emojiRegex = /\[([^\]]+)\]/g;
+  const result: any[] = [];
+
+  let match: RegExpExecArray | null;
+  let lastIndex = 0;
+
+  while ((match = emojiRegex.exec(text)) !== null) {
+    const startIndex = match.index;
+    const endIndex = emojiRegex.lastIndex;
+    const emojiKey = match[0];
+
+    if (startIndex > lastIndex) {
+      result.push({ type: 'text', content: text.substring(lastIndex, startIndex) });
+    }
+
+    const emojiUrl = BASIC_EMOJI_URL + BASIC_EMOJI_URL_MAPPING[emojiKey];
+    if (emojiUrl) {
+      result.push({ type: 'image', content: emojiUrl, emojiKey });
+    } else {
+      result.push({ type: 'text', content: emojiKey });
+    }
+
+    lastIndex = endIndex;
+    emojiRegex.lastIndex = lastIndex;
+  }
+
+  if (lastIndex < text.length) {
+    result.push({ type: 'text', content: text.substring(lastIndex) });
+  }
+
+  return result;
+};
+
+export {
+  EMOJI_GROUP_LIST,
+  CUSTOM_BIG_EMOJI_URL,
+  DEFAULT_BIG_EMOJI_URL,
+  CUSTOM_BASIC_EMOJI_URL,
+  BASIC_EMOJI_URL_MAPPING,
+  CUSTOM_BASIC_EMOJI_URL_MAPPING,
+  convertKeyToEmojiName,
+  parseTextToRenderArray,
+  transformTextWithKeysToEmojiNames,
+  transformTextWithEmojiNamesToKeys,
+  emojiConfig,
+};

package/src/TUIRoom/components/Chat/ChatKit/components/TUIChat/emoji-config/locales/en.ts

@@ -0,0 +1,66 @@
+const Emoji = {
+  '[TUIEmoji_Smile]': '[Smile]',
+  '[TUIEmoji_Expect]': '[Expect]',
+  '[TUIEmoji_Blink]': '[Blink]',
+  '[TUIEmoji_Guffaw]': '[Guffaw]',
+  '[TUIEmoji_KindSmile]': '[KindSmile]',
+  '[TUIEmoji_Haha]': '[Haha]',
+  '[TUIEmoji_Cheerful]': '[Cheerful]',
+  '[TUIEmoji_Speechless]': '[Speechless]',
+  '[TUIEmoji_Amazed]': '[Amazed]',
+  '[TUIEmoji_Sorrow]': '[Sorrow]',
+  '[TUIEmoji_Complacent]': '[Complacent]',
+  '[TUIEmoji_Silly]': '[Silly]',
+  '[TUIEmoji_Lustful]': '[Lustful]',
+  '[TUIEmoji_Giggle]': '[Giggle]',
+  '[TUIEmoji_Kiss]': '[Kiss]',
+  '[TUIEmoji_Wail]': '[Wail]',
+  '[TUIEmoji_TearsLaugh]': '[TearsLaugh]',
+  '[TUIEmoji_Trapped]': '[Trapped]',
+  '[TUIEmoji_Mask]': '[Mask]',
+  '[TUIEmoji_Fear]': '[Fear]',
+  '[TUIEmoji_BareTeeth]': '[BareTeeth]',
+  '[TUIEmoji_FlareUp]': '[FlareUp]',
+  '[TUIEmoji_Yawn]': '[Yawn]',
+  '[TUIEmoji_Tact]': '[Tact]',
+  '[TUIEmoji_Stareyes]': '[StarEyes]',
+  '[TUIEmoji_ShutUp]': '[ShutUp]',
+  '[TUIEmoji_Sigh]': '[Sigh]',
+  '[TUIEmoji_Hehe]': '[Hehe]',
+  '[TUIEmoji_Silent]': '[Silent]',
+  '[TUIEmoji_Surprised]': '[Surprised]',
+  '[TUIEmoji_Askance]': '[Askance]]',
+  '[TUIEmoji_Ok]': '[OK]',
+  '[TUIEmoji_Shit]': '[Shit]',
+  '[TUIEmoji_Monster]': '[Monster]',
+  '[TUIEmoji_Daemon]': '[Daemon]',
+  '[TUIEmoji_Rage]': '[Rage]',
+  '[TUIEmoji_Fool]': '[Fool]',
+  '[TUIEmoji_Pig]': '[Pig]',
+  '[TUIEmoji_Cow]': '[Cow]',
+  '[TUIEmoji_Ai]': '[AI]',
+  '[TUIEmoji_Skull]': '[Skull]',
+  '[TUIEmoji_Bombs]': '[Bombs]',
+  '[TUIEmoji_Coffee]': '[Coffee]',
+  '[TUIEmoji_Cake]': '[Cake]',
+  '[TUIEmoji_Beer]': '[Beer]',
+  '[TUIEmoji_Flower]': '[Flower]',
+  '[TUIEmoji_Watermelon]': '[Watermelon]',
+  '[TUIEmoji_Rich]': '[Rich]',
+  '[TUIEmoji_Heart]': '[Heart]',
+  '[TUIEmoji_Moon]': '[Moon]',
+  '[TUIEmoji_Sun]': '[Sun]',
+  '[TUIEmoji_Star]': '[Star]',
+  '[TUIEmoji_RedPacket]': '[RedPacket]',
+  '[TUIEmoji_Celebrate]': '[Celebrate]',
+  '[TUIEmoji_Bless]': '[Bless]',
+  '[TUIEmoji_Fortune]': '[Fortune]',
+  '[TUIEmoji_Convinced]': '[Convinced]',
+  '[TUIEmoji_Prohibit]': '[Prohibit]',
+  '[TUIEmoji_666]': '[666]',
+  '[TUIEmoji_857]': '[857]',
+  '[TUIEmoji_Knife]': '[Knife]',
+  '[TUIEmoji_Like]': '[Like]',
+};
+
+export default Emoji;

package/src/TUIRoom/components/Chat/ChatKit/components/TUIChat/emoji-config/locales/zh_cn.ts

@@ -0,0 +1,66 @@
+const Emoji: Record<string, string> = {
+  '[TUIEmoji_Smile]': '[微笑]',
+  '[TUIEmoji_Expect]': '[期待]',
+  '[TUIEmoji_Blink]': '[眨眼]',
+  '[TUIEmoji_Guffaw]': '[大笑]',
+  '[TUIEmoji_KindSmile]': '[姨母笑]',
+  '[TUIEmoji_Haha]': '[哈哈哈]',
+  '[TUIEmoji_Cheerful]': '[愉快]',
+  '[TUIEmoji_Speechless]': '[无语]',
+  '[TUIEmoji_Amazed]': '[惊讶]',
+  '[TUIEmoji_Sorrow]': '[悲伤]',
+  '[TUIEmoji_Complacent]': '[得意]',
+  '[TUIEmoji_Silly]': '[傻了]',
+  '[TUIEmoji_Lustful]': '[色]',
+  '[TUIEmoji_Giggle]': '[憨笑]',
+  '[TUIEmoji_Kiss]': '[亲亲]',
+  '[TUIEmoji_Wail]': '[大哭]',
+  '[TUIEmoji_TearsLaugh]': '[哭笑]',
+  '[TUIEmoji_Trapped]': '[困]',
+  '[TUIEmoji_Mask]': '[口罩]',
+  '[TUIEmoji_Fear]': '[恐惧]',
+  '[TUIEmoji_BareTeeth]': '[龇牙]',
+  '[TUIEmoji_FlareUp]': '[发怒]',
+  '[TUIEmoji_Yawn]': '[打哈欠]',
+  '[TUIEmoji_Tact]': '[机智]',
+  '[TUIEmoji_Stareyes]': '[星星眼]',
+  '[TUIEmoji_ShutUp]': '[闭嘴]',
+  '[TUIEmoji_Sigh]': '[叹气]',
+  '[TUIEmoji_Hehe]': '[呵呵]',
+  '[TUIEmoji_Silent]': '[收声]',
+  '[TUIEmoji_Surprised]': '[惊喜]',
+  '[TUIEmoji_Askance]': '[白眼]',
+  '[TUIEmoji_Ok]': '[OK]',
+  '[TUIEmoji_Shit]': '[便便]',
+  '[TUIEmoji_Monster]': '[怪兽]',
+  '[TUIEmoji_Daemon]': '[恶魔]',
+  '[TUIEmoji_Rage]': '[恶魔怒]',
+  '[TUIEmoji_Fool]': '[衰]',
+  '[TUIEmoji_Pig]': '[猪]',
+  '[TUIEmoji_Cow]': '[牛]',
+  '[TUIEmoji_Ai]': '[AI]',
+  '[TUIEmoji_Skull]': '[骷髅]',
+  '[TUIEmoji_Bombs]': '[炸弹]',
+  '[TUIEmoji_Coffee]': '[咖啡]',
+  '[TUIEmoji_Cake]': '[蛋糕]',
+  '[TUIEmoji_Beer]': '[啤酒]',
+  '[TUIEmoji_Flower]': '[花]',
+  '[TUIEmoji_Watermelon]': '[瓜]',
+  '[TUIEmoji_Rich]': '[壕]',
+  '[TUIEmoji_Heart]': '[爱心]',
+  '[TUIEmoji_Moon]': '[月亮]',
+  '[TUIEmoji_Sun]': '[太阳]',
+  '[TUIEmoji_Star]': '[星星]',
+  '[TUIEmoji_RedPacket]': '[红包]',
+  '[TUIEmoji_Celebrate]': '[庆祝]',
+  '[TUIEmoji_Bless]': '[福]',
+  '[TUIEmoji_Fortune]': '[发]',
+  '[TUIEmoji_Convinced]': '[服]',
+  '[TUIEmoji_Prohibit]': '[禁]',
+  '[TUIEmoji_666]': '[666]',
+  '[TUIEmoji_857]': '[857]',
+  '[TUIEmoji_Knife]': '[刀]',
+  '[TUIEmoji_Like]': '[赞]',
+};
+
+export default Emoji;

package/src/TUIRoom/components/Chat/ChatKit/components/TUIChat/forward/index.vue

@@ -0,0 +1,159 @@
+<template>
+  <Overlay
+    :visible="isShowForwardPanel"
+    :useMask="false"
+  >
+    <Transfer
+      :title="TUITranslateService.t('TUIChat.转发')"
+      :isSearch="false"
+      :isCustomItem="false"
+      :list="customConversationList"
+      :isHiddenBackIcon="isUniFrameWork"
+      @cancel="closeForwardPanel"
+      @submit="finishSelected"
+    />
+  </Overlay>
+</template>
+
+<script lang="ts" setup>
+import { onMounted, onUnmounted, ref } from '../../../adapter-vue';
+import TUIChatEngine, {
+  TUIStore,
+  StoreName,
+  TUIChatService,
+  TUITranslateService,
+} from '@tencentcloud/chat-uikit-engine';
+import Overlay from '../../common/Overlay/index.vue';
+import Transfer from '../../common/Transfer/index.vue';
+import { Toast, TOAST_TYPE } from '../../../components/common/Toast';
+import { isUniFrameWork } from '../../../utils/env';
+import { isEnabledMessageReadReceiptGlobal } from '../utils/utils';
+import OfflinePushInfoManager, { IOfflinePushInfoCreateParams } from '../offlinePushInfoManager/index';
+
+interface IEmits {
+  (e: 'toggleMultipleSelectMode', visible?: boolean): void;
+}
+
+const emits = defineEmits<IEmits>();
+
+let selectedToForwardMessageIDList: string[] = [];
+let isMergeForward = false;
+
+const isShowForwardPanel = ref(false);
+const customConversationList = ref();
+
+onMounted(() => {
+  TUIStore.watch(StoreName.CUSTOM, {
+    singleForwardMessageID: onSingleForwardMessageIDUpdated,
+    multipleForwardMessageID: onMultipleForwardMessageIDUpdated,
+  });
+});
+
+onUnmounted(() => {
+  TUIStore.unwatch(StoreName.CUSTOM, {
+    singleForwardMessageID: onSingleForwardMessageIDUpdated,
+    multipleForwardMessageID: onMultipleForwardMessageIDUpdated,
+  });
+
+  // tuistore data must be cleared when closing the forward panel
+  clearStoreData();
+});
+
+function onSingleForwardMessageIDUpdated(messageID: string | undefined) {
+  if (typeof messageID !== 'undefined') {
+    isMergeForward = false;
+    selectedToForwardMessageIDList = [messageID];
+    openForwardPanel();
+  }
+}
+
+function onMultipleForwardMessageIDUpdated(params: { isMergeForward: boolean; messageIDList: string[] } | undefined) {
+  if (!params) {
+    return;
+  }
+  isMergeForward = false;
+  const {
+    isMergeForward: _isMergeForward,
+    messageIDList: selectedMessageIDList,
+  } = params || {};
+  if (selectedMessageIDList?.length > 0) {
+    isMergeForward = _isMergeForward;
+    selectedToForwardMessageIDList = selectedMessageIDList;
+    openForwardPanel();
+  } else {
+    Toast({
+      message: TUITranslateService.t('TUIChat.未选择消息'),
+      type: TOAST_TYPE.ERROR,
+    });
+  }
+}
+
+function clearStoreData() {
+  TUIStore.update(StoreName.CUSTOM, 'singleForwardMessageID', undefined);
+  TUIStore.update(StoreName.CUSTOM, 'multipleForwardMessageID', undefined);
+}
+
+function closeForwardPanel(): void {
+  // tuistore data must be cleared when closing the forward panel
+  clearStoreData();
+  isShowForwardPanel.value = false;
+}
+
+function openForwardPanel(): void {
+  getTransforRenderDataList();
+  isShowForwardPanel.value = true;
+}
+
+function finishSelected(selectedConvIDWrapperList: Array<{ userID: string }>): void {
+  if (selectedConvIDWrapperList?.length === 0) return;
+  // to reuse Transfer, so we have to get conversationModel by userID instead of ConversationID
+  const selectedConversationList = selectedConvIDWrapperList.map(IDWrapper => TUIStore.getConversationModel(IDWrapper.userID));
+  const unsentMessageQueue = selectedToForwardMessageIDList
+    .map(messageID => TUIStore.getMessageModel(messageID))
+    .sort((a, b) => a.time - b.time);
+  const forwardPromises = selectedConversationList.map((conversation) => {
+    const offlinePushInfoCreateParams: IOfflinePushInfoCreateParams = {
+      conversation,
+      messageType: TUIChatEngine.TYPES.MSG_MERGER,
+    };
+    return TUIChatService.sendForwardMessage(
+      [conversation],
+      unsentMessageQueue,
+      {
+        needMerge: isMergeForward,
+        offlinePushInfo: OfflinePushInfoManager.create(offlinePushInfoCreateParams),
+        params: {
+          needReadReceipt: isEnabledMessageReadReceiptGlobal(),
+        },
+      },
+    );
+  });
+  Promise.allSettled(forwardPromises).then((results) => {
+    for (const result of results) {
+      const { status } = result;
+      if (status === 'rejected') {
+        const errorMessage = result.reason.code === 80001 ? TUITranslateService.t('TUIChat.内容包含敏感词汇') : result.reason.message as string;
+        Toast({
+          message: errorMessage,
+          type: TOAST_TYPE.ERROR,
+        });
+        break;
+      }
+    }
+  });
+  closeForwardPanel();
+  emits('toggleMultipleSelectMode', false);
+}
+
+function getTransforRenderDataList() {
+  const conversationList = TUIStore.getData(StoreName.CONV, 'conversationList');
+  customConversationList.value = conversationList.map((conversation) => {
+    return {
+      // To achieve reusability of Transfer, userID is used here instead of ConversationID
+      userID: conversation.conversationID,
+      nick: conversation.getShowName(),
+      avatar: conversation.getAvatar(),
+    };
+  });
+}
+</script>

package/src/TUIRoom/components/Chat/ChatKit/components/TUIChat/index.ts

@@ -0,0 +1,6 @@
+import TUIChat from './index.vue';
+import Server from './server';
+
+new Server();
+
+export default TUIChat;