feat(ui): support localstorage and get lan from it

src/client/web/src/common/localstorage.ts

@@ -0,0 +1,10 @@
+export class LocalStorage {
+  static get(key: string): string {
+    const val = window.localStorage.getItem(key);
+    return val && val != "undefined" && val != "null" ? val : "";
+  }
+  static set(key: string, val: string): boolean {
+    window.localStorage.setItem(key, val);
+    return true;
+  }
+}

src/client/web/src/components/pane_login.tsx

@@ -82,6 +82,9 @@ export class AuthPane extends React.Component<Props, State, {}> {
       .then(() => {
         this.update(updater().updateBrowser);
         this.update(updater().updateLogin);
+
+        updater().initLan();
+        this.update(updater().updateMsg);
       });
   };
 

src/client/web/src/components/state_updater.ts

@@ -17,9 +17,14 @@ import { UsersClient } from "../client/users";
 import { UploadEntry } from "../worker/interface";
 import { Up } from "../worker/upload_mgr";
 import { alertMsg } from "../common/env";
+import { LocalStorage } from "../common/localstorage";
 
 import { MsgPackage } from "../i18n/msger";
 
+function getCookieLanKey(user: string) {
+  return `qs_${user}_lan`;
+}
+
 export class Updater {
   props: ICoreState;
   private usersClient: IUsersClient = new UsersClient("");
@@ -337,15 +342,25 @@ export class Updater {
     return resp.status === 200;
   };
 
+  initLan = () => {
+    const lanKey = getCookieLanKey(this.props.login.userName);
+    const lanSaved = LocalStorage.get(lanKey);
+    this.setLan(lanSaved === "" ? "en_US" : lanSaved);
+  };
+
   setLan = (lan: string) => {
+    const lanKey = getCookieLanKey(this.props.login.userName);
+
     switch (lan) {
       case "en_US":
         this.props.msg.lan = "en_US";
         this.props.msg.pkg = MsgPackage.get(lan);
+        LocalStorage.set(lanKey, "en_US");
         break;
       case "zh_CN":
         this.props.msg.lan = "zh_CN";
         this.props.msg.pkg = MsgPackage.get(lan);
+        LocalStorage.set(lanKey, "zh_CN");
         break;
       default:
         alertMsg("language package not found");

src/client/web/src/i18n/en_US.ts

@@ -2,7 +2,7 @@ import { Map } from "immutable";
 
 export const msgs: Map<string, string> = Map({
   "stateMgr.cap.fail": "failed to get captcha id",
-  "browser.upload.del.fail": "Failed to delete uploadini item",
+  "browser.upload.del.fail": "Failed to delete uploading item",
   "browser.folder.add.fail": "Folder name can not be empty",
   "browser.del.fail": "Please select file or folder to delete at first",
   "browser.move.fail": "Source directory is same as destination directory",

src/client/web/src/worker/upload_mgr.ts

@@ -25,7 +25,7 @@ export class UploadMgr {
   private intervalID: number;
   private worker: IWorker;
   private infos = OrderedMap<string, UploadEntry>();
-  private statusCb = (infos: Map<string, UploadEntry>): void => {};
+  private statusCb = (infos: Map<string, UploadEntry>, refresh: boolean): void => {};
 
   constructor(worker: IWorker) {
     this.worker = worker;
@@ -88,7 +88,7 @@ export class UploadMgr {
     return this.cycle;
   };
 
-  setStatusCb = (cb: (infos: Map<string, UploadEntry>) => void) => {
+  setStatusCb = (cb: (infos: Map<string, UploadEntry>, refresh: boolean) => void) => {
     this.statusCb = cb;
   };
 
@@ -138,7 +138,7 @@ export class UploadMgr {
         );
       }
     }
-    this.statusCb(this.infos.toMap());
+    this.statusCb(this.infos.toMap(), false);
   };
 
   stop = (filePath: string) => {
@@ -153,13 +153,13 @@ export class UploadMgr {
     } else {
       alert(`failed to stop uploading ${filePath}: not found`);
     }
-    this.statusCb(this.infos.toMap());
+    this.statusCb(this.infos.toMap(), false);
   };
 
   delete = (filePath: string) => {
     this.stop(filePath);
     this.infos = this.infos.delete(filePath);
-    this.statusCb(this.infos.toMap());
+    this.statusCb(this.infos.toMap(), false);
   };
 
   list = (): OrderedMap<string, UploadEntry> => {
@@ -185,6 +185,7 @@ export class UploadMgr {
           console.error(`uploading ${errResp.filePath} may already be deleted`);
         }
 
+        this.statusCb(this.infos.toMap(), false);
         break;
       case uploadInfoKind:
         const infoResp = resp as UploadInfoResp;
@@ -193,6 +194,7 @@ export class UploadMgr {
         if (entry != null) {
           if (infoResp.uploaded === entry.size) {
             this.infos = this.infos.delete(infoResp.filePath);
+            this.statusCb(this.infos.toMap(), true);
           } else {
             this.infos = this.infos.set(infoResp.filePath, {
               ...entry,
@@ -203,6 +205,7 @@ export class UploadMgr {
                   ? UploadState.Stopped
                   : infoResp.state,
             });
+            this.statusCb(this.infos.toMap(), false);
           }
         } else {
           // TODO: refine this
@@ -212,11 +215,11 @@ export class UploadMgr {
             }) infos(${this.infos.toObject()})`
           );
         }
+
         break;
       default:
         console.error(`respHandler: response kind not found: ${resp}`);
     }
-    this.statusCb(this.infos.toMap());
   };
 }