79 lines
2.3 KiB
TypeScript
79 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import { ModalHeader } from '@/modals/Modal/Container';
|
|
import { api } from '@/trpc/client';
|
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
import { type ISignInShare, zSignInShare } from '@openpanel/validation';
|
|
import { useRouter } from 'next/navigation';
|
|
import { useForm } from 'react-hook-form';
|
|
import { toast } from 'sonner';
|
|
import { LogoSquare } from '../logo';
|
|
import { Button } from '../ui/button';
|
|
import { Input } from '../ui/input';
|
|
|
|
export function ShareEnterPassword({ shareId }: { shareId: string }) {
|
|
const router = useRouter();
|
|
const mutation = api.auth.signInShare.useMutation({
|
|
onSuccess() {
|
|
router.refresh();
|
|
},
|
|
onError() {
|
|
toast.error('Incorrect password');
|
|
},
|
|
});
|
|
const form = useForm<ISignInShare>({
|
|
resolver: zodResolver(zSignInShare),
|
|
defaultValues: {
|
|
password: '',
|
|
shareId,
|
|
},
|
|
});
|
|
|
|
const onSubmit = form.handleSubmit((data) => {
|
|
mutation.mutate({
|
|
password: data.password,
|
|
shareId,
|
|
});
|
|
});
|
|
|
|
return (
|
|
<div className="center-center h-screen w-screen p-4 col">
|
|
<div className="bg-background p-6 rounded-lg max-w-md w-full text-left">
|
|
<div className="col mt-1 flex-1 gap-2">
|
|
<LogoSquare className="size-12 mb-4" />
|
|
<div className="text-xl font-semibold">Overview is locked</div>
|
|
<div className="text-lg text-muted-foreground leading-normal">
|
|
Please enter correct password to access this overview
|
|
</div>
|
|
</div>
|
|
<form onSubmit={onSubmit} className="col gap-4 mt-6">
|
|
<Input
|
|
{...form.register('password')}
|
|
type="password"
|
|
placeholder="Enter your password"
|
|
size="large"
|
|
/>
|
|
<Button type="submit">Get access</Button>
|
|
</form>
|
|
</div>
|
|
<div className="p-6 text-xs max-w-sm col gap-0.5">
|
|
<p>
|
|
Powered by{' '}
|
|
<a href="https://openpanel.dev" className="font-medium">
|
|
OpenPanel.dev
|
|
</a>
|
|
</p>
|
|
<p>
|
|
The best web and product analytics tool out there (our honest
|
|
opinion).
|
|
</p>
|
|
<p>
|
|
<a href="https://dashboard.openpanel.dev/onboarding">
|
|
Try it for free today!
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|