fix(panes): remove panes

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

@@ -83,12 +83,6 @@ describe("Login", () => {
       },
     });
 
-    // panes
-    expect(updater().props.panes).toEqual({
-      displaying: "",
-      paneNames: Set(["settings", "login", "admin"]),
-    });
-
     // admin
     let usersMap = Map({});
     usersResps.listUsersMockResp.data.users.forEach((user: User) => {

src/client/web/src/components/__test__/panes.test.tsx

@@ -1,34 +0,0 @@
-import { mock, instance } from "ts-mockito";
-
-import { Panes } from "../panes";
-import { ICoreState, newState } from "../core_state";
-import { initUploadMgr } from "../../worker/upload_mgr";
-import { updater } from "../state_updater";
-import { MockWorker } from "../../worker/interface";
-
-describe("Panes", () => {
-  test("closePane", async () => {
-    const mockWorkerClass = mock(MockWorker);
-    const mockWorker = instance(mockWorkerClass);
-    initUploadMgr(mockWorker);
-
-    const coreState = newState();
-    const panes = new Panes({
-      panes: coreState.panes,
-      admin: coreState.admin,
-      login: coreState.login,
-      ui: coreState.ui,
-      msg: coreState.msg,
-      update: (updater: (prevState: ICoreState) => ICoreState) => {},
-    });
-
-    updater().init(coreState);
-
-    panes.closePane();
-
-    expect(updater().props.panes).toEqual({
-      displaying: "",
-      paneNames: coreState.panes.paneNames,
-    });
-  });
-});

src/client/web/src/components/__test__/state_mgr.test.tsx

@@ -64,12 +64,6 @@ describe("State Manager", () => {
       List(filesResps.listHomeMockResp.data.metadatas)
     );
 
-    // panes
-    expect(coreState.panes).toEqual({
-      displaying: "",
-      paneNames: Set(["settings", "login", "admin"]),
-    });
-
     // login
     expect(coreState.login).toEqual({
       userID: "0",
@@ -181,12 +175,6 @@ describe("State Manager", () => {
     expect(coreState.sharingsInfo.sharings).toEqual(List([]));
     expect(coreState.uploadingsInfo.uploadings).toEqual(List<UploadEntry>([]));
 
-    // panes
-    expect(coreState.panes).toEqual({
-      displaying: "",
-      paneNames: Set(["login"]),
-    });
-
     // login
     expect(coreState.login).toEqual({
       userID: mockSelfResp.data.id,

src/client/web/src/components/__test__/topbar.test.tsx

@@ -85,7 +85,6 @@ describe("TopBar", () => {
 
     const topbar = new TopBar({
       login: coreState.login,
-      panes: coreState.panes,
       msg: coreState.msg,
       update: (updater: (prevState: ICoreState) => ICoreState) => { },
     });
@@ -99,12 +98,6 @@ describe("TopBar", () => {
     expect(coreState.sharingsInfo.sharings).toEqual(List());
     expect(coreState.uploadingsInfo.uploadings).toEqual(List<UploadEntry>());
 
-    // panes
-    expect(coreState.panes).toEqual({
-      displaying: "login",
-      paneNames: Set(["login"]),
-    });
-
     // login
     expect(coreState.login).toEqual({
       userID: visitorID,

src/client/web/src/components/core_state.ts

@@ -8,7 +8,6 @@ import { UploadingsProps } from "./panel_uploadings";
 import { SharingsProps } from "./panel_sharings";
 import { controlName as panelTabs } from "./root_frame";
 import { settingsTabsCtrl } from "./dialog_settings";
-import { PanesProps } from "./panes";
 import { LoginProps } from "./pane_login";
 import { AdminProps } from "./pane_admin";
 import { MsgPackage } from "../i18n/msger";
@@ -40,7 +39,6 @@ export interface ICoreState {
   sharingsInfo: SharingsProps;
   admin: AdminProps;
   login: LoginProps;
-  panes: PanesProps;
   ui: UIProps;
   msg: MsgProps;
 }
@@ -63,12 +61,6 @@ export function initState(): ICoreState {
     sharingsInfo: {
       sharings: List<string>([]),
     },
-    panes: {
-      // which pane is displaying
-      displaying: "",
-      // which panes can be displayed
-      paneNames: Set<string>([]), // "settings", "login", "admin"
-    },
     login: {
       userID: "",
       userName: "",

src/client/web/src/components/layers.tsx

@@ -1,9 +1,8 @@
 import * as React from "react";
-import { Set, List } from "immutable";
+import { List } from "immutable";
 
 import { updater } from "./state_updater";
 import { ICoreState, MsgProps, UIProps } from "./core_state";
-// import { PaneSettings } from "./pane_settings";
 import { AdminProps } from "./pane_admin";
 import { SettingsDialog } from "./dialog_settings";
 
@@ -36,7 +35,7 @@ export class Layers extends React.Component<Props, State, {}> {
   render() {
     const showLogin = this.props.login.authed ? "hidden" : "";
     const showSettings =
-      this.props.ui.control.controls.get("settingsDialog") == "on"
+      this.props.ui.control.controls.get("settingsDialog") === "on"
         ? ""
         : "hidden";
 

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

@@ -79,7 +79,6 @@ export class AuthPane extends React.Component<Props, State, {}> {
         this.update(updater().updateUploadingsInfo);
         this.update(updater().updateSharingsInfo);
         this.update(updater().updateLogin);
-        this.update(updater().updatePanes);
         this.update(updater().updateAdmin);
         this.update(updater().updateUI);
         this.update(updater().updateMsg);

src/client/web/src/components/panes.tsx

@@ -1,100 +0,0 @@
-import * as React from "react";
-import { Set, List } from "immutable";
-
-import { updater } from "./state_updater";
-import { Flexbox } from "./layout/flexbox";
-import { ICoreState, MsgProps, UIProps } from "./core_state";
-import { PaneSettings } from "./pane_settings";
-import { AdminPane, AdminProps } from "./pane_admin";
-import { AuthPane, LoginProps } from "./pane_login";
-
-export interface PanesProps {
-  displaying: string;
-  paneNames: Set<string>;
-}
-export interface Props {
-  panes: PanesProps;
-  login: LoginProps;
-  admin: AdminProps;
-  ui: UIProps;
-  msg: MsgProps;
-  update?: (updater: (prevState: ICoreState) => ICoreState) => void;
-}
-
-export interface State {}
-export class Panes extends React.Component<Props, State, {}> {
-  constructor(p: Props) {
-    super(p);
-  }
-
-  closePane = () => {
-    if (this.props.panes.displaying !== "login") {
-      updater().displayPane("");
-      this.props.update(updater().updatePanes);
-    }
-  };
-
-  render() {
-    const displaying = this.props.panes.displaying;
-    const title = this.props.msg.pkg.get(`pane.${this.props.panes.displaying}`);
-    const btnClass = displaying === "login" ? "hidden" : "";
-    const showSettings =
-      this.props.panes.paneNames.get("settings") && displaying === "settings"
-        ? ""
-        : "hidden";
-    const showLogin =
-      this.props.panes.paneNames.get("login") && displaying === "login"
-        ? ""
-        : "hidden";
-    const showAdmin =
-      this.props.panes.paneNames.get("admin") && displaying === "admin"
-        ? ""
-        : "hidden";
-
-    return (
-      <div id="panes" className={displaying === "" ? "hidden" : ""}>
-        <div id="root-container">
-          <div id="title-container" className="container">
-            <Flexbox
-              children={List([
-                <h3 id="title">{title}</h3>,
-                <button
-                  onClick={this.closePane}
-                  className={`${btnClass}`}
-                >
-                  {this.props.msg.pkg.get("panes.close")}
-                </button>,
-              ])}
-              childrenStyles={List([{}, { justifyContent: "flex-end" }])}
-            />
-          </div>
-
-          <div className={`${showSettings}`}>
-            <PaneSettings
-              login={this.props.login}
-              msg={this.props.msg}
-              update={this.props.update}
-            />
-          </div>
-
-          <div className={`${showLogin}`}>
-            <AuthPane
-              login={this.props.login}
-              update={this.props.update}
-              msg={this.props.msg}
-            />
-          </div>
-
-          <div className={`${showAdmin}`}>
-            <AdminPane
-              admin={this.props.admin}
-              ui={this.props.ui}
-              msg={this.props.msg}
-              update={this.props.update}
-            />
-          </div>
-        </div>
-      </div>
-    );
-  }
-}

src/client/web/src/components/root_frame.tsx

@@ -6,10 +6,8 @@ import { FilesPanel, FilesProps } from "./panel_files";
 import { UploadingsPanel, UploadingsProps } from "./panel_uploadings";
 import { SharingsPanel, SharingsProps } from "./panel_sharings";
 import { IconProps } from "./visual/icons";
-
 import { Tabs } from "./control/tabs";
 import { LoginProps } from "./pane_login";
-import { Panes, PanesProps } from "./panes";
 import { Layers } from "./layers";
 import { AdminProps } from "./pane_admin";
 import { TopBar } from "./topbar";
@@ -20,7 +18,6 @@ export interface Props {
   filesInfo: FilesProps;
   uploadingsInfo: UploadingsProps;
   sharingsInfo: SharingsProps;
-  panes: PanesProps;
   admin: AdminProps;
   login: LoginProps;
   msg: MsgProps;
@@ -78,7 +75,6 @@ export class RootFrame extends React.Component<Props, State, {}> {
 
           <TopBar
             login={this.props.login}
-            panes={this.props.panes}
             msg={this.props.msg}
             update={this.props.update}
           />

src/client/web/src/components/state_mgr.tsx

@@ -64,7 +64,6 @@ export class StateMgr extends React.Component<Props, State, {}> {
         this.update(updater().updateUploadingsInfo);
         this.update(updater().updateSharingsInfo);
         this.update(updater().updateLogin);
-        this.update(updater().updatePanes);
         this.update(updater().updateAdmin);
         this.update(updater().updateUI);
         this.update(updater().updateMsg);
@@ -82,7 +81,6 @@ export class StateMgr extends React.Component<Props, State, {}> {
         uploadingsInfo={this.state.uploadingsInfo}
         sharingsInfo={this.state.sharingsInfo}
         msg={this.state.msg}
-        panes={this.state.panes}
         login={this.state.login}
         admin={this.state.admin}
         ui={this.state.ui}

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

@@ -286,54 +286,6 @@ export class Updater {
     return this.setItems(List<string>(dstDir.split("/")));
   };
 
-  displayPane = (paneName: string) => {
-    if (paneName === "") {
-      // hide all panes
-      this.props.panes.displaying = "";
-    } else {
-      const pane = this.props.panes.paneNames.get(paneName);
-      if (pane != null) {
-        this.props.panes.displaying = paneName;
-      } else {
-        alertMsg(`pane (${paneName}) not found`);
-      }
-    }
-  };
-
-  setPanes = (paneNames: Set<string>) => {
-    this.props.panes.paneNames = paneNames;
-  };
-
-  initPanes = async (): Promise<Array<any>> => {
-    // init browser content
-    if (this.props.login.userRole === roleVisitor) {
-      if (this.props.filesInfo.isSharing) {
-        // sharing with visitor
-        this.setPanes(Set<string>(["login"]));
-        this.displayPane("");
-        return Promise.all([]);
-      }
-
-      // redirect to login
-      this.setPanes(Set<string>(["login"]));
-      this.displayPane("login");
-      return Promise.all([this.getCaptchaID()]);
-    }
-
-    if (this.props.login.userRole === roleAdmin) {
-      this.setPanes(Set<string>(["login", "settings", "admin"]));
-    } else {
-      this.setPanes(Set<string>(["login", "settings"]));
-    }
-    this.displayPane("");
-
-    return Promise.all([
-      this.refreshUploadings(),
-      this.initUploads(),
-      this.listSharings(),
-    ]);
-  };
-
   initAll = async (params: URLSearchParams): Promise<any> => {
     return this.initIsAuthed()
       .then(() => {
@@ -356,8 +308,14 @@ export class Updater {
         return this.getClientCfg();
       })
       .then(() => {
-        // init panes
+        if (this.props.login.userRole !== roleVisitor) {
-        return this.initPanes();
+          // init panels for authned users
+          return Promise.all([
+            this.refreshUploadings(),
+            this.initUploads(),
+            this.listSharings(),
+          ]);
+        }
       })
       .then(() => {
         // init i18n
@@ -688,13 +646,6 @@ export class Updater {
     };
   };
 
-  updatePanes = (prevState: ICoreState): ICoreState => {
-    return {
-      ...prevState,
-      panes: { ...prevState.panes, ...this.props.panes },
-    };
-  };
-
   updateLogin = (prevState: ICoreState): ICoreState => {
     return {
       ...prevState,

src/client/web/src/components/topbar.tsx

@@ -4,7 +4,6 @@ import { alertMsg, confirmMsg } from "../common/env";
 
 import { ICoreState, MsgProps } from "./core_state";
 import { LoginProps } from "./pane_login";
-import { PanesProps } from "./panes";
 import { updater } from "./state_updater";
 import { Flexbox } from "./layout/flexbox";
 import { getIcon } from "./visual/icons";
@@ -12,7 +11,6 @@ import { getIcon } from "./visual/icons";
 export interface State {}
 export interface Props {
   login: LoginProps;
-  panes: PanesProps;
   msg: MsgProps;
   update?: (updater: (prevState: ICoreState) => ICoreState) => void;
 }
@@ -52,7 +50,6 @@ export class TopBar extends React.Component<Props, State, {}> {
         this.props.update(updater().updateUploadingsInfo);
         this.props.update(updater().updateSharingsInfo);
         this.props.update(updater().updateLogin);
-        this.props.update(updater().updatePanes);
         this.props.update(updater().updateAdmin);
         this.props.update(updater().updateUI);
         this.props.update(updater().updateMsg);