优化

client/web/plugins/com.msgbyte.miaolang/src/SendMiaoModal.tsx

@@ -0,0 +1,48 @@
+import React from 'react';
+import { useCallback } from 'react';
+import { useState } from 'react';
+import {
+  ModalWrapper,
+  useModalContext,
+  ChatInputActionContextProps,
+} from '@capital/common';
+import { Button, TextArea } from '@capital/component';
+import { encode } from './miaotrans';
+import { Translate } from './translate';
+
+interface SendMiaoModalProps {
+  actions: ChatInputActionContextProps;
+}
+export const SendMiaoModal: React.FC<SendMiaoModalProps> = React.memo(
+  (props) => {
+    const [text, setText] = useState('');
+    const modalContext = useModalContext();
+
+    const handleSendMiao = useCallback(() => {
+      const miao = encode(text);
+
+      props.actions.sendMsg(miao);
+      modalContext?.closeModal();
+    }, [text, modalContext, props.actions]);
+
+    return (
+      <ModalWrapper title={Translate.title}>
+        <TextArea
+          placeholder={Translate.inputHuman}
+          value={text}
+          onChange={(e) => setText(e.target.value)}
+        />
+
+        <Button
+          style={{ marginTop: 8 }}
+          type="primary"
+          block={true}
+          onClick={handleSendMiao}
+        >
+          {Translate.send}
+        </Button>
+      </ModalWrapper>
+    );
+  }
+);
+SendMiaoModal.displayName = 'SendMiaoModal';

client/web/plugins/com.msgbyte.miaolang/src/index.ts

@@ -0,0 +1,19 @@
+import { regChatInputAction, openModal, Loadable } from '@capital/common';
+import { createElement } from 'react';
+import { Translate } from './translate';
+
+const SendMiaoModal = Loadable(() =>
+  import('./SendMiaoModal').then((module) => ({
+    default: module.SendMiaoModal,
+  }))
+);
+
+// Just for reduce entry file size
+import('./reg');
+
+regChatInputAction({
+  label: Translate.title,
+  onClick: (actions) => {
+    openModal(createElement(SendMiaoModal, { actions }));
+  },
+});

client/web/plugins/com.msgbyte.miaolang/src/miaotrans.ts

@@ -0,0 +1,18 @@
+import Miao from 'miao-lang';
+import { Translate } from './translate';
+import { getLanguage } from '@capital/common';
+
+export function encode(human: string): string {
+  return Miao.encode(human, {
+    calls: Translate.calls,
+    halfwidthSymbol: getLanguage() !== 'zh-CN',
+  });
+}
+
+export function decode(miao: string): string {
+  return Miao.decode(miao);
+}
+
+export function isMiao(input: string): boolean {
+  return Miao.isMiao(input);
+}

client/web/plugins/com.msgbyte.miaolang/src/reg.ts

@@ -0,0 +1,20 @@
+import { decode, encode, isMiao } from './miaotrans';
+import { regMessageInterpreter } from '@capital/common';
+import { Translate } from './translate';
+
+const miao = encode('喵语翻译已加载');
+const human = decode(miao);
+
+console.log(`${miao}\n${human}`);
+
+regMessageInterpreter({
+  name: Translate.miaoTrans,
+  explainMessage(message: string) {
+    // 喵语 -> 人话
+    if (!isMiao(message)) {
+      return null;
+    }
+
+    return decode(message);
+  },
+});

client/web/plugins/com.msgbyte.miaolang/src/translate.ts

@@ -0,0 +1,9 @@
+import { localTrans } from '@capital/common';
+
+export const Translate = {
+  miaoTrans: localTrans({ 'zh-CN': '喵语翻译', 'en-US': 'Meow Translate' }),
+  title: localTrans({ 'zh-CN': '喵言喵语', 'en-US': 'Meow meow' }),
+  send: localTrans({ 'zh-CN': '发送喵语', 'en-US': 'Send meow' }),
+  inputHuman: localTrans({ 'zh-CN': '输入人话', 'en-US': 'Input Human' }),
+  calls: localTrans({ 'zh-CN': '喵', 'en-US': 'Meow~' }),
+};