diff --git a/src/shared/components/common/auth-guard.tsx b/src/shared/components/common/auth-guard.tsx index e79a541e..13f89139 100644 --- a/src/shared/components/common/auth-guard.tsx +++ b/src/shared/components/common/auth-guard.tsx @@ -1,12 +1,33 @@ -import { InfernoNode } from "inferno"; -import { Redirect } from "inferno-router"; +import { Component, InfernoNode } from "inferno"; import { UserService } from "../../services"; +import { Spinner } from "./icon"; -function AuthGuard(props: { children?: InfernoNode }) { - if (!UserService.Instance.myUserInfo) { - return ; - } else { - return props.children; +interface AuthGuardState { + hasRedirected: boolean; +} + +class AuthGuard extends Component<{ children?: InfernoNode }, AuthGuardState> { + state = { + hasRedirected: false, + } as AuthGuardState; + + constructor(props: any, context: any) { + super(props, context); + } + + componentDidMount() { + if (!UserService.Instance.myUserInfo) { + this.context.router.history.replace( + "/login", + this.context.router.history.location + ); + } else { + this.setState({ hasRedirected: true }); + } + } + + render() { + return this.state.hasRedirected ? this.props.children : ; } } diff --git a/src/shared/components/home/login.tsx b/src/shared/components/home/login.tsx index e2986b57..2610ff80 100644 --- a/src/shared/components/home/login.tsx +++ b/src/shared/components/home/login.tsx @@ -1,7 +1,9 @@ import { myAuth, setIsoData } from "@utils/app"; import { isBrowser } from "@utils/browser"; +import { Location } from "history"; import { Component, linkEvent } from "inferno"; import { NavLink } from "inferno-router"; +import { RouteComponentProps } from "inferno-router/dist/Route"; import { GetSiteResponse, LoginResponse } from "lemmy-js-client"; import { I18NextService, UserService } from "../../services"; import { HttpService, RequestState } from "../../services/HttpService"; @@ -20,7 +22,78 @@ interface State { siteRes: GetSiteResponse; } -export class Login extends Component { +async function handleLoginSubmit(i: Login, event: any) { + event.preventDefault(); + const { password, totp_2fa_token, username_or_email } = i.state.form; + + if (username_or_email && password) { + i.setState({ loginRes: { state: "loading" } }); + + const loginRes = await HttpService.client.login({ + username_or_email, + password, + totp_2fa_token, + }); + switch (loginRes.state) { + case "failed": { + if (loginRes.msg === "missing_totp_token") { + i.setState({ showTotp: true }); + toast(I18NextService.i18n.t("enter_two_factor_code"), "info"); + } + + i.setState({ loginRes: { state: "failed", msg: loginRes.msg } }); + break; + } + + case "success": { + UserService.Instance.login({ + res: loginRes.data, + }); + const site = await HttpService.client.getSite({ + auth: myAuth(), + }); + + if (site.state === "success") { + UserService.Instance.myUserInfo = site.data.my_user; + } + + const { hash, pathname, search } = (i.props.history.location.state ?? + {}) as Location; + + console.log("Login state"); + console.log(i.props.history.location.state); + + i.props.history.location.state + ? i.props.history.replace({ hash, pathname, search }) + : i.props.history.action === "PUSH" + ? i.props.history.back() + : i.props.history.replace("/"); + + break; + } + } + } +} + +function handleLoginUsernameChange(i: Login, event: any) { + i.state.form.username_or_email = event.target.value.trim(); + i.setState(i.state); +} + +function handleLoginTotpChange(i: Login, event: any) { + i.state.form.totp_2fa_token = event.target.value; + i.setState(i.state); +} + +function handleLoginPasswordChange(i: Login, event: any) { + i.state.form.password = event.target.value; + i.setState(i.state); +} + +export class Login extends Component< + RouteComponentProps>, + State +> { private isoData = setIsoData(this.context); state: State = { @@ -68,7 +141,7 @@ export class Login extends Component { loginForm() { return (
-
+

{I18NextService.i18n.t("login")}

@@ -150,64 +223,4 @@ export class Login extends Component { ); } - - async handleLoginSubmit(i: Login, event: any) { - event.preventDefault(); - const { password, totp_2fa_token, username_or_email } = i.state.form; - - if (username_or_email && password) { - i.setState({ loginRes: { state: "loading" } }); - - const loginRes = await HttpService.client.login({ - username_or_email, - password, - totp_2fa_token, - }); - switch (loginRes.state) { - case "failed": { - if (loginRes.msg === "missing_totp_token") { - i.setState({ showTotp: true }); - toast(I18NextService.i18n.t("enter_two_factor_code"), "info"); - } - - i.setState({ loginRes: { state: "failed", msg: loginRes.msg } }); - break; - } - - case "success": { - UserService.Instance.login({ - res: loginRes.data, - }); - const site = await HttpService.client.getSite({ - auth: myAuth(), - }); - - if (site.state === "success") { - UserService.Instance.myUserInfo = site.data.my_user; - } - - i.props.history.action === "PUSH" - ? i.props.history.back() - : i.props.history.replace("/"); - - break; - } - } - } - } - - handleLoginUsernameChange(i: Login, event: any) { - i.state.form.username_or_email = event.target.value.trim(); - i.setState(i.state); - } - - handleLoginTotpChange(i: Login, event: any) { - i.state.form.totp_2fa_token = event.target.value; - i.setState(i.state); - } - - handleLoginPasswordChange(i: Login, event: any) { - i.state.form.password = event.target.value; - i.setState(i.state); - } }