diff --git a/public/assets/icons/eye-off-icon.svg b/public/assets/icons/eye-off-icon.svg
new file mode 100644
index 0000000..085b834
--- /dev/null
+++ b/public/assets/icons/eye-off-icon.svg
@@ -0,0 +1,6 @@
+
diff --git a/src/app/(agent)/agent/dashboard/component/ContactInfo.tsx b/src/app/(agent)/agent/dashboard/component/ContactInfo.tsx
new file mode 100644
index 0000000..45797e4
--- /dev/null
+++ b/src/app/(agent)/agent/dashboard/component/ContactInfo.tsx
@@ -0,0 +1,67 @@
+'use client';
+
+import { useState } from 'react';
+import Image from 'next/image';
+
+interface ContactInfoProps {
+ email: string;
+ phone: string;
+}
+
+// Helper function to mask email
+function maskEmail(email: string): string {
+ const [localPart, domain] = email.split('@');
+ if (!domain) return '********';
+ const maskedLocal = localPart.slice(0, 2) + '********';
+ return `${maskedLocal}@${domain}`;
+}
+
+// Helper function to mask phone
+function maskPhone(phone: string): string {
+ if (phone.length <= 4) return '********';
+ return phone.slice(0, -4).replace(/./g, '*') + phone.slice(-4);
+}
+
+export function ContactInfo({ email, phone }: ContactInfoProps) {
+ const [showEmail, setShowEmail] = useState(false);
+ const [showPhone, setShowPhone] = useState(false);
+
+ return (
+
+
+ Email:
+
+ {showEmail ? email : maskEmail(email)}
+
+
+
+
+ Ph.No:
+
+ {showPhone ? phone : maskPhone(phone)}
+
+
+
+
+ );
+}
diff --git a/src/app/(agent)/agent/dashboard/component/StatusButtons.tsx b/src/app/(agent)/agent/dashboard/component/StatusButtons.tsx
new file mode 100644
index 0000000..408ee45
--- /dev/null
+++ b/src/app/(agent)/agent/dashboard/component/StatusButtons.tsx
@@ -0,0 +1,30 @@
+'use client';
+
+interface StatusButtonsProps {
+ isAvailable?: boolean;
+}
+
+export function StatusButtons({ isAvailable = true }: StatusButtonsProps) {
+ return (
+
+
+
+
+ Available.
+
+
+
+
+
+
+ Unavailable.
+
+
+
+
+ );
+}
diff --git a/src/app/(agent)/agent/dashboard/component/index.ts b/src/app/(agent)/agent/dashboard/component/index.ts
index 7336ff9..19b39cd 100644
--- a/src/app/(agent)/agent/dashboard/component/index.ts
+++ b/src/app/(agent)/agent/dashboard/component/index.ts
@@ -10,3 +10,5 @@ export { ExperienceSection } from './ExperienceSection';
export { SpecializationSection } from './SpecializationSection';
export { TestimonialCard } from './TestimonialCard';
export { TestimonialsSection } from './TestimonialsSection';
+export { StatusButtons } from './StatusButtons';
+export { ContactInfo } from './ContactInfo';
diff --git a/src/app/(agent)/agent/dashboard/page.tsx b/src/app/(agent)/agent/dashboard/page.tsx
index 2ab6093..aeda424 100644
--- a/src/app/(agent)/agent/dashboard/page.tsx
+++ b/src/app/(agent)/agent/dashboard/page.tsx
@@ -10,6 +10,8 @@ import {
ProfileCard,
SpecializationSection,
TestimonialsSection,
+ StatusButtons,
+ ContactInfo,
} from './component';
// Mock agent data - in production, this would come from API
@@ -105,54 +107,10 @@ export default function AgentDashboard() {
{/* Status Buttons */}
-
-
-
-
- Available.
-
-
-
-
-
-
- Unavailable.
-
-
-
-
+
{/* Contact Info */}
-
-
- Email:
- ********brain@gmail.com
-
-
-
- Ph.No:
- {agentData.phone}
-
-
-
+
{/* Right Content - Profile Info + Experience + All Sections */}