feat: Add agent profile verification status banners to the dashboard and update the agent profile interface with verification fields.

This commit is contained in:
pradeepkumar
2026-03-21 08:56:10 +05:30
parent 67317f86b5
commit c0a631e2b4
2 changed files with 42 additions and 0 deletions

View File

@@ -3,6 +3,7 @@
import { useState, useEffect } from 'react';
import { useSession } from 'next-auth/react';
import Image from 'next/image';
import Link from 'next/link';
// Import shared components
import {
@@ -287,6 +288,45 @@ export default function AgentDashboard() {
return (
<div className="space-y-6">
{/* Verification Status Banner */}
{agentProfile?.verificationStatus === 'REJECTED' && (
<div className="bg-red-50 border border-red-200 rounded-[15px] p-4">
<div className="flex items-start gap-3">
<Image src="/assets/icons/caution-icon.svg" alt="Warning" width={20} height={20} className="mt-0.5 flex-shrink-0" />
<div className="flex-1">
<p className="font-fractul font-bold text-[14px] text-red-800">Profile Verification Rejected</p>
{agentProfile.verificationNote && (
<p className="font-serif text-[13px] text-red-700 mt-1">Reason: {agentProfile.verificationNote}</p>
)}
<p className="font-serif text-[13px] text-red-600 mt-2">Please update your profile and documents, then resubmit for verification.</p>
<Link href="/agent/edit" className="inline-block mt-2 px-4 py-1.5 bg-[#e58625] text-white rounded-[10px] font-serif text-[13px] hover:bg-[#d47920] transition-colors">
Update & Resubmit
</Link>
</div>
</div>
</div>
)}
{agentProfile?.verificationStatus === 'PENDING_REVIEW' && (
<div className="bg-yellow-50 border border-yellow-200 rounded-[15px] p-4">
<div className="flex items-center gap-3">
<div className="w-5 h-5 rounded-full bg-yellow-400 flex-shrink-0" />
<p className="font-fractul font-bold text-[14px] text-yellow-800">Profile verification is under review. You will be notified once approved.</p>
</div>
</div>
)}
{agentProfile?.verificationStatus === 'NONE' && (
<div className="bg-blue-50 border border-blue-200 rounded-[15px] p-4">
<div className="flex items-center gap-3">
<Image src="/assets/icons/caution-icon.svg" alt="Info" width={20} height={20} className="flex-shrink-0" />
<div className="flex-1">
<p className="font-fractul font-bold text-[14px] text-blue-800">Complete your profile and upload verification documents to get verified.</p>
<Link href="/agent/edit" className="inline-block mt-2 px-4 py-1.5 bg-[#e58625] text-white rounded-[10px] font-serif text-[13px] hover:bg-[#d47920] transition-colors">
Complete Profile
</Link>
</div>
</div>
</div>
)}
{/* Main Layout - Responsive: Column on mobile, Row on desktop */}
<div className="flex flex-col lg:flex-row gap-6 lg:items-stretch">
{/* Left Sidebar - Status & Contact */}