From de3394ba9b7ea8e3c256593571fd5852a4a027c7 Mon Sep 17 00:00:00 2001 From: hexxa Date: Sat, 26 Mar 2022 14:12:19 +0800 Subject: [PATCH] fix(fe/env): enable WebEnv interface and fix alert bugs --- src/client/web/src/common/env.ts | 41 +++++++++----- .../web/src/components/control/tabs.tsx | 7 +-- src/client/web/src/components/layers.tsx | 1 - src/client/web/src/components/pane_admin.tsx | 56 +++++++++---------- src/client/web/src/components/pane_login.tsx | 10 ++-- .../web/src/components/pane_settings.tsx | 30 +++++----- src/client/web/src/components/panel_files.tsx | 44 +++++++-------- .../web/src/components/panel_sharings.tsx | 6 +- .../web/src/components/panel_uploadings.tsx | 4 +- src/client/web/src/components/state_mgr.tsx | 4 +- .../web/src/components/state_updater.ts | 10 ++-- src/client/web/src/components/topbar.tsx | 8 +-- src/client/web/src/test/helpers.ts | 13 ++++- 13 files changed, 128 insertions(+), 106 deletions(-) diff --git a/src/client/web/src/common/env.ts b/src/client/web/src/common/env.ts index 732a50b..90a1fbf 100644 --- a/src/client/web/src/common/env.ts +++ b/src/client/web/src/common/env.ts @@ -1,16 +1,31 @@ -export function alertMsg(msg: string) { - if (alert != null) { - alert(msg); - } else { - console.log(msg); - } +export class WebEnv { + constructor() {} + + alertMsg = (msg: string) => { + if (alert != null) { + alert(msg); + } else { + console.log(msg); + } + }; + + confirmMsg = (msg: string): boolean => { + if (confirm != null) { + return confirm(msg); + } else { + console.warn(`${msg}: return yes (confirm is not implemented)`); + return true; + } + }; } -export function confirmMsg(msg: string): boolean { - if (confirm != null) { - return confirm(msg); - } else { - console.warn(`${msg}: return yes (confirm is not implemented)`); - return true; - } +export interface IEnv { + alertMsg: (msg: string) => void; + confirmMsg: (msg: string) => boolean; } + +let env = new WebEnv(); +export const Env = (): IEnv => env; +export const SetEnv = (expectedEnv: IEnv) => { + env = expectedEnv; +}; diff --git a/src/client/web/src/components/control/tabs.tsx b/src/client/web/src/components/control/tabs.tsx index 3125347..1cf8977 100644 --- a/src/client/web/src/components/control/tabs.tsx +++ b/src/client/web/src/components/control/tabs.tsx @@ -1,10 +1,9 @@ import * as React from "react"; -import { List, Map } from "immutable"; +import { Map } from "immutable"; import { updater } from "../state_updater"; -import { Flexbox } from "../layout/flexbox"; import { ICoreState, MsgProps, UIProps } from "../core_state"; -import { alertMsg } from "../../common/env"; +import { Env } from "../../common/env"; import { IconProps, getIcon } from "../visual/icons"; import { colorClass } from "../visual/colors"; @@ -31,7 +30,7 @@ export class Tabs extends React.Component { setTab = (targetControl: string, targetOption: string) => { if (!updater().setControlOption(targetControl, targetOption)) { - alertMsg(this.props.msg.pkg.get("op.fail")); + Env().alertMsg(this.props.msg.pkg.get("op.fail")); } this.props.update(updater().updateUI); }; diff --git a/src/client/web/src/components/layers.tsx b/src/client/web/src/components/layers.tsx index b304c14..1240684 100644 --- a/src/client/web/src/components/layers.tsx +++ b/src/client/web/src/components/layers.tsx @@ -8,7 +8,6 @@ import { SettingsDialog } from "./dialog_settings"; import { AuthPane, LoginProps } from "./pane_login"; import { FilesProps } from "./panel_files"; -import { Flexbox } from "./layout/flexbox"; import { Container } from "./layout/container"; import { settingsDialogCtrl, diff --git a/src/client/web/src/components/pane_admin.tsx b/src/client/web/src/components/pane_admin.tsx index f053191..1d32ed0 100644 --- a/src/client/web/src/components/pane_admin.tsx +++ b/src/client/web/src/components/pane_admin.tsx @@ -4,7 +4,7 @@ import FileSize from "filesize"; import { RiMenuUnfoldFill } from "@react-icons/all-files/ri/RiMenuUnfoldFill"; -import { alertMsg, confirmMsg } from "../common/env"; +import { Env } from "../common/env"; import { ICoreState, MsgProps, UIProps } from "./core_state"; import { User, Quota } from "../client"; import { updater } from "./state_updater"; @@ -115,19 +115,19 @@ export class UserForm extends React.Component< }; resetUsedSpace = async (userID: string) => { - if (!confirmMsg(this.props.msg.pkg.get("confirm.resetUsedSpace"))) { + if (!Env().confirmMsg(this.props.msg.pkg.get("confirm.resetUsedSpace"))) { return; } const status = await updater().resetUsedSpace(userID); if (status !== "") { - alertMsg(this.props.msg.pkg.get("resetUsedSpace")); + Env().alertMsg(this.props.msg.pkg.get("resetUsedSpace")); } }; setPwd = async () => { if (this.state.newPwd1 !== this.state.newPwd2) { - alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); + Env().alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); return; } @@ -138,10 +138,10 @@ export class UserForm extends React.Component< this.state.newPwd1 ); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } - alertMsg(this.props.msg.pkg.get("update.ok")); + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { this.setLoading(false); } @@ -156,17 +156,17 @@ export class UserForm extends React.Component< this.state.quota ); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } const listStatus = await updater().listUsers(); if (listStatus !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } - alertMsg(this.props.msg.pkg.get("update.ok")); + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { this.props.update(updater().updateAdmin); this.setLoading(false); @@ -174,7 +174,7 @@ export class UserForm extends React.Component< }; delUser = async () => { - if (!confirmMsg(this.props.msg.pkg.get("op.confirm"))) { + if (!Env().confirmMsg(this.props.msg.pkg.get("op.confirm"))) { return; } @@ -182,17 +182,17 @@ export class UserForm extends React.Component< try { const status = await updater().delUser(this.state.id); if (status !== "") { - alertMsg(this.props.msg.pkg.get("delete.fail")); + Env().alertMsg(this.props.msg.pkg.get("delete.fail")); return; } const listStatus = await updater().listUsers(); if (listStatus !== "") { - alertMsg(this.props.msg.pkg.get("op.fail")); + Env().alertMsg(this.props.msg.pkg.get("op.fail")); return; } - alertMsg(this.props.msg.pkg.get("delete.ok")); + Env().alertMsg(this.props.msg.pkg.get("delete.ok")); } finally { this.props.update(updater().updateAdmin); this.setLoading(false); @@ -446,17 +446,17 @@ export class AdminPane extends React.Component { try { const status = await updater().addRole(this.state.newRole); if (status !== "") { - alertMsg(this.props.msg.pkg.get("add.fail")); + Env().alertMsg(this.props.msg.pkg.get("add.fail")); return; } const listStatus = await updater().listRoles(); if (listStatus !== "") { - alertMsg(this.props.msg.pkg.get("add.fail")); + Env().alertMsg(this.props.msg.pkg.get("add.fail")); return; } - alertMsg(this.props.msg.pkg.get("add.ok")); + Env().alertMsg(this.props.msg.pkg.get("add.ok")); } finally { this.props.update(updater().updateAdmin); this.setLoading(false); @@ -464,7 +464,7 @@ export class AdminPane extends React.Component { }; delRole = async (role: string) => { - if (!confirmMsg(this.props.msg.pkg.get("role.delete.warning"))) { + if (!Env().confirmMsg(this.props.msg.pkg.get("role.delete.warning"))) { return; } @@ -479,7 +479,7 @@ export class AdminPane extends React.Component { const listStatus = await updater().listRoles(); if (listStatus !== "") { - alertMsg(this.props.msg.pkg.get("add.fail")); + Env().alertMsg(this.props.msg.pkg.get("add.fail")); return; } @@ -492,7 +492,7 @@ export class AdminPane extends React.Component { addUser = async () => { if (this.state.newUserPwd1 !== this.state.newUserPwd2) { - alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); + Env().alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); return; } @@ -509,17 +509,17 @@ export class AdminPane extends React.Component { preferences: undefined, }); if (status !== "") { - alertMsg(this.props.msg.pkg.get("add.fail")); + Env().alertMsg(this.props.msg.pkg.get("add.fail")); return; } const listStatus = await updater().listUsers(); if (listStatus !== "") { - alertMsg(this.props.msg.pkg.get("op.fail")); + Env().alertMsg(this.props.msg.pkg.get("op.fail")); return; } - alertMsg(this.props.msg.pkg.get("add.ok")); + Env().alertMsg(this.props.msg.pkg.get("add.ok")); } finally { this.setState({ newUserName: "", @@ -773,7 +773,7 @@ export class BgCfg extends React.Component { setClientCfg = async () => { const bgURL = this.props.ui.bg.url; if (bgURL.length >= 4096) { - alertMsg(this.props.msg.pkg.get("bg.url.alert")); + Env().alertMsg(this.props.msg.pkg.get("bg.url.alert")); return; } @@ -786,7 +786,7 @@ export class BgCfg extends React.Component { bgRepeat !== "round" && bgRepeat !== "no-repeat" ) { - alertMsg(this.props.msg.pkg.get("bg.repeat.alert")); + Env().alertMsg(this.props.msg.pkg.get("bg.repeat.alert")); return; } @@ -798,13 +798,13 @@ export class BgCfg extends React.Component { bgPos !== "right" && bgPos !== "center" ) { - alertMsg(this.props.msg.pkg.get("bg.pos.alert")); + Env().alertMsg(this.props.msg.pkg.get("bg.pos.alert")); return; } const bgAlign = this.props.ui.bg.align; if (bgAlign !== "scroll" && bgAlign !== "fixed" && bgAlign !== "local") { - alertMsg(this.props.msg.pkg.get("bg.align.alert")); + Env().alertMsg(this.props.msg.pkg.get("bg.align.alert")); return; } @@ -817,11 +817,11 @@ export class BgCfg extends React.Component { bg: this.props.ui.bg, }); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } - alertMsg(this.props.msg.pkg.get("update.ok")); + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { this.setLoading(false); } diff --git a/src/client/web/src/components/pane_login.tsx b/src/client/web/src/components/pane_login.tsx index 84445bb..941c5b6 100644 --- a/src/client/web/src/components/pane_login.tsx +++ b/src/client/web/src/components/pane_login.tsx @@ -1,10 +1,10 @@ import * as React from "react"; -import { List, Map } from "immutable"; +import { List } from "immutable"; import { ICoreState, MsgProps, UIProps } from "./core_state"; import { Flexbox } from "./layout/flexbox"; import { updater } from "./state_updater"; -import { alertMsg } from "../common/env"; +import { Env } from "../common/env"; import { Quota, Preferences } from "../client"; import { getErrMsg } from "../common/utils"; import { ctrlOn, ctrlOff, loadingCtrl } from "../common/controls"; @@ -95,7 +95,7 @@ export class AuthPane extends React.Component { this.state.captchaInput ); if (loginStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", loginStatus.toString()) ); return; @@ -104,7 +104,7 @@ export class AuthPane extends React.Component { const params = new URLSearchParams(document.location.search.substring(1)); const initStatus = await updater().initAll(params); if (initStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", initStatus.toString()) ); } @@ -121,7 +121,7 @@ export class AuthPane extends React.Component { refreshCaptcha = async () => { const status = await updater().getCaptchaID(); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); } else { this.props.update(updater().updateLogin); } diff --git a/src/client/web/src/components/pane_settings.tsx b/src/client/web/src/components/pane_settings.tsx index 2091895..d6b5cdc 100644 --- a/src/client/web/src/components/pane_settings.tsx +++ b/src/client/web/src/components/pane_settings.tsx @@ -6,7 +6,7 @@ import { ICoreState, UIProps, MsgProps } from "./core_state"; import { LoginProps } from "./pane_login"; import { Flexbox } from "./layout/flexbox"; import { updater } from "./state_updater"; -import { alertMsg, confirmMsg } from "../common/env"; +import { Env } from "../common/env"; import { Container } from "./layout/container"; import { Card } from "./layout/card"; import { Rows } from "./layout/rows"; @@ -103,10 +103,10 @@ export class PaneSettings extends React.Component { try { const status = await updater().syncPreferences(); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } - alertMsg(this.props.msg.pkg.get("update.ok")); + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { this.setLoading(false); } @@ -114,17 +114,17 @@ export class PaneSettings extends React.Component { setPwd = async (): Promise => { if (this.state.newPwd1 !== this.state.newPwd2) { - alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); + Env().alertMsg(this.props.msg.pkg.get("settings.pwd.notSame")); return; } else if ( this.state.oldPwd == "" || this.state.newPwd1 == "" || this.state.newPwd2 == "" ) { - alertMsg(this.props.msg.pkg.get("settings.pwd.empty")); + Env().alertMsg(this.props.msg.pkg.get("settings.pwd.empty")); return; } else if (this.state.oldPwd == this.state.newPwd1) { - alertMsg(this.props.msg.pkg.get("settings.pwd.notChanged")); + Env().alertMsg(this.props.msg.pkg.get("settings.pwd.notChanged")); return; } @@ -135,11 +135,11 @@ export class PaneSettings extends React.Component { this.state.newPwd1 ); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); return; } - alertMsg(this.props.msg.pkg.get("update.ok")); + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { this.setState({ oldPwd: "", @@ -155,10 +155,11 @@ export class PaneSettings extends React.Component { try { const status = await updater().syncPreferences(); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); + return; } + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { - alertMsg(this.props.msg.pkg.get("update.ok")); this.props.update(updater().updateMsg); } }; @@ -168,22 +169,23 @@ export class PaneSettings extends React.Component { try { const status = await updater().syncPreferences(); if (status !== "") { - alertMsg(this.props.msg.pkg.get("update.fail")); + Env().alertMsg(this.props.msg.pkg.get("update.fail")); + return; } + Env().alertMsg(this.props.msg.pkg.get("update.ok")); } finally { - alertMsg(this.props.msg.pkg.get("update.ok")); this.props.update(updater().updateUI); } }; truncateErrors = () => { - if (confirmMsg(this.props.msg.pkg.get("op.confirm"))) { + if (Env().confirmMsg(this.props.msg.pkg.get("op.confirm"))) { ErrorLogger().truncate(); } }; reportErrors = () => { - if (confirmMsg(this.props.msg.pkg.get("op.confirm"))) { + if (Env().confirmMsg(this.props.msg.pkg.get("op.confirm"))) { ErrorLogger().report(); } }; diff --git a/src/client/web/src/components/panel_files.tsx b/src/client/web/src/components/panel_files.tsx index eebc69c..6fc673d 100644 --- a/src/client/web/src/components/panel_files.tsx +++ b/src/client/web/src/components/panel_files.tsx @@ -11,7 +11,7 @@ import { RiRestartFill } from "@react-icons/all-files/ri/RiRestartFill"; import { RiCheckboxBlankLine } from "@react-icons/all-files/ri/RiCheckboxBlankLine"; import { ErrorLogger } from "../common/log_error"; -import { alertMsg, confirmMsg } from "../common/env"; +import { Env } from "../common/env"; import { getErrMsg } from "../common/utils"; import { updater } from "./state_updater"; import { ICoreState, MsgProps, UIProps } from "./core_state"; @@ -147,7 +147,7 @@ export class FilesPanel extends React.Component { // refresh used space const status = await updater().self(); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); return; } this.props.update(updater().updateLogin); @@ -157,7 +157,7 @@ export class FilesPanel extends React.Component { addUploads = (event: React.ChangeEvent) => { if (event.target.files.length > 200) { - alertMsg(this.props.msg.pkg.get("err.tooManyUploads")); + Env().alertMsg(this.props.msg.pkg.get("err.tooManyUploads")); return; } @@ -168,14 +168,14 @@ export class FilesPanel extends React.Component { const status = updater().addUploads(fileList); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "upload.add.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "upload.add.fail", status)); } this.props.update(updater().updateUploadingsInfo); }; mkDir = async () => { if (this.state.newFolderName === "") { - alertMsg(this.props.msg.pkg.get("browser.folder.add.fail")); + Env().alertMsg(this.props.msg.pkg.get("browser.folder.add.fail")); return; } @@ -189,7 +189,7 @@ export class FilesPanel extends React.Component { try { const mkDirStatus = await updater().mkDir(dirPath); if (mkDirStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", mkDirStatus.toString()) ); return; @@ -199,7 +199,7 @@ export class FilesPanel extends React.Component { this.props.filesInfo.dirPath ); if (setItemsStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", setItemsStatus.toString()) ); return; @@ -220,7 +220,7 @@ export class FilesPanel extends React.Component { // TODO: selected should be cleaned after change the cwd if (this.props.filesInfo.dirPath.join("/") !== this.state.selectedSrc) { - alertMsg(this.props.msg.pkg.get("browser.del.fail")); + Env().alertMsg(this.props.msg.pkg.get("browser.del.fail")); this.setState({ selectedSrc: this.props.filesInfo.dirPath.join("/"), selectedItems: Map(), @@ -229,7 +229,7 @@ export class FilesPanel extends React.Component { } else { const filesToDel = this.state.selectedItems.keySeq().join(", "); if ( - !confirmMsg( + !Env().confirmMsg( `${this.props.msg.pkg.get("op.confirm")} [${ this.state.selectedItems.size }]: ${filesToDel}` @@ -248,7 +248,7 @@ export class FilesPanel extends React.Component { this.state.selectedItems ); if (deleteStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", deleteStatus.toString()) ); return deleteStatus; @@ -256,7 +256,7 @@ export class FilesPanel extends React.Component { const selfStatus = await updater().self(); if (selfStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", selfStatus.toString()) ); return selfStatus; @@ -282,7 +282,7 @@ export class FilesPanel extends React.Component { const oldDir = this.state.selectedSrc; const newDir = this.props.filesInfo.dirPath.join("/"); if (oldDir === newDir) { - alertMsg(this.props.msg.pkg.get("browser.move.fail")); + Env().alertMsg(this.props.msg.pkg.get("browser.move.fail")); return; } @@ -295,7 +295,7 @@ export class FilesPanel extends React.Component { this.state.selectedItems ); if (moveStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", moveStatus.toString()) ); return; @@ -322,7 +322,7 @@ export class FilesPanel extends React.Component { try { const status = await updater().setHomeItems(); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); return; } this.props.update(updater().updateFilesInfo); @@ -335,7 +335,7 @@ export class FilesPanel extends React.Component { if (dirPath === this.props.filesInfo.dirPath) { return; } else if (this.props.login.userRole !== roleAdmin && dirPath.size <= 1) { - alertMsg(this.props.msg.pkg.get("unauthed")); + Env().alertMsg(this.props.msg.pkg.get("unauthed")); return; } @@ -343,13 +343,13 @@ export class FilesPanel extends React.Component { try { const status = await updater().setItems(dirPath); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); return; } const isSharingStatus = await updater().syncIsSharing(dirPath.join("/")); if (isSharingStatus !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", isSharingStatus)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", isSharingStatus)); return; } @@ -402,7 +402,7 @@ export class FilesPanel extends React.Component { }; generateHash = async (filePath: string) => { - alertMsg(this.props.msg.pkg.get("refresh-hint")); + Env().alertMsg(this.props.msg.pkg.get("refresh-hint")); updater().generateHash(filePath); }; @@ -412,7 +412,7 @@ export class FilesPanel extends React.Component { try { const addStatus = await updater().addSharing(); if (addStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", addStatus.toString()) ); return; @@ -421,7 +421,7 @@ export class FilesPanel extends React.Component { updater().setSharing(true); const listStatus = await updater().listSharings(); if (listStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", listStatus.toString()) ); return; @@ -440,7 +440,7 @@ export class FilesPanel extends React.Component { try { const delStatus = await updater().deleteSharing(dirPath); if (delStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", delStatus.toString()) ); return; @@ -449,7 +449,7 @@ export class FilesPanel extends React.Component { updater().setSharing(false); const listStatus = await updater().listSharings(); if (listStatus !== "") { - alertMsg( + Env().alertMsg( getErrMsg(this.props.msg.pkg, "op.fail", listStatus.toString()) ); return; diff --git a/src/client/web/src/components/panel_sharings.tsx b/src/client/web/src/components/panel_sharings.tsx index 9ef5b49..586743d 100644 --- a/src/client/web/src/components/panel_sharings.tsx +++ b/src/client/web/src/components/panel_sharings.tsx @@ -4,7 +4,7 @@ import { List, Map } from "immutable"; import { BtnList } from "./control/btn_list"; import { QRCodeIcon } from "./visual/qrcode"; import { getErrMsg } from "../common/utils"; -import { alertMsg } from "../common/env"; +import { Env } from "../common/env"; import { updater } from "./state_updater"; import { ICoreState, MsgProps, UIProps } from "./core_state"; import { LoginProps } from "./pane_login"; @@ -68,7 +68,7 @@ export class SharingsPanel extends React.Component { await this.listSharings(); } catch (e: any) { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); } finally { this.setLoading(false); } @@ -79,7 +79,7 @@ export class SharingsPanel extends React.Component { try { const status = await updater().listSharings(); if (status !== "") { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status)); } this.props.update(updater().updateFilesInfo); this.props.update(updater().updateSharingsInfo); diff --git a/src/client/web/src/components/panel_uploadings.tsx b/src/client/web/src/components/panel_uploadings.tsx index 4f7118a..b51681c 100644 --- a/src/client/web/src/components/panel_uploadings.tsx +++ b/src/client/web/src/components/panel_uploadings.tsx @@ -3,7 +3,7 @@ import { List } from "immutable"; import FileSize from "filesize"; import { BtnList } from "./control/btn_list"; -import { alertMsg } from "../common/env"; +import { Env } from "../common/env"; import { getErrMsg } from "../common/utils"; import { updater } from "./state_updater"; import { ICoreState, MsgProps, UIProps } from "./core_state"; @@ -72,7 +72,7 @@ export class UploadingsPanel extends React.Component { this.props.update(updater().updateLogin); this.props.update(updater().updateUploadingsInfo); } catch (status: any) { - alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status.toString())); + Env().alertMsg(getErrMsg(this.props.msg.pkg, "op.fail", status.toString())); } finally { this.setLoading(false); } diff --git a/src/client/web/src/components/state_mgr.tsx b/src/client/web/src/components/state_mgr.tsx index bfe8dbf..5bee5d6 100644 --- a/src/client/web/src/components/state_mgr.tsx +++ b/src/client/web/src/components/state_mgr.tsx @@ -4,7 +4,7 @@ import { initUploadMgr } from "../worker/upload_mgr"; import BgWorker from "../worker/upload.bg.worker"; import { FgWorker } from "../worker/upload.fg.worker"; -import { alertMsg } from "../common/env"; +import { Env } from "../common/env"; import { getErrMsg } from "../common/utils"; import { updater } from "./state_updater"; import { ICoreState, newState } from "./core_state"; @@ -82,7 +82,7 @@ export class StateMgr extends React.Component { const status = await updater().initAll(query); if (status !== "") { - alertMsg(getErrMsg(state.msg.pkg, "op.fail", status)); + Env().alertMsg(getErrMsg(state.msg.pkg, "op.fail", status)); } updater().setControlOption(loadingCtrl, ctrlOff); this.update(updater().updateAll); diff --git a/src/client/web/src/components/state_updater.ts b/src/client/web/src/components/state_updater.ts index c30d8f9..1f7514e 100644 --- a/src/client/web/src/components/state_updater.ts +++ b/src/client/web/src/components/state_updater.ts @@ -25,7 +25,7 @@ import { UsersClient } from "../client/users"; import { SettingsClient } from "../client/settings"; import { UploadEntry, UploadState } from "../worker/interface"; import { Up } from "../worker/upload_mgr"; -import { alertMsg } from "../common/env"; +import { Env } from "../common/env"; import { controlName as panelTabs } from "./root_frame"; import { errServer } from "../common/errors"; import { ErrorLogger } from "../common/log_error"; @@ -201,7 +201,7 @@ export class Updater { mkDir = async (dirPath: string): Promise => { const resp = await this.filesClient.mkdir(dirPath); if (resp.status !== 200) { - alertMsg(`failed to make dir ${dirPath}`); + Env().alertMsg(`failed to make dir ${dirPath}`); return errServer; } return ""; @@ -244,7 +244,7 @@ export class Updater { } if (fails.size > 0) { - alertMsg( + Env().alertMsg( `${this.props.msg.pkg.get("delete.fail")}: ${fails.join(",\n")}` ); return errServer; @@ -340,7 +340,7 @@ export class Updater { } if (fails.size > 0) { - alertMsg(`${this.props.msg.pkg.get("move.fail")}: ${fails.join(",\n")}`); + Env().alertMsg(`${this.props.msg.pkg.get("move.fail")}: ${fails.join(",\n")}`); return errServer; } @@ -781,7 +781,7 @@ export class Updater { this.props.login.preferences.lan = "zh_CN"; break; default: - alertMsg("language package not found"); + Env().alertMsg("language package not found"); } }; diff --git a/src/client/web/src/components/topbar.tsx b/src/client/web/src/components/topbar.tsx index 94ab297..938c1b4 100644 --- a/src/client/web/src/components/topbar.tsx +++ b/src/client/web/src/components/topbar.tsx @@ -1,7 +1,7 @@ import * as React from "react"; import { List } from "immutable"; -import { alertMsg, confirmMsg } from "../common/env"; +import { Env } from "../common/env"; import { ICoreState, MsgProps, UIProps } from "./core_state"; import { LoginProps } from "./pane_login"; import { updater } from "./state_updater"; @@ -28,20 +28,20 @@ export class TopBar extends React.Component { }; logout = async (): Promise => { - if (!confirmMsg(this.props.msg.pkg.get("logout.confirm"))) { + if (!Env().confirmMsg(this.props.msg.pkg.get("logout.confirm"))) { return; } const status = await updater().logout(); if (status !== "") { - alertMsg(this.props.msg.pkg.get("login.logout.fail")); + Env().alertMsg(this.props.msg.pkg.get("login.logout.fail")); return; } const params = new URLSearchParams(document.location.search.substring(1)); const initStatus = await updater().initAll(params); if (initStatus !== "") { - alertMsg(this.props.msg.pkg.get("op.fail")); + Env().alertMsg(this.props.msg.pkg.get("op.fail")); return; } this.props.update(updater().updateAll); diff --git a/src/client/web/src/test/helpers.ts b/src/client/web/src/test/helpers.ts index d0dd165..384fa4d 100644 --- a/src/client/web/src/test/helpers.ts +++ b/src/client/web/src/test/helpers.ts @@ -37,9 +37,9 @@ export function mockRandFile(filePath: string): File { } export function mockFileList(filePaths: Array): List { - const files = filePaths.map(filePath => { + const files = filePaths.map((filePath) => { return mockRandFile(filePath); - }) + }); return List(files); } @@ -47,4 +47,11 @@ export function initMockWorker() { const mockWorkerClass = mock(MockWorker); const mockWorker = instance(mockWorkerClass); initUploadMgr(mockWorker); -} \ No newline at end of file +} + +export class MockWebEnv { + constructor() {} + + alertMsg = jest.fn(); + confirmMsg = jest.fn(); +}