Fix bugs of v0.1.7

components/sidebar.js

@@ -1,17 +1,16 @@
 import createInfoPage from "./info-page.js";
 import getSVG from "../tools/svgs.js";
 import createAccountPage from "./account-page/index.js";
-import switchSelectedPage from '../global/switchPage.js'
 
 const pages = [
     { name: 'chat', svgName: 'chat-dots-fill' },
     // { name: 'model-hero', svgName: 'hero' },
-    { name: 'training' },
+    // { name: 'training' },
     { name: 'account', svgName: 'person-fill', not_page: true },
     { name: 'info', svgName: 'info-circle-fill', not_page: true }
 ]
 
-export default function createSideBar() {
+export default function createSideBar(switchSelectedPage) {
     const sidebar = document.getElementById('sidebar');
 
     sidebar.innerHTML = `

components/training-page/index.js

@@ -1,7 +1,7 @@
 // const dataset_options = []
 // const model_options = []
 
-import { loadDefaultPage } from "../../global/switchPage.js";
+// import { loadDefaultPage } from "../../global/switchPage.js";
 import useUser from "../../global/useUser.js";
 import showMessage from "../../tools/message.js";
 import request from "../../tools/request.js";
@@ -14,7 +14,7 @@ const pages = [
     {index: 'template', title: 'Find Models'},
     {index: 'parameters', title: 'Start Training'},
     {index: 'training-visualization', title: 'Training Visualization'},
-    {index: 'faq', title: 'FAQ'},
+    // {index: 'faq', title: 'FAQ'},
 ]
 
 let  training_page_main, current_page = '',
@@ -51,15 +51,16 @@ function switchPage(page) {
     current_page = page;
 }
 
-let logged_in;
+let logged_in, loadDefaultPage;
 const { componentReMount, componetDismount } = useUser(user=>{
     logged_in = user.logged_in;
     if(!logged_in) {
-        loadDefaultPage();
+        loadDefaultPage && loadDefaultPage();
     }
 })
 
-export default function createTrainingPage() {
+export default function createTrainingPage(load_default_page) {
+    loadDefaultPage = load_default_page;
     componentReMount();
 
     document.getElementById("main").innerHTML = `

index.js

@@ -1,8 +1,53 @@
 import createSideBar from "./components/sidebar.js";
-import { loadDefaultPage } from "./global/switchPage.js";
+import createChatPage from "../components/chat-page/index.js";
+import createTrainingPage from "../components/training-page/index.js";
+import useUser from "../global/useUser.js";
+import showMessage from "../tools/message.js";
+import createAccountPage from "../components/account-page/index.js";
+
+let last_selected_page = '';
+let componetDismount = null;
+
+let logged_in = false;
+useUser(user=>{
+    logged_in = user.logged_in;
+})
+
+function switchSelectedPage(page) {
+    if(page === last_selected_page) return;
+    if(!logged_in) {
+        if(/^(training)$/.test(page)) {
+            showMessage('Please login to use this function.', { type: 'warn' });
+            createAccountPage();
+            return;
+        }
+    }
+
+    document.getElementById('main').innerHTML = '';
+    componetDismount && componetDismount();
+    componetDismount = null;
+
+    switch(page) {
+        case 'training':
+            componetDismount = createTrainingPage(loadDefaultPage);
+            break;
+        case 'chat': default:
+            componetDismount = createChatPage();
+            break;
+    }
+
+    // change side-bar icon class
+    document.getElementById(`sidebar-icon-${page}`).classList.add('selected');
+    last_selected_page && document.getElementById(`sidebar-icon-${last_selected_page}`).classList.remove('selected');
+    last_selected_page = page;
+}
+
+function loadDefaultPage() {
+    switchSelectedPage('chat');
+}
 
 function build() {
-    createSideBar();
+    createSideBar(switchSelectedPage);
     loadDefaultPage();
 }
 

nginx/default.conf

@@ -13,9 +13,9 @@ server {
                 proxy_pass http://kirin/api;
         }
 
-        location /training-visualization {
-                proxy_pass http://yeager/;
-        }
+        # location /training-visualization {
+        #         proxy_pass http://yeager/;
+        # }
 
         location / {
                 root /usr/share/nginx/html;

settings.js

@@ -1,2 +1,2 @@
-export const VERSION = '0.1.7'
+export const VERSION = '0.1.8'
 export const API_ADDRESS = '/api'

tools/conversationFormat.js

@@ -49,6 +49,9 @@ export function formatMarkdown(str, target_elem, pending_elem, end_special_block
                 case 'inline-code': 
                     plain_text_elems.push(createElement('span', group_1 || group_2, { className: 'inline-code' }))
                     break;
+                case 'hyperlink':
+                    plain_text_elems.push(createElement('a', group_1, { href: group_2, target: '_blank' }))
+                    break;
                 default:
                     return '';
             }
@@ -93,6 +96,7 @@ export function formatMarkdown(str, target_elem, pending_elem, end_special_block
             .replaceAll(/__(.+?)__/g, parseSingleLine('italic'))
             .replaceAll(/^(\*|-){3,}$/g, parseSingleLine('hr'))
             .replaceAll(/``(.+?)``|`(.+?)`/g, parseSingleLine('inline-code'))
+            .replaceAll(/\[([^\]]*)\]\(([^)]*)\)/g, parseSingleLine('hyperlink'))
             .replace(/<\|end\|>$/, '');
 
             const block = document.createElement('div');

tools/message.js

@@ -17,9 +17,7 @@ message_dialog.show();
  * Display a notification with given type on top-right corner
  * @param {String | any[]} message 
  *  The message to show, can be a `string` or an array with `string` or/and `HTMLElement`.  
- *  **Note:**  
-    *  If pass a `string`, it will be parsed to HTML;  
-    *  If pass an `array` with `string`, strings in that array won't be parsed.
+ *  **Note:** `string` will not be parsed, please add `HTMLElement` if you want to output html format.
  * @param {messageOptions} options - Options of showing messages
  */
 export default function showMessage(message, options = {}) {
@@ -46,11 +44,10 @@ export default function showMessage(message, options = {}) {
     const message_text = document.createElement('div');
     message_text.className = 'message-text';
     message_elem.appendChild(message_text);
-    if(typeof message === 'string') {
-        message_text.innerHTML = message;
-    } else if(Array.isArray(message)) {
-        message_text.append(...message);
+    if(!Array.isArray(message)) {
+        message = [message]
     }
+    message_text.append(...message);
 
     message_elem.style.animationDuration = `${animation_duration}ms`
     message_dialog.appendChild(message_elem);

tools/validators.js

@@ -4,7 +4,7 @@ export const username_not_valid = 'Username should includes only letters, number
 
 export function validateEmail(string) {
     return (
-        /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(string)
+        /^[a-zA-Z0-9_-][.a-zA-Z0-9_-]+[a-zA-Z0-9_-]@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(string)
     )
 }