HMC/handmade-revolt
2
0
Fork 0
forked from abner/for-legacy-web
Code Pull Requests Actions Activity

feat: make login functional again

Browse Source
This commit is contained in:
Paul Makles
2022-06-29 10:52:42 +01:00
parent 8d505c9564
commit 66ae518e51
7 changed files with 160 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/pages/login/forms/CaptchaBlock.tsx
View File

@@ -7,7 +7,7 @@ import { useEffect } from "preact/hooks";
import { Preloader } from "@revoltchat/ui";
import { useApplicationState } from "../../../mobx/State";
import { clientController } from "../../../controllers/client/ClientController";
export interface CaptchaProps {
onSuccess: (token?: string) => void;
@@ -15,7 +15,7 @@ export interface CaptchaProps {
}
export const CaptchaBlock = observer((props: CaptchaProps) => {
const configuration = useApplicationState().config.get();
const configuration = clientController.getServerConfig();
useEffect(() => {
if (!configuration?.features.captcha.enabled) {

11
src/pages/login/forms/Form.tsx
View File

@@ -6,16 +6,14 @@ import styles from "../Login.module.scss";
import { Text } from "preact-i18n";
import { useState } from "preact/hooks";
import { Button, Category, Preloader } from "@revoltchat/ui";
import { Tip } from "@revoltchat/ui";
import { useApplicationState } from "../../../mobx/State";
import { Button, Category, Preloader, Tip } from "@revoltchat/ui";
import { I18nError } from "../../../context/Locale";
import { takeError } from "../../../context/revoltjs/util";
import WaveSVG from "../../settings/assets/wave.svg";
import { clientController } from "../../../controllers/client/ClientController";
import FormField from "../FormField";
import { CaptchaBlock, CaptchaProps } from "./CaptchaBlock";
import { MailProvider } from "./MailProvider";
@@ -45,7 +43,7 @@ interface FormInputs {
}
export const Form = observer(({ page, callback }: Props) => {
const configuration = useApplicationState().config.get();
const configuration = clientController.getServerConfig();
const [loading, setLoading] = useState(false);
const [success, setSuccess] = useState<string | undefined>(undefined);
@@ -260,7 +258,8 @@ export const Form = observer(({ page, callback }: Props) => {
<a
href="https://developers.revolt.chat/faq/instances#what-is-a-third-party-instance"
style={{ color: "var(--accent)" }}
target="_blank" rel="noreferrer">
target="_blank"
rel="noreferrer">
<Text id="general.learn_more" />
</a>
</span>

6
src/pages/login/forms/FormCreate.tsx
View File

@@ -1,9 +1,7 @@
import { useApplicationState } from "../../../mobx/State";
import { useClient } from "../../../controllers/client/ClientController";
import { Form } from "./Form";
export function FormCreate() {
const config = useApplicationState().config;
const client = config.createClient();
const client = useClient();
return <Form page="create" callback={(data) => client.register(data)} />;
}

104
src/pages/login/forms/FormLogin.tsx
View File

@@ -1,106 +1,6 @@
import { detect } from "detect-browser";
import { API } from "revolt.js";
import { useApplicationState } from "../../../mobx/State";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { modalController } from "../../../controllers/modals/ModalController";
import { clientController } from "../../../controllers/client/ClientController";
import { Form } from "./Form";
export function FormLogin() {
const state = useApplicationState();
const { openScreen } = useIntermediate();
return (
<Form
page="login"
callback={async (data) => {
const browser = detect();
let friendly_name;
if (browser) {
let { name } = browser;
const { os } = browser;
let isiPad;
if (window.isNative) {
friendly_name = `Revolt Desktop on ${os}`;
} else {
if (name === "ios") {
name = "safari";
} else if (name === "fxios") {
name = "firefox";
} else if (name === "crios") {
name = "chrome";
}
if (os === "Mac OS" && navigator.maxTouchPoints > 0)
isiPad = true;
friendly_name = `${name} on ${isiPad ? "iPadOS" : os}`;
}
} else {
friendly_name = "Unknown Device";
}
// ! FIXME: temporary login flow code
// This should be replaced in the future.
const client = state.config.createClient();
await client.fetchConfiguration();
let session = await client.api.post("/auth/session/login", {
...data,
friendly_name,
});
if (session.result === "MFA") {
const { allowed_methods } = session;
const mfa_response: API.MFAResponse | undefined =
await new Promise((callback) =>
modalController.push({
type: "mfa_flow",
state: "unknown",
available_methods: allowed_methods,
callback,
}),
);
if (typeof mfa_response === "undefined") {
throw "Cancelled";
}
session = await client.api.post("/auth/session/login", {
mfa_response,
mfa_ticket: session.ticket,
friendly_name,
});
if (session.result === "MFA") {
// unreachable code
return;
}
}
const s = session;
client.session = session;
(client as any).$updateHeaders();
async function login() {
state.auth.setSession(s);
}
const { onboarding } = await client.api.get("/onboard/hello");
if (onboarding) {
openScreen({
id: "onboarding",
callback: async (username: string) =>
client
.completeOnboarding({ username }, false)
.then(login),
});
} else {
login();
}
}}
/>
);
return <Form page="login" callback={clientController.login} />;
}