mirror of
https://github.com/i701/sarlink-portal.git
synced 2025-02-22 22:41:59 +00:00
- Updated `next.config.ts` to include remote image patterns for user verification. - Introduced `VerifyUserDetails` function in `lib/person.ts` to validate user data against national records. - Added `usePerson` hook for fetching national data based on ID card. - Enhanced `signup` and `signin` functions in `auth-actions.ts` to handle user verification status and send notifications for pending verifications. - Refactored `VerifyUser` function in `user-actions.ts` to incorporate national data validation. - Improved UI components in the user verification page to display both database and national information. - Updated `InputReadOnly` component to support customizable label classes for better styling. These changes improve the user verification process, ensuring data integrity and enhancing the overall user experience.
78 lines
2.2 KiB
TypeScript
78 lines
2.2 KiB
TypeScript
"use client";
|
|
import { VerifyUser } from "@/actions/user-actions";
|
|
import {
|
|
AlertDialog,
|
|
AlertDialogAction,
|
|
AlertDialogCancel,
|
|
AlertDialogContent,
|
|
AlertDialogDescription,
|
|
AlertDialogFooter,
|
|
AlertDialogHeader,
|
|
AlertDialogTitle,
|
|
AlertDialogTrigger,
|
|
} from "@/components/ui/alert-dialog";
|
|
import { Button } from "@/components/ui/button";
|
|
import type { User } from "@prisma/client";
|
|
import { Check, CheckCheck } from "lucide-react";
|
|
import { useState } from "react";
|
|
import { toast } from "sonner";
|
|
|
|
export function UserVerifyDialog({ user }: { user: User }) {
|
|
const userId = user.id;
|
|
const [disabled, setDisabled] = useState(false);
|
|
return (
|
|
<AlertDialog>
|
|
<AlertDialogTrigger asChild>
|
|
<Button
|
|
variant={user.verified ? "secondary" : "default"}
|
|
disabled={disabled || user.verified}
|
|
>
|
|
{user.verified ? <CheckCheck size={16} /> : <Check size={16} />}
|
|
{user.verified ? "Verified" : "Verify"}
|
|
</Button>
|
|
</AlertDialogTrigger>
|
|
<AlertDialogContent>
|
|
<AlertDialogHeader>
|
|
<AlertDialogTitle>Are you sure?</AlertDialogTitle>
|
|
<AlertDialogDescription>
|
|
Are you sure you want to verify the following user?
|
|
<span className="inline-block my-4">
|
|
<li>Name: {user.name}</li>
|
|
<li>ID Card: {user.id_card}</li>
|
|
<li>Address: {user.address}</li>
|
|
<li>DOB: {new Date(user.dob ?? "").toLocaleDateString("en-US", {
|
|
month: "short",
|
|
day: "2-digit",
|
|
year: "numeric",
|
|
})}</li>
|
|
<li>Phone Number: {user.phoneNumber}</li>
|
|
</span>
|
|
</AlertDialogDescription>
|
|
</AlertDialogHeader>
|
|
<AlertDialogFooter>
|
|
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
|
<AlertDialogAction
|
|
disabled={disabled}
|
|
onClick={() => {
|
|
setDisabled(true);
|
|
toast.promise(VerifyUser(userId), {
|
|
loading: "Verifying...",
|
|
success: () => {
|
|
setDisabled(false);
|
|
return "User Verified!";
|
|
},
|
|
error: (error: Error) => {
|
|
setDisabled(false);
|
|
return error.message || "Something went wrong";
|
|
},
|
|
});
|
|
}}
|
|
>
|
|
{disabled ? "Verifying..." : "Verify"}
|
|
</AlertDialogAction>
|
|
</AlertDialogFooter>
|
|
</AlertDialogContent>
|
|
</AlertDialog>
|
|
);
|
|
}
|