4c86a5b9ca
Self-hosted US Congress monitoring platform with AI policy briefs, bill/member/topic follows, ntfy + RSS + email notifications, alignment scoring, collections, and draft-letter generator. Authored by: Jack Levy
40 lines
2.0 KiB
TypeScript
40 lines
2.0 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import * as Dialog from "@radix-ui/react-dialog";
|
|
import { X } from "lucide-react";
|
|
|
|
interface AuthModalProps {
|
|
open: boolean;
|
|
onClose: () => void;
|
|
}
|
|
|
|
export function AuthModal({ open, onClose }: AuthModalProps) {
|
|
return (
|
|
<Dialog.Root open={open} onOpenChange={onClose}>
|
|
<Dialog.Portal>
|
|
<Dialog.Overlay className="fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0" />
|
|
<Dialog.Content className="fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2 w-full max-w-sm bg-card border border-border rounded-lg shadow-lg p-6 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95">
|
|
<Dialog.Title className="text-base font-semibold">
|
|
Sign in to follow bills
|
|
</Dialog.Title>
|
|
<Dialog.Description className="mt-2 text-sm text-muted-foreground">
|
|
Create a free account to follow bills, set Pocket Veto or Pocket Boost modes, and receive alerts.
|
|
</Dialog.Description>
|
|
<div className="flex gap-3 mt-4">
|
|
<Link href="/register" onClick={onClose} className="flex-1 px-4 py-2 text-sm font-medium text-center rounded-md bg-primary text-primary-foreground hover:bg-primary/90 transition-colors">
|
|
Create account
|
|
</Link>
|
|
<Link href="/login" onClick={onClose} className="flex-1 px-4 py-2 text-sm font-medium text-center rounded-md border border-border text-foreground hover:bg-accent transition-colors">
|
|
Sign in
|
|
</Link>
|
|
</div>
|
|
<Dialog.Close className="absolute right-4 top-4 p-1 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent transition-colors">
|
|
<X className="w-4 h-4" />
|
|
</Dialog.Close>
|
|
</Dialog.Content>
|
|
</Dialog.Portal>
|
|
</Dialog.Root>
|
|
);
|
|
}
|