bigblocks
Version:
Complete Bitcoin UI component library - authentication, social, wallet, market, inscriptions, and blockchain interactions for React
63 lines (62 loc) • 5.54 kB
JavaScript
"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { ExitIcon } from "@radix-ui/react-icons";
import { useState } from "react";
import { useBitcoinAuth } from "../../hooks/useBitcoinAuth.js";
import { LoadingButton } from "../ui-components/LoadingButton.js";
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from "../ui/alert-dialog.js";
import { Button } from "../ui/button.js";
import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger, } from "../ui/dialog.js";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "../ui/tooltip.js";
import { LoginForm } from "./LoginForm.js";
export function AuthButton({ mode = "signin", className = "", style, size = "default", variant = "default", color, children, confirmSignOut = false, confirmMessage = "Are you sure you want to sign out?", redirectTo, onSignOut, showClearInfo = false, }) {
const { isAuthenticated, user, signOut, hasLocalBackup } = useBitcoinAuth();
const [showLoginForm, setShowLoginForm] = useState(false);
const [showConfirmDialog, setShowConfirmDialog] = useState(false);
const [isSigningOut, setIsSigningOut] = useState(false);
const handleSignOut = async () => {
try {
setIsSigningOut(true);
await signOut();
onSignOut?.();
if (redirectTo && typeof window !== "undefined") {
const windowWithNext = window;
if ("next" in window && windowWithNext.next?.router) {
windowWithNext.next.router.push(redirectTo);
}
else {
window.location.href = redirectTo;
}
}
}
catch (error) {
console.error("Error signing out:", error);
}
finally {
setIsSigningOut(false);
setShowConfirmDialog(false);
}
};
const handleSignOutClick = () => {
if (confirmSignOut) {
setShowConfirmDialog(true);
}
else {
handleSignOut();
}
};
if (isAuthenticated && user && mode === "signup") {
return (_jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { size: size, variant: "secondary", className: className, style: style, disabled: true, children: children || "Create Bitcoin Account" }) }), _jsx(TooltipContent, { side: "top", children: _jsx("p", { children: "You're already signed in. Sign out to create a new account." }) })] }) }));
}
if (mode === "signout" || (isAuthenticated && user && mode === "signin")) {
if (!user)
return null;
return (_jsxs(_Fragment, { children: [_jsxs(LoadingButton, { onClick: handleSignOutClick, loading: isSigningOut, variant: variant, size: size, className: className, style: style, children: [_jsx(ExitIcon, {}), children || "Sign Out"] }), _jsx(AlertDialog, { open: showConfirmDialog, onOpenChange: setShowConfirmDialog, children: _jsxs(AlertDialogContent, { className: "max-w-md", children: [_jsxs(AlertDialogHeader, { children: [_jsx(AlertDialogTitle, { children: "Confirm Sign Out" }), _jsxs(AlertDialogDescription, { className: "space-y-3", children: [_jsx("span", { children: confirmMessage }), showClearInfo && (_jsxs("div", { className: "space-y-2 mt-2", children: [_jsx("p", { className: "text-sm font-medium", children: "What will happen:" }), _jsxs("div", { className: "space-y-1 ml-3", children: [_jsx("p", { className: "text-xs text-muted-foreground", children: "\u2713 Your encrypted backup will remain safe" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "\u2713 You can sign back in with your password" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "\u2022 Your current session will end" }), _jsx("p", { className: "text-xs text-muted-foreground", children: "\u2022 Temporary data will be cleared" })] })] })), hasLocalBackup && (_jsx("p", { className: "text-xs", style: { color: "var(--accent-foreground)" }, children: "\u2713 Your encrypted backup is stored locally and will be available when you sign back in." }))] })] }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { children: "Cancel" }), _jsx(AlertDialogAction, { asChild: true, children: _jsxs(LoadingButton, { variant: "destructive", loading: isSigningOut, onClick: handleSignOut, children: [_jsx(ExitIcon, {}), "Sign Out"] }) })] })] }) })] }));
}
return (_jsxs(Dialog, { open: showLoginForm, onOpenChange: setShowLoginForm, children: [_jsx(DialogTrigger, { asChild: true, children: _jsx(Button, { size: size, variant: variant, className: className, style: style, children: children ||
(mode === "signin"
? "Sign In with Bitcoin"
: "Create Bitcoin Account") }) }), _jsxs(DialogContent, { className: "sm:max-w-[425px]", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: mode === "signin" ? "Sign In" : "Create Account" }), _jsx(DialogDescription, { children: mode === "signin"
? "Sign in with your Bitcoin identity"
: "Create a new Bitcoin identity" })] }), _jsx(LoginForm, { mode: mode, onSuccess: () => setShowLoginForm(false) })] })] }));
}