dashboard-v2: move static elements of auth pages to AuthLayout
This commit is contained in:
parent
9cfea2266a
commit
d093577909
|
@ -82,7 +82,7 @@ export const LoginForm = ({ onSuccess }) => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p className="text-sm text-center mt-8">
|
<p className="text-sm text-center mt-8">
|
||||||
Don't have an account? <HighlightedLink to="/auth/signup">Sign up</HighlightedLink>
|
Don't have an account? <HighlightedLink to="/auth/registration">Sign up</HighlightedLink>
|
||||||
</p>
|
</p>
|
||||||
</Form>
|
</Form>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -33,7 +33,14 @@ const AuthLayout =
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</SloganContainer>
|
</SloganContainer>
|
||||||
<Content>{children}</Content>
|
<Content>
|
||||||
|
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
||||||
|
<div className="mb-4 md:mb-16">
|
||||||
|
<img src="/images/logo-black-text.svg" alt="Skynet" className="-ml-2" />
|
||||||
|
</div>
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
</Content>
|
||||||
</Layout>
|
</Layout>
|
||||||
</UserProvider>
|
</UserProvider>
|
||||||
</>
|
</>
|
||||||
|
|
|
@ -22,16 +22,11 @@ const LoginPage = ({ location }) => {
|
||||||
<Metadata>
|
<Metadata>
|
||||||
<title>Sign In</title>
|
<title>Sign In</title>
|
||||||
</Metadata>
|
</Metadata>
|
||||||
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
<LoginForm
|
||||||
<div className="mb-4 md:mb-16">
|
onSuccess={async () => {
|
||||||
<img src="/images/logo-black-text.svg" alt="Skynet" />
|
await refreshUserState();
|
||||||
</div>
|
}}
|
||||||
<LoginForm
|
/>
|
||||||
onSuccess={async () => {
|
|
||||||
await refreshUserState();
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -61,11 +61,7 @@ const SignUpPage = () => {
|
||||||
<Metadata>
|
<Metadata>
|
||||||
<title>Sign Up</title>
|
<title>Sign Up</title>
|
||||||
</Metadata>
|
</Metadata>
|
||||||
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
<div className="flex flex-col">
|
||||||
<div className="mb-4 md:mb-16">
|
|
||||||
<img src="/images/logo-black-text.svg" alt="Skynet" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{!settings.areAccountsEnabled && <Alert $variant="info">Accounts are not enabled on this portal.</Alert>}
|
{!settings.areAccountsEnabled && <Alert $variant="info">Accounts are not enabled on this portal.</Alert>}
|
||||||
|
|
||||||
{settings.areAccountsEnabled && (
|
{settings.areAccountsEnabled && (
|
||||||
|
|
|
@ -20,30 +20,25 @@ const ResetPasswordPage = () => {
|
||||||
<Metadata>
|
<Metadata>
|
||||||
<title>Reset Password</title>
|
<title>Reset Password</title>
|
||||||
</Metadata>
|
</Metadata>
|
||||||
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
{state !== State.Success && (
|
||||||
<div className="mb-4 md:mb-16">
|
<RecoveryForm onSuccess={() => setState(State.Success)} onFailure={() => setState(State.Failure)} />
|
||||||
<img src="/images/logo-black-text.svg" alt="Skynet" />
|
)}
|
||||||
</div>
|
|
||||||
{state !== State.Success && (
|
|
||||||
<RecoveryForm onSuccess={() => setState(State.Success)} onFailure={() => setState(State.Failure)} />
|
|
||||||
)}
|
|
||||||
|
|
||||||
{state === State.Success && (
|
{state === State.Success && (
|
||||||
<p className="text-primary text-center font-semibold">Please check your inbox for further instructions.</p>
|
<p className="text-primary text-center font-semibold">Please check your inbox for further instructions.</p>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{state === State.Failure && (
|
{state === State.Failure && (
|
||||||
<p className="text-error text-center">Something went wrong, please try again later.</p>
|
<p className="text-error text-center">Something went wrong, please try again later.</p>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className="text-sm text-center mt-8">
|
<div className="text-sm text-center mt-8">
|
||||||
<p>
|
<p>
|
||||||
Suddenly remembered your password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
|
Suddenly remembered your password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Don't actually have an account? <HighlightedLink to="/auth/signup">Create one!</HighlightedLink>
|
Don't actually have an account? <HighlightedLink to="/auth/registration">Create one!</HighlightedLink>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
@ -57,23 +57,18 @@ const EmailConfirmationPage = ({ location }) => {
|
||||||
<Metadata>
|
<Metadata>
|
||||||
<title>Confirm E-mail Address</title>
|
<title>Confirm E-mail Address</title>
|
||||||
</Metadata>
|
</Metadata>
|
||||||
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
<div className="text-center">
|
||||||
<div className="mb-4 md:mb-16">
|
{state === State.Pure && <p>Please wait while we verify your account...</p>}
|
||||||
<img src="/images/logo-black-text.svg" alt="Skynet" />
|
|
||||||
</div>
|
|
||||||
<div className="text-center">
|
|
||||||
{state === State.Pure && <p>Please wait while we verify your account...</p>}
|
|
||||||
|
|
||||||
{state === State.Success && (
|
{state === State.Success && (
|
||||||
<>
|
<>
|
||||||
<p className="text-primary font-semibold">All done!</p>
|
<p className="text-primary font-semibold">All done!</p>
|
||||||
<p>You will be redirected to your dashboard shortly.</p>
|
<p>You will be redirected to your dashboard shortly.</p>
|
||||||
<HighlightedLink to="/">Redirect now.</HighlightedLink>
|
<HighlightedLink to="/">Redirect now.</HighlightedLink>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{state === State.Failure && <p className="text-error">Something went wrong, please try again later.</p>}
|
{state === State.Failure && <p className="text-error">Something went wrong, please try again later.</p>}
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
@ -24,35 +24,30 @@ const RecoverPage = ({ location }) => {
|
||||||
<Metadata>
|
<Metadata>
|
||||||
<title>Recover Your Account</title>
|
<title>Recover Your Account</title>
|
||||||
</Metadata>
|
</Metadata>
|
||||||
<div className="bg-white px-8 py-10 md:py-32 lg:px-16 xl:px-28 min-h-screen">
|
{state !== State.Success && (
|
||||||
<div className="mb-4 md:mb-16">
|
<ResetPasswordForm
|
||||||
<img src="/images/logo-black-text.svg" alt="Skynet" />
|
token={token}
|
||||||
</div>
|
onSuccess={() => {
|
||||||
{state !== State.Success && (
|
setState(State.Success);
|
||||||
<ResetPasswordForm
|
navigate("/");
|
||||||
token={token}
|
}}
|
||||||
onSuccess={() => {
|
onFailure={() => setState(State.Failure)}
|
||||||
setState(State.Success);
|
/>
|
||||||
navigate("/");
|
)}
|
||||||
}}
|
|
||||||
onFailure={() => setState(State.Failure)}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{state === State.Success && (
|
{state === State.Success && (
|
||||||
<p className="text-primary text-center font-semibold">
|
<p className="text-primary text-center font-semibold">
|
||||||
All done! You will be redirected to your dashboard shortly.
|
All done! You will be redirected to your dashboard shortly.
|
||||||
</p>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{state === State.Failure && (
|
|
||||||
<p className="text-error text-center">Something went wrong, please try again later.</p>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<p className="text-sm text-center mt-8">
|
|
||||||
Suddenly remembered your old password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
)}
|
||||||
|
|
||||||
|
{state === State.Failure && (
|
||||||
|
<p className="text-error text-center">Something went wrong, please try again later.</p>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<p className="text-sm text-center mt-8">
|
||||||
|
Suddenly remembered your old password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
|
||||||
|
</p>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
Reference in New Issue