sarlink/sarlink-portal
7
0
Fork 0
mirror of https://github.com/i701/sarlink-portal.git synced 2025-07-17 09:55:49 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(user-verification): implement user verification functionality and update dialog UI ✨
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 6m54s
Details

Browse Source
This commit is contained in:
i701
2025-07-16 02:03:03 +05:00
parent 7a02cb2415
commit dc3b5f9bf9
2 changed files with 79 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
components/user/user-verify-dialog.tsx
View File

@ -2,27 +2,26 @@
import { Check, CheckCheck } from "lucide-react";
import { useState } from "react";
import { toast } from "sonner";
import { VerifyUser } from "@/actions/user-actions";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/components/ui/alert-dialog";
import { verifyUser } from "@/actions/user-actions";
import { Button } from "@/components/ui/button";
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import type { UserProfile } from "@/lib/types/user";
export function UserVerifyDialog({ user }: { user: UserProfile }) {
const userId = user.id;
const [disabled, setDisabled] = useState(false);
const [open, setOpen] = useState(false);
return (
<AlertDialog>
<AlertDialogTrigger asChild>
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>
<Button
variant={user.verified ? "secondary" : "default"}
disabled={disabled || user.verified}
@ -30,11 +29,11 @@ export function UserVerifyDialog({ user }: { user: UserProfile }) {
{user.verified ? <CheckCheck size={16} /> : <Check size={16} />}
{user.verified ? "Verified" : "Verify"}
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle className="text-muted-foreground">Verify User</AlertDialogTitle>
<AlertDialogDescription>
</DialogTrigger>
<DialogContent>
<DialogHeader>
<DialogTitle className="text-muted-foreground">Verify User</DialogTitle>
<DialogDescription>
Are you sure you want to verify the following user?
<span className="inline-block my-4">
<li>
@ -52,31 +51,35 @@ export function UserVerifyDialog({ user }: { user: UserProfile }) {
</li>
<li>Phone Number: {user.mobile}</li>
</span>
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button
disabled={disabled}
onClick={() => {
onClick={async () => {
setOpen(true);
setDisabled(true);
toast.promise(VerifyUser(String(userId)), {
loading: "Verifying...",
success: () => {
setDisabled(false);
return "User Verified!";
},
error: (error: Error) => {
setDisabled(false);
return error.message || "Something went wrong";
},
const res = await verifyUser(String(userId));
if (res.ok) toast.success('User Verified!');
else toast.warning(res.error, {
description: <div>
<p className="italic">The following fields do not match</p>
<ul className="list-disc list-inside p-2">
{res.mismatch_fields?.map((field) => (
<li key={field}>{field}</li>
))}
</ul>
</div>,
closeButton: true,
duration: 10000,
});
setDisabled(false);
}}
>
{disabled ? "Verifying..." : "Verify"}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
);
}