UNPKG

@ieltsrealtest/ui

Version:

Reusable UI components for IELTS Real Test platform, built with React and TypeScript.

12 lines (11 loc) 1.63 kB
// src/components/common/AuthDialog.tsx "use client"; import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import Image from 'next/image'; // Cần đảm bảo đường dẫn này chính xác với project của bạn import { Button } from '../../ui/button'; import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogFooter, DialogTitle, } from '../../ui/dialog'; const AuthDialog = ({ isOpen, onClose, onSignIn, description }) => { return (_jsx(Dialog, { open: isOpen, onOpenChange: onClose, children: _jsxs(DialogContent, { className: "sm:max-w-md", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { className: "text-xl font-semibold text-center", children: "Login Required" }), _jsx("div", { className: "flex flex-col items-center space-y-4 py-4", children: _jsx("div", { className: "w-16 h-16 bg-orange-100 rounded-full flex items-center justify-center", children: _jsx(Image, { src: "https://ieltsrealtest.s3.us-east-1.amazonaws.com/public/common/Logo+ngang_.png", alt: "IELTS Real Test Logo", width: 64, height: 64 }) }) }), _jsx(DialogDescription, { className: "text-center text-gray-600 mt-2", children: description })] }), _jsxs(DialogFooter, { className: "flex flex-col space-y-2 sm:flex-row sm:space-y-0 sm:space-x-2", children: [_jsx(Button, { variant: "outline", onClick: onClose, className: "w-full sm:w-auto", children: "Cancel" }), _jsx(Button, { className: "bg-[#DA1E37] hover:bg-white hover:text-[#DA1E37] border-2 border-[#DA1E37] text-white w-full sm:w-auto text-md py-1 rounded-md", onClick: onSignIn, children: "Sign In" })] })] }) })); }; export default AuthDialog;