feat: 将引用网站改为气泡形式 (#806)

* feat: 将引用网站改为气泡形式

* feat: 在raw-message中不显示display_append

* feat: 引用网站气泡改为多行气泡

* feat: 在线搜索 append 卡片适配网页标题形式

* fix: 修复网址被escape成字符串显示的错误

这个错误的原因是，形如`https://xxx`的网址也会直接被marked渲染为url的html格式，
因此后面接的)或]符号就会被渲染为输出的字符串的一部分。

这里把冒号也直接escape了，解决了这个问题。

assets/custom.css

@@ -204,6 +204,45 @@ input[type=range]::-webkit-slider-runnable-track {
     background: transparent;
 }
 
+hr.append-display {
+    margin: 8px 0;
+    border: none;
+    height: 1px;
+    border-top-width: 0;
+    background-image: linear-gradient(to right, rgba(50,50,50, 0.1), rgba(150, 150, 150, 0.8), rgba(50,50,50, 0.1));
+}
+.source-a {
+    font-size: 0.8em;
+    max-width: 100%;
+    margin: 0;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: center;
+    /* background-color: #dddddd88; */
+    border-radius: 1.5rem;
+    padding: 0.2em;
+}
+.source-a a {
+    display: inline-block;
+    background-color: #aaaaaa50;
+    border-radius: 1rem;
+    padding: 0.5em;
+    text-align: center;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    min-width: 20%;
+    white-space: nowrap;
+    margin: 0.2rem 0.1rem;
+    text-decoration: none !important;
+    flex: 1;
+    transition: flex 0.5s;
+}
+.source-a a:hover {
+    background-color: #aaaaaa20;
+    flex: 2;
+}
+
 #submit_btn, #cancel_btn {
     height: 42px !important;
 }

modules/models/base_model.py

@@ -246,7 +246,7 @@ class BaseLLMModel:
         stream_iter = self.get_answer_stream_iter()
 
         if display_append:
-            display_append = "<hr>" +display_append
+            display_append = '\n\n<hr class="append-display no-in-raw" />' + display_append
         for partial_text in stream_iter:
             chatbot[-1] = (chatbot[-1][0], partial_text + display_append)
             self.all_token_counts[-1] += 1
@@ -348,10 +348,11 @@ class BaseLLMModel:
                 reference_results.append([result['body'], result['href']])
                 display_append.append(
                     # f"{idx+1}. [{domain_name}]({result['href']})\n"
-                    f"<li><a href=\"{result['href']}\" target=\"_blank\">{result['title']}</a></li>\n"
+                    f"<a href=\"{result['href']}\" target=\"_blank\">{idx+1}.&nbsp;{result['title']}</a>"
                 )
             reference_results = add_source_numbers(reference_results)
-            display_append = "<ol>\n\n" + "".join(display_append) + "</ol>"
+            # display_append = "<ol>\n\n" + "".join(display_append) + "</ol>"
+            display_append = '<div class = "source-a">' + "".join(display_append) + '</div>'
             real_inputs = (
                 replace_today(WEBSEARCH_PTOMPT_TEMPLATE)
                 .replace("{query}", real_inputs)

modules/utils.py

@@ -217,7 +217,10 @@ def convert_bot_before_marked(chat_message):
         non_code_parts = code_block_pattern.split(chat_message)[::2]
         result = []
 
-        raw = f'<div class="raw-message hideM">{escape_markdown(chat_message)}</div>'
+        hr_pattern = r'\n\n<hr class="append-display no-in-raw" />(.*?)'
+        hr_match = re.search(hr_pattern, chat_message, re.DOTALL)
+        clip_hr = chat_message[:hr_match.start()] if hr_match else chat_message
+        raw = f'<div class="raw-message hideM">{escape_markdown(clip_hr)}</div>'
         for non_code, code in zip(non_code_parts, code_blocks + [""]):
             if non_code.strip():
                 result.append(non_code)