Add AlertDialog and Badge components for user verification

- Implemented AlertDialog component for confirmation dialogs.
- Created Badge component for displaying status indicators.
- Integrated UserVerifyDialog to utilize AlertDialog for user verification actions.
- Enhanced user experience with toast notifications during verification process.

components/user/user-verify-dialog.tsx

@@ -0,0 +1,66 @@
+"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 <strong> {user.name}</strong>?
+					</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: () => {
+									setDisabled(false);
+									return "Something went wrong";
+								},
+							});
+						}}
+					>
+						{disabled ? "Verifying..." : "Verify"}
+					</AlertDialogAction>
+				</AlertDialogFooter>
+			</AlertDialogContent>
+		</AlertDialog>
+	);
+}