doesnm/quickshare
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui/core_state): move userRole to login domain

Browse source
This commit is contained in:
hexxa 2021-08-25 18:33:55 +08:00 • committed by Hexxa
parent 794b14c4d4
commit 99607c66bc
11 changed files with 47 additions and 70 deletions
Download patch file Download diff file Expand all files Collapse all files

19
src/client/web/src/components/__test__/pane_login.test.tsx
View file

@ -16,6 +16,7 @@ describe("Login", () => {
const coreState = newWithWorker(mockWorker);
const pane = new AuthPane({
userRole: coreState.login.userRole,
authed: coreState.login.authed,
captchaID: coreState.login.captchaID,
update: (updater: (prevState: ICoreState) => ICoreState) => {},
@ -32,31 +33,15 @@ describe("Login", () => {
// login
expect(updater().props.login).toEqual({
userRole: "admin",
authed: true,
captchaID: "",
});
// panes
expect(updater().props.panes).toEqual({
userRole: "admin",
displaying: "",
paneNames: Set(["settings", "login", "admin"]),
});
// admin
let usersMap = Map({});
usersResps.listUsersMockResp.data.users.forEach((user: User) => {
usersMap = usersMap.set(user.name, user);
});
let roles = Set<string>();
Object.keys(usersResps.listRolesMockResp.data.roles).forEach(
(role: string) => {
roles = roles.add(role);
}
);
expect(updater().props.admin).toEqual({
users: usersMap,
roles: roles,
});
});
});

1
src/client/web/src/components/__test__/panes.test.tsx
View file

@ -23,7 +23,6 @@ describe("Panes", () => {
panes.closePane();
expect(updater().props.panes).toEqual({
userRole: coreState.panes.userRole,
displaying: "",
paneNames: coreState.panes.paneNames,
});

6
src/client/web/src/components/__test__/state_mgr.test.tsx
View file

@ -43,14 +43,14 @@ describe("State Manager", () => {
// panes
expect(coreState.panes).toEqual({
userRole: "admin",
displaying: "browser",
displaying: "",
paneNames: Set(["settings", "login", "admin"]),
});
// login
expect(coreState.login).toEqual({
authed: false,
userRole: "admin",
authed: true,
captchaID: "mockCaptchaID",
});

2
src/client/web/src/components/core_state.ts
View file

@ -50,11 +50,11 @@ export function initState(): ICoreState {
uploadFiles: List<File>([]),
},
panes: {
userRole: "",
displaying: "browser",
paneNames: Set<string>(["settings", "login", "admin"]),
},
login: {
userRole: "",
authed: false,
captchaID: "",
},

57
src/client/web/src/components/pane_login.tsx
View file

@ -5,6 +5,7 @@ import { ICoreState } from "./core_state";
import { updater } from "./state_updater";
export interface Props {
userRole: string;
authed: boolean;
captchaID: string;
update?: (updater: (prevState: ICoreState) => ICoreState) => void;
@ -48,57 +49,38 @@ export class AuthPane extends React.Component<Props, State, {}> {
this.props.captchaID,
this.state.captchaInput
)
.then((ok: boolean) => {
.then((ok: boolean): Promise<any> => {
if (ok) {
this.update(updater().updateLogin);
this.setState({ user: "", pwd: "" });
this.setState({ user: "", pwd: "", captchaInput: "" });
// close all the panes
updater().displayPane("");
this.update(updater().updatePanes);
// refresh
return updater().setHomeItems();
return Promise.all([
updater().setHomeItems(),
updater().refreshUploadings(),
updater().isSharing(updater().props.browser.dirPath.join("/")),
updater().listSharings(),
updater().self(),
]);
} else {
this.setState({ user: "", pwd: "" });
this.setState({ user: "", pwd: "", captchaInput: "" });
alert("Failed to login.");
}
})
.then(() => {
return updater().refreshUploadings();
})
.then(() => {
return updater().isSharing(
updater().props.browser.dirPath.join("/")
);
})
.then(() => {
return updater().listSharings();
})
.then(() => {
return updater().self();
})
.then(() => {
// TODO: should rely on props to get userRole
if (updater().props.panes.userRole === "admin") {
// TODO: remove hardcode
return updater().listRoles();
return updater().getCaptchaID();
}
})
.then(() => {
// TODO: should rely on props to get userRole
if (updater().props.panes.userRole === "admin") {
// TODO: remove hardcode
return updater().listUsers();
}
})
.then((_: boolean) => {
this.update(updater().updateBrowser);
});
};
logout = () => {
updater().logout().then((ok: boolean) => {
updater()
.logout()
.then((ok: boolean) => {
if (ok) {
this.update(updater().updateLogin);
} else {
@ -107,6 +89,14 @@ export class AuthPane extends React.Component<Props, State, {}> {
});
};
refreshCaptcha = async () => {
return updater()
.getCaptchaID()
.then(() => {
this.props.update(updater().updateLogin);
});
};
render() {
return (
<span>
@ -157,6 +147,7 @@ export class AuthPane extends React.Component<Props, State, {}> {
<img
src={`/v1/captchas/imgs?capid=${this.props.captchaID}`}
className="captcha"
onClick={this.refreshCaptcha}
/>
</div>
<div className="flex-list-item-l"></div>

1
src/client/web/src/components/pane_settings.tsx
View file

@ -147,6 +147,7 @@ export class PaneSettings extends React.Component<Props, State, {}> {
</div>
<div className="flex-list-item-r">
<AuthPane
userRole={this.props.login.userRole}
authed={this.props.login.authed}
captchaID={this.props.login.captchaID}
update={this.update}

4
src/client/web/src/components/panes.tsx
View file

@ -9,7 +9,6 @@ import { AuthPane, Props as AuthPaneProps } from "./pane_login";
export interface PanesProps {
displaying: string;
userRole: string;
paneNames: Set<string>;
}
export interface Props {
@ -46,6 +45,7 @@ export class Panes extends React.Component<Props, State, {}> {
),
login: (
<AuthPane
userRole={this.props.login.userRole}
authed={this.props.login.authed}
captchaID={this.props.login.captchaID}
update={this.props.update}
@ -53,7 +53,7 @@ export class Panes extends React.Component<Props, State, {}> {
),
});
if (this.props.panes.userRole === "admin") {
if (this.props.login.userRole === "admin") {
panesMap = panesMap.set(
"admin",
<AdminPane

2
src/client/web/src/components/root_frame.tsx
View file

@ -29,7 +29,7 @@ export class RootFrame extends React.Component<Props, State, {}> {
update={this.props.update}
/>
<TopBar update={this.props.update}></TopBar>
<TopBar login={this.props.panes.login} update={this.props.update}></TopBar>
<div className="container-center">
<Browser

4
src/client/web/src/components/state_mgr.tsx
View file

@ -88,13 +88,13 @@ export class StateMgr extends React.Component<Props, State, {}> {
return updater().self();
})
.then(() => {
if (updater().props.panes.userRole === "admin") {
if (updater().props.login.userRole === "admin") {
// TODO: remove hardcode
return updater().listRoles();
}
})
.then(() => {
if (updater().props.panes.userRole === "admin") {
if (updater().props.login.userRole === "admin") {
// TODO: remove hardcode
return updater().listUsers();
}

2
src/client/web/src/components/state_updater.ts
View file

@ -202,7 +202,7 @@ export class Updater {
self = async (): Promise<boolean> => {
const resp = await this.usersClient.self();
if (resp.status === 200) {
this.props.panes.userRole = resp.data.role;
this.props.login.userRole = resp.data.role;
return true;
}
return false;

7
src/client/web/src/components/topbar.tsx
View file

@ -1,10 +1,12 @@
import * as React from "react";
import { ICoreState } from "./core_state";
import { Props as LoginProps } from "./pane_login";
import { updater } from "./state_updater";
export interface State {}
export interface Props {
login: LoginProps;
update?: (updater: (prevState: ICoreState) => ICoreState) => void;
}
@ -22,11 +24,10 @@ export class TopBar extends React.Component<Props, State, {}> {
return updater()
.self()
.then(() => {
// TODO: use props instead
// TODO: remove hardcode role
if (
updater().props.login.authed &&
updater().props.panes.userRole === "admin"
this.props.login.authed &&
this.props.login.userRole === "admin"
) {
return Promise.all([updater().listRoles(), updater().listUsers()]);
}