完善对话页面！

* 消息组件显示移植
* 最近对话直接打开的补充
* 提及的修补
* ......

client/ui/chat-fragment/ChatMessageContainer.tsx

@@ -1,5 +1,6 @@
 import { Chat, Message } from 'lingchair-client-protocol'
 import * as React from 'react'
+import ChatMessage from './ChatMessage'
 
 export default function ChatMessageContainer({ messages }: { messages: Message[] }) {
     return (
@@ -12,7 +13,51 @@ export default function ChatMessageContainer({ messages }: { messages: Message[]
             paddingTop: "15px",
             flexGrow: '1',
         }}>
-            {messages?.map((v) => v.getText())}
+            {
+                (() => {
+                    // 添加时间
+                    let date = new Date(0)
+                    function timeAddZeroPrefix(t: number) {
+                        if (t >= 0 && t < 10)
+                            return '0' + t
+                        return t + ''
+                    }
+
+                    // 合并同用户消息
+                    let user: string | undefined
+                    return messages?.map((msg) => {
+                        // 添加时间
+                        const lastDate = date
+                        date = new Date(msg.getTime())
+                        const shouldShowTime = msg.getUserId() != null &&
+                            (date.getMinutes() != lastDate.getMinutes() || date.getDate() != lastDate.getDate() || date.getMonth() != lastDate.getMonth() || date.getFullYear() != lastDate.getFullYear())
+
+                        // 合并同用户消息
+                        const lastUser = user
+                        user = msg.getUserId()
+
+                        return <>
+                            {
+                                shouldShowTime && <mdui-tooltip content={`${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日  ${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`}>
+                                    <div style={{
+                                        fontSize: '87%',
+                                        marginTop: '13px',
+                                        marginBottom: '10px',
+                                    }}>
+                                        {
+                                            (date.getFullYear() != lastDate.getFullYear() ? `${date.getFullYear()}年` : '')
+                                            + `${date.getMonth() + 1}月`
+                                            + `${date.getDate()}日`
+                                            + `  ${timeAddZeroPrefix(date.getHours())}:${timeAddZeroPrefix(date.getMinutes())}`
+                                        }
+                                    </div>
+                                </mdui-tooltip>
+                            }
+                            <ChatMessage message={msg} noUserDisplay={lastUser == user && !shouldShowTime} />
+                        </>
+                    })
+                })()
+            }
         </div>
     )
 }