feat: add verification bannner

This commit is contained in:
Juan Di Toro 2024-03-29 00:37:41 +01:00
parent 1118ba2a71
commit 8235f516e9
3 changed files with 77 additions and 73 deletions

View File

@ -2,7 +2,7 @@ import { Button } from "~/components/ui/button";
import logoPng from "~/images/lume-logo.png?url";
import lumeColorLogoPng from "~/images/lume-color-logo.png?url";
import discordLogoPng from "~/images/discord-logo.png?url";
import { Form, Link, useLocation } from "@remix-run/react";
import { Link, useLocation } from "@remix-run/react";
import {
Dialog,
DialogContent,
@ -46,18 +46,22 @@ import {
TooltipProvider,
} from "./ui/tooltip";
import filesize from "./lib/filesize";
import { z } from "zod";
import { getFormProps, useForm, useInputControl } from "@conform-to/react";
import { getZodConstraint, parseWithZod } from "@conform-to/zod";
import { ErrorList } from "./forms";
export const GeneralLayout = ({ children }: React.PropsWithChildren) => {
const location = useLocation();
const { data: identity } = useGetIdentity<Identity>();
const { mutate: logout } = useLogout();
return (
<PinningProvider>
<div className="h-full flex flex-row">
{!identity?.verified ? (
<div className="bg-primary-1 text-primary-1-foreground p-4">
We have sent you a verification email. Please click on the link in the
email to start using the platform.
</div>
) : null}
<div className={"h-full flex flex-row"}>
<header className="p-10 pr-0 flex flex-col w-[240px] h-full scroll-m-0 overflow-hidden">
<img src={logoPng} alt="Lume logo" className="h-10 w-32" />
@ -231,11 +235,7 @@ const UploadFileForm = () => {
))}
</div>
<ErrorList
errors={[
...(hasErrored ? ["An error occurred"] : []),
]}
/>
<ErrorList errors={[...(hasErrored ? ["An error occurred"] : [])]} />
{hasStarted && !hasErrored ? (
<div className="flex flex-col items-center gap-y-2 w-full text-primary-1">
@ -285,7 +285,7 @@ const UploadFileItem = ({
failedState?: FailedUppyFile<Record<string, any>, Record<string, any>>;
onRemove: (id: string) => void;
}) => {
console.log({file: file.progress})
console.log({ file: file.progress });
return (
<div className="flex flex-col w-full py-4 px-2 bg-primary-dark">
<div
@ -350,7 +350,9 @@ const UploadFileItem = ({
</div>
) : null}
{file.progress?.preprocess ? <p className="text-sm text-primary-2 ml-2">Processing...</p> : null}
{file.progress?.preprocess ? (
<p className="text-sm text-primary-2 ml-2">Processing...</p>
) : null}
{file.progress?.uploadStarted && !file.progress.uploadComplete ? (
<Progress max={100} value={file.progress.percentage} className="mt-2" />
) : null}

View File

@ -31,6 +31,7 @@ export type Identity = {
firstName: string;
lastName: string;
email: string;
verified: boolean;
}
export interface UpdatePasswordFormRequest extends UpdatePasswordFormTypes {
@ -197,6 +198,7 @@ export const createPortalAuthProvider = (sdk: Sdk): AuthProvider => {
firstName: acct.first_name,
lastName: acct.last_name,
email: acct.email,
verified: acct.verified,
};
},
};

View File

@ -32,7 +32,7 @@ export function Layout({ children }: { children: React.ReactNode }) {
<Meta />
<Links />
</head>
<body>
<body className="max-h-screen">
{children}
<ScrollRestoration />
<Scripts />