GitHub/jsoncrack.com
1
0
Fork 0
mirror of https://github.com/AykutSarac/jsoncrack.com.git synced 2025-01-12 19:02:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: sign-in page flow

Browse Source
This commit is contained in:
AykutSarac 2023-05-26 11:00:48 +03:00
parent b00497d755
commit a3c31864ca
No known key found for this signature in database
1 changed files with 123 additions and 132 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/pages/sign-in.tsx
View File

@ -34,19 +34,6 @@ export function AuthenticationForm(props: PaperProps) {
const [type, toggle] = useToggle<"login" | "register">(["login", "register"]);
const [done, setDone] = React.useState(false);
const { isReady, replace, query } = useRouter();
const checkSession = useUser(state => state.checkSession);
const isAuthenticated = useUser(state => state.isAuthenticated);
const isAuthenticating = React.useMemo(() => {
if (query?.access_token) return true;
return false;
}, [query]);
React.useEffect(() => {
if (isAuthenticated) replace("/editor");
}, [isReady, isAuthenticated, replace]);
const form = useForm({
initialValues: {
email: "",
@ -114,22 +101,6 @@ export function AuthenticationForm(props: PaperProps) {
Welcome to JSON Crack, {type} with
</Text>
{isAuthenticating ? (
<Stack my={60} w={250} spacing="xl">
<Button size="lg" color="orange" onClick={checkSession}>
JSON Crack
</Button>
<Button
component="a"
href={window.location.href.replace(window.location.host, "editor.herowand.com")}
size="lg"
color="teal"
>
Herowand Editor
</Button>
</Stack>
) : (
<>
<Group grow mb="md" mt="md">
<Button
radius="xl"
@ -228,8 +199,6 @@ export function AuthenticationForm(props: PaperProps) {
</Button>
</Group>
</form>
</>
)}
</Paper>
);
}
@ -304,15 +273,19 @@ function ResetPassword(props: PaperProps) {
}
const SignIn = () => {
const { isReady, replace, query } = useRouter();
const { isReady, replace, push, query } = useRouter();
const checkSession = useUser(state => state.checkSession);
const isAuthenticated = useUser(state => state.isAuthenticated);
const isPasswordReset = query?.action === "reset-pwd" && !query?.error;
const isAuthenticating = React.useMemo(() => {
if (query?.action === "oauth-signin" && query?.status === "200") return true;
return false;
}, [query]);
React.useEffect(() => {
if (!isReady) checkSession();
if (isAuthenticated) replace("/");
}, [isReady, isAuthenticated, replace, checkSession]);
if (isAuthenticated) push("/editor");
}, [isReady, isAuthenticated, push]);
return (
<div>
@ -324,7 +297,25 @@ const SignIn = () => {
<StyledHeroSection>
<JSONCrackLogo />
</StyledHeroSection>
{isAuthenticating ? (
<Center>
<Stack my={60} w={250} spacing="xl">
<Button size="lg" color="orange" onClick={checkSession}>
JSON Crack
</Button>
<Button
component="a"
href={window.location.href.replace(window.location.host, "editor.herowand.com")}
size="lg"
color="teal"
>
Herowand Editor
</Button>
</Stack>
</Center>
) : (
<Center pt={60}>{isPasswordReset ? <ResetPassword /> : <AuthenticationForm />}</Center>
)}
</StyledPageWrapper>
<Footer />
</div>