core: support mention notification

packages/ui-default/components/messagepad/MessagePadDialogueContentContainer.jsx

@@ -41,11 +41,24 @@ export default connect(mapStateToProps)(class MessagePadDialogueContentContainer
   }
 
   renderContent(msg) {
+    // TODO: FLAG_RICHTEXT
     if (msg.from === 1) {
       // Is system message
       try {
         const data = JSON.parse(msg.content);
-        return i18n(data.message, ...data.params);
+        const str = i18n(data.message).replace(/\{([^{}]+)\}/g, (match, key) => `%substitude%${key}%substitude%`);
+        const arr = str.split('%substitude%');
+        data.params = data.params || {};
+        for (let i = 1; i < arr.length; i += 2) {
+          if (arr[i].endsWith(':link')) {
+            const link = data.params[arr[i].split(':link')[0]];
+            if (!link) continue;
+            arr[i] = <a style={{ color: 'wheat' }} href={link} key={i} target="_blank" rel="noreferrer">{link}</a>;
+          } else {
+            arr[i] = <span style={{ color: 'wheat' }} key={i}>{data.params[arr[i]]}</span>;
+          }
+        }
+        return arr;
       } catch (e) { }
       return i18n(msg.content);
     }

packages/ui-default/components/messagepad/MessagePadDialogueListContainer.jsx

@@ -3,6 +3,7 @@ import _ from 'lodash';
 import { connect } from 'react-redux';
 import 'jquery-scroll-lock';
 
+import i18n from 'vj/utils/i18n';
 import ListItem from './DialogueListItemComponent';
 
 const mapStateToProps = (state) => ({
@@ -38,7 +39,12 @@ export default connect(mapStateToProps, mapDispatchToProps)(class MessagePadDial
           <ListItem
             key={dialogue._id}
             userName={dialogue.udoc.uname}
-            summary={(_.last(dialogue.messages)?.content) || ''}
+            // eslint-disable-next-line no-nested-ternary
+            summary={_.last(dialogue.messages)
+              ? (_.last(dialogue.messages).flag & 4)
+                ? i18n('[Richtext message]')
+                : _.last(dialogue.messages).content
+              : ''}
             faceUrl={dialogue.udoc.avatarUrl}
             active={dialogue._id === this.props.activeId}
             onClick={() => this.props.handleClick(dialogue._id)}