diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx
index 323c9b87..274b0d22 100644
--- a/src/components/Directory/ProfileContactDirectory.jsx
+++ b/src/components/Directory/ProfileContactDirectory.jsx
@@ -5,12 +5,28 @@ import moment from "moment";
import NotesDirectory from "./NotesDirectory";
const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
- const { conatProfile, loading } = useContactProfile(contact?.id);
- const [profileContact, setProfileContact] = useState();
+ const { contactProfile, loading, refetch } = useContactProfile(contact?.id);
+ const [copiedIndex, setCopiedIndex] = useState(null);
+ const [profileContact, setProfileContact] = useState();
+ const [expanded, setExpanded] = useState(false);
+ const description = contactProfile?.description || "";
+ const limit = 100;
+
+ const toggleReadMore = () => setExpanded(!expanded);
+
+ const isLong = description.length > limit;
+ const displayText = expanded
+ ? description
+ : description.slice(0, limit) + (isLong ? "..." : "");
useEffect(() => {
- setProfileContact(conatProfile);
- }, [conatProfile]);
+ setProfileContact(contactProfile);
+ }, [contactProfile]);
+ const handleCopy = (email, index) => {
+ navigator.clipboard.writeText(email);
+ setCopiedIndex(index);
+ setTimeout(() => setCopiedIndex(null), 2000); // Reset after 2 seconds
+ };
return (
@@ -20,6 +36,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
{
(contact?.name || "").trim().split(" ")[1]?.charAt(0) || ""
}
/>
-
+
{contact?.name}
-
- {" "}
- {conatProfile?.organization}
-
- Manager
+
+ {contactProfile?.tags?.map((tag) => tag.name).join(" | ")}
+
-
- {conatProfile?.contactEmails?.length > 0 && (
-
-
-
Email
+
+ {contactProfile?.contactEmails?.length > 0 && (
+
+
+
+
+ {contactProfile.contactEmails.map((email, idx) => (
+ -
+
+ {email.emailAddress}
+ handleCopy(email.emailAddress, idx)}
+ >
+
+ ))}
+
+
-
-
- {conatProfile.contactEmails.map((email, idx) => (
- -
-
- {email.emailAddress}
-
- ))}
-
-
-
- )}
- {conatProfile?.contactPhones?.length > 0 && (
-
-
-
-
- {conatProfile?.contactPhones.map((phone, idx) => (
- -
-
- {phone.phoneNumber}
-
- ))}
-
-
-
- )}
+ )}
- {conatProfile?.createdAt && (
-
-
-
Created
+ {contactProfile?.contactPhones?.length > 0 && (
+
+
+
+
+ {contactProfile?.contactPhones.map((phone, idx) => (
+ -
+
+ {phone.phoneNumber}
+
+ ))}
+
+
-
-
- -
-
- {moment(conatProfile.createdAt).format("MMMM, DD YYYY")}
-
-
+ )}
+
+ {contactProfile?.createdAt && (
+
+
+
+
+ -
+
+ {moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
+
+
+
-
- )}
+ )}
+
+ {contactProfile?.address && (
+
+
+
+
+ -
+
+ {contactProfile?.address}
+
+
+
+
+ )}
- { conatProfile?.buckets?.length > 0 &&
-
- {conatProfile?.contactEmails?.length > 0 && (
-
-
-
-
- {conatProfile.buckets.map((bucket) => (
- -
- { bucket.name}
-
- ))}
-
-
-
- )}
-
- }
-
+
+ {contactProfile?.organization && (
+
+
+
+
+ -
+
+ {contactProfile.organization}
+
+
+
+
+ )}
+ {contactProfile?.contactCategory && (
+
+
+
+
+ -
+
+ {contactProfile.contactCategory.name}
+
+
+
+
+ )}
+
+ {contactProfile?.buckets?.length > 0 && (
+
+ {contactProfile?.contactEmails?.length > 0 && (
+
+
+
+
+ {contactProfile.buckets.map((bucket) => (
+ -
+
+ {bucket.name}
+
+
+ ))}
+
+
+
+ )}
+
+ )}
+
+
+ {contactProfile?.projects?.length > 0 && (
+
+
+
+
+ {contactProfile.projects.map((project, index) => (
+ -
+ {project.name}
+ {index < contactProfile.projects.length - 1 && ","}
+
+ ))}
+
+
+
+ )}
+
+
+
+ {displayText}
+ {isLong && (
+
+ {expanded ? "Read less" : "Read more"}
+
+ )}
+
+