LumeWeb
/
skynet-webportal
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

dashboard-v2: move static elements of auth pages to AuthLayout

This commit is contained in:
Michał Leszczyk 2022-04-11 12:37:14 +02:00
parent 9cfea2266a
commit d093577909
No known key found for this signature in database
GPG Key ID: FA123CA8BAA2FBF4
7 changed files with 63 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/dashboard-v2/src/components/forms/LoginForm.js
View File

@ -82,7 +82,7 @@ export const LoginForm = ({ onSuccess }) => {
</div>
<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>
</Form>
)}

9
packages/dashboard-v2/src/layouts/AuthLayout.js
View File

@ -33,7 +33,14 @@ const AuthLayout =
</h1>
</div>
</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>
</UserProvider>
</>

15
packages/dashboard-v2/src/pages/auth/login.js
View File

@ -22,16 +22,11 @@ const LoginPage = ({ location }) => {
<Metadata>
<title>Sign In</title>
</Metadata>
<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" />
</div>
<LoginForm
onSuccess={async () => {
await refreshUserState();
}}
/>
</div>
<LoginForm
onSuccess={async () => {
await refreshUserState();
}}
/>
</>
);
};

6
packages/dashboard-v2/src/pages/auth/registration.js
View File

@ -61,11 +61,7 @@ const SignUpPage = () => {
<Metadata>
<title>Sign Up</title>
</Metadata>
<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" />
</div>
<div className="flex flex-col">
{!settings.areAccountsEnabled && <Alert $variant="info">Accounts are not enabled on this portal.</Alert>}
{settings.areAccountsEnabled && (

37
packages/dashboard-v2/src/pages/auth/reset-password.js
View File

@ -20,30 +20,25 @@ const ResetPasswordPage = () => {
<Metadata>
<title>Reset Password</title>
</Metadata>
<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" />
</div>
{state !== State.Success && (
<RecoveryForm onSuccess={() => setState(State.Success)} onFailure={() => setState(State.Failure)} />
)}
{state !== State.Success && (
<RecoveryForm onSuccess={() => setState(State.Success)} onFailure={() => setState(State.Failure)} />
)}
{state === State.Success && (
<p className="text-primary text-center font-semibold">Please check your inbox for further instructions.</p>
)}
{state === State.Success && (
<p className="text-primary text-center font-semibold">Please check your inbox for further instructions.</p>
)}
{state === State.Failure && (
<p className="text-error text-center">Something went wrong, please try again later.</p>
)}
{state === State.Failure && (
<p className="text-error text-center">Something went wrong, please try again later.</p>
)}
<div className="text-sm text-center mt-8">
<p>
Suddenly remembered your password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
</p>
<p>
Don't actually have an account? <HighlightedLink to="/auth/signup">Create one!</HighlightedLink>
</p>
</div>
<div className="text-sm text-center mt-8">
<p>
Suddenly remembered your password? <HighlightedLink to="/auth/login">Sign in</HighlightedLink>
</p>
<p>
Don't actually have an account? <HighlightedLink to="/auth/registration">Create one!</HighlightedLink>
</p>
</div>
</>
);

25
packages/dashboard-v2/src/pages/user/confirm.js
View File

@ -57,23 +57,18 @@ const EmailConfirmationPage = ({ location }) => {
<Metadata>
<title>Confirm E-mail Address</title>
</Metadata>
<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" />
</div>
<div className="text-center">
{state === State.Pure && <p>Please wait while we verify your account...</p>}
<div className="text-center">
{state === State.Pure && <p>Please wait while we verify your account...</p>}
{state === State.Success && (
<>
<p className="text-primary font-semibold">All done!</p>
<p>You will be redirected to your dashboard shortly.</p>
<HighlightedLink to="/">Redirect now.</HighlightedLink>
</>
)}
{state === State.Success && (
<>
<p className="text-primary font-semibold">All done!</p>
<p>You will be redirected to your dashboard shortly.</p>
<HighlightedLink to="/">Redirect now.</HighlightedLink>
</>
)}
{state === State.Failure && <p className="text-error">Something went wrong, please try again later.</p>}
</div>
{state === State.Failure && <p className="text-error">Something went wrong, please try again later.</p>}
</div>
</>
);

49
packages/dashboard-v2/src/pages/user/recover.js
View File

@ -24,35 +24,30 @@ const RecoverPage = ({ location }) => {
<Metadata>
<title>Recover Your Account</title>
</Metadata>
<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" />
</div>
{state !== State.Success && (
<ResetPasswordForm
token={token}
onSuccess={() => {
setState(State.Success);
navigate("/");
}}
onFailure={() => setState(State.Failure)}
/>
)}
{state !== State.Success && (
<ResetPasswordForm
token={token}
onSuccess={() => {
setState(State.Success);
navigate("/");
}}
onFailure={() => setState(State.Failure)}
/>
)}
{state === State.Success && (
<p className="text-primary text-center font-semibold">
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>
{state === State.Success && (
<p className="text-primary text-center font-semibold">
All done! You will be redirected to your dashboard shortly.
</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>
</>
);
};