feat(verify-user): add link to view user agreement and improve layout for user information

app/(dashboard)/users/[userId]/verify/page.tsx

@@ -1,4 +1,4 @@
-import { FileTextIcon, PencilIcon } from "lucide-react";
+import { EyeIcon, FileTextIcon, PencilIcon } from "lucide-react";
 import Image from "next/image";
 import Link from "next/link";
 import { redirect } from "next/navigation";
@@ -41,10 +41,10 @@ export default async function VerifyUserPage({
 
 	return (
 		<div>
-			<div className="flex items-center justify-between text-gray-500 text-2xl font-bold title-bg py-4 px-2 mb-4">
+			<div className="flex flex-wrap gap-2 items-center justify-between text-gray-500 text-2xl font-bold title-bg py-4 px-2 mb-4">
 				<h3 className="text-sarLinkOrange text-2xl">User Information</h3>
 
-				<div className="flex gap-2">
+				<div className="flex flex-wrap gap-2">
 					{dbUser && !dbUser?.verified && <UserVerifyDialog user={dbUser} />}
 					{dbUser && !dbUser?.verified && <UserRejectDialog user={dbUser} />}
 					<Link href={'update'}>
@@ -59,6 +59,12 @@ export default async function VerifyUserPage({
 							Update Agreement
 						</Button>
 					</Link>
+					<Link href={dbUser?.agreement || "#"} target="_blank" rel="noopener noreferrer">
+						<Button className="hover:cursor-pointer">
+							<EyeIcon />
+							View Agreement
+						</Button>
+					</Link>
 					{dbUser?.verified && (
 						<Badge variant={"secondary"} className="bg-lime-500">
 							Verified

lib/types/user.ts

@@ -45,6 +45,7 @@ export interface UserProfile {
 	address: string;
 	acc_no: string;
 	id_card: string;
+	agreement: string;
 }
 
 export interface Session {