fixed bridge reply formatting

src/app/molecules/message/Message.jsx

@@ -86,9 +86,7 @@ MessageHeader.propTypes = {
   time: PropTypes.string.isRequired,
 };
 
-function MessageReply({
+function MessageReply({ name, color, content }) {
-  userId, name, color, content,
-}) {
   return (
     <div className="message__reply">
       <Text variant="b2">
@@ -101,7 +99,6 @@ function MessageReply({
 }
 
 MessageReply.propTypes = {
-  userId: PropTypes.string.isRequired,
   name: PropTypes.string.isRequired,
   color: PropTypes.string.isRequired,
   content: PropTypes.string.isRequired,

src/app/organisms/channel/ChannelViewContent.jsx

@@ -205,13 +205,12 @@ function genMessage(roomId, prevMEvent, mEvent, roomTimeline, viewEvent) {
 
   if (isReply) {
     const parsedContent = parseReply(content);
-
     if (parsedContent !== null) {
-      const username = getUsername(parsedContent.userId);
+      const c = roomTimeline.room.currentState;
+      const ID = parsedContent.userId || c.getUserIdsWithDisplayName(parsedContent.displayName)[0];
       reply = {
-        userId: parsedContent.userId,
+        color: colorMXID(ID || parsedContent.displayName),
-        color: colorMXID(parsedContent.userId),
+        to: parsedContent.displayName || getUsername(parsedContent.userId),
-        to: username,
         content: parsedContent.replyContent,
       };
       content = parsedContent.content;
@@ -284,7 +283,6 @@ function genMessage(roomId, prevMEvent, mEvent, roomTimeline, viewEvent) {
   );
   const userReply = reply === null ? null : (
     <MessageReply
-      userId={reply.userId}
       name={reply.to}
       color={reply.color}
       content={reply.content}

src/app/organisms/channel/common.jsx

@@ -161,17 +161,20 @@ function getUsersActionJsx(userIds, actionStr) {
 
 function parseReply(rawContent) {
   if (rawContent.indexOf('>') !== 0) return null;
-  let content = rawContent.slice(rawContent.indexOf('@'));
+  let content = rawContent.slice(rawContent.indexOf('<') + 1);
-  const userId = content.slice(0, content.indexOf('>'));
+  const user = content.slice(0, content.indexOf('>'));
 
   content = content.slice(content.indexOf('>') + 2);
   const replyContent = content.slice(0, content.indexOf('\n\n'));
   content = content.slice(content.indexOf('\n\n') + 2);
 
-  if (userId === '') return null;
+  if (user === '') return null;
+
+  const isUserId = user.match(/^@.+:.+/);
 
   return {
-    userId,
+    userId: isUserId ? user : null,
+    displayName: isUserId ? null : user,
     replyContent,
     content,
   };