* esm * wip * wip * wip * wip * wip * wip * subscription notice * wip * wip * wip * fix envs * fix: update docker build * fix * esm/types * delete dashboard :D * add patches to dockerfiles * update packages + catalogs + ts * wip * remove native libs * ts * improvements * fix redirects and fetching session * try fix favicon * fixes * fix * order and resize reportds within a dashboard * improvements * wip * added userjot to dashboard * fix * add op * wip * different cache key * improve date picker * fix table * event details loading * redo onboarding completely * fix login * fix * fix * extend session, billing and improve bars * fix * reduce price on 10M
74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
import { Or } from '@/components/auth/or';
|
|
import { SignInEmailForm } from '@/components/auth/sign-in-email-form';
|
|
import { SignInGithub } from '@/components/auth/sign-in-github';
|
|
import { SignInGoogle } from '@/components/auth/sign-in-google';
|
|
import { LogoSquare } from '@/components/logo';
|
|
import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
|
|
import { PAGE_TITLES, createTitle } from '@/utils/title';
|
|
import { createFileRoute, redirect } from '@tanstack/react-router';
|
|
import { AlertCircle } from 'lucide-react';
|
|
import { z } from 'zod';
|
|
|
|
export const Route = createFileRoute('/_login/login')({
|
|
component: LoginPage,
|
|
head: () => ({
|
|
meta: [{ title: createTitle(PAGE_TITLES.LOGIN) }],
|
|
}),
|
|
validateSearch: z.object({
|
|
error: z.string().optional(),
|
|
correlationId: z.string().optional(),
|
|
}),
|
|
});
|
|
|
|
function LoginPage() {
|
|
const { error, correlationId } = Route.useSearch();
|
|
|
|
return (
|
|
<div className="col gap-8 w-full text-left">
|
|
<div>
|
|
<LogoSquare className="size-12 mb-8 md:hidden" />
|
|
<h1 className="text-3xl font-bold text-foreground mb-2">Sign in</h1>
|
|
<p className="text-muted-foreground">
|
|
Don't have an account?{' '}
|
|
<a href="/onboarding" className="underline">
|
|
Create one today
|
|
</a>
|
|
</p>
|
|
</div>
|
|
{error && (
|
|
<Alert
|
|
variant="destructive"
|
|
className="text-left bg-destructive/10 border-destructive/20 mb-6"
|
|
>
|
|
<AlertCircle className="h-4 w-4" />
|
|
<AlertTitle>Error</AlertTitle>
|
|
<AlertDescription>
|
|
<p>{error}</p>
|
|
{correlationId && (
|
|
<>
|
|
<p>Correlation ID: {correlationId}</p>
|
|
<p className="mt-2">
|
|
Contact us if you have any issues.{' '}
|
|
<a
|
|
className="underline font-medium"
|
|
href={`mailto:hello@openpanel.dev?subject=Login%20Issue%20-%20Correlation%20ID%3A%20${correlationId}`}
|
|
>
|
|
hello[at]openpanel.dev
|
|
</a>
|
|
</p>
|
|
</>
|
|
)}
|
|
</AlertDescription>
|
|
</Alert>
|
|
)}
|
|
|
|
<div className="space-y-4">
|
|
<SignInGoogle type="sign-in" />
|
|
<SignInGithub type="sign-in" />
|
|
</div>
|
|
<Or />
|
|
<SignInEmailForm />
|
|
</div>
|
|
);
|
|
}
|