From a811eb8463ebd70df0dc9dd593baaddba50d28f9 Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Fri, 25 Jul 2025 12:54:02 +0530 Subject: [PATCH 01/23] UI Alignment and Icon Styling Issue in Contact Card Design in Directory. --- .../Directory/CardViewDirectory.jsx | 4 +- .../Directory/ProfileContactDirectory.jsx | 78 ++++++++++--------- 2 files changed, 44 insertions(+), 38 deletions(-) diff --git a/src/components/Directory/CardViewDirectory.jsx b/src/components/Directory/CardViewDirectory.jsx index 0d955810..31b56c9b 100644 --- a/src/components/Directory/CardViewDirectory.jsx +++ b/src/components/Directory/CardViewDirectory.jsx @@ -107,13 +107,13 @@ const CardViewDirectory = ({ {/*
    • */} -
  • +
  • {contact.organization}
    • { if (IsActive) { diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx index 41e1dadd..297c2904 100644 --- a/src/components/Directory/ProfileContactDirectory.jsx +++ b/src/components/Directory/ProfileContactDirectory.jsx @@ -47,7 +47,6 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
    {contact?.name} - {/* {contactProfile?.tags?.map((tag) => tag.name).join(" | ")} */} {contactProfile?.designation}
    @@ -56,23 +55,22 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
    {contactProfile?.contactEmails?.length > 0 && (
    -
    -

    Email:

    +
    + +

    Email :

      {contactProfile.contactEmails.map((email, idx) => (
    • - {email.emailAddress} handleCopy(email.emailAddress, idx)} @@ -86,14 +84,14 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.contactPhones?.length > 0 && (
      -
      -

      Phone :

      +
      + +

      Phone :

        {contactProfile?.contactPhones.map((phone, idx) => (
      • - {phone.phoneNumber}
        • ))} @@ -104,12 +102,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.createdAt && (
        -
        -

        Created :

        +
        + +

        Created :

      • - {moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
        • @@ -117,11 +115,11 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.address && (
        -
        -

        Location:

        +
        + +

        Location :

        - {contactProfile.address} @@ -133,12 +131,11 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
        {contactProfile?.organization && (
        -
        -

        Orgnization :

        +
        + +

        Organization :

        - - {contactProfile.organization} @@ -147,29 +144,29 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.contactCategory && (
        -
        -

        Category :

        +
        + +

        Category :

        • - {contactProfile.contactCategory.name}
        )} - {contactProfile?.tags?.length > 0 && ( + {contactProfile?.tags?.length > 0 && (
        -
        -

        Tags :

        +
        + +

        Tags :

          {contactProfile.tags.map((tag, index) => (
        • - {tag.name}
          • ))} @@ -179,11 +176,13 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.buckets?.length > 0 && ( -
          +
          {contactProfile?.contactEmails?.length > 0 && (
          -
          -

          Buckets :

          +
          +

          + Buckets : +

            @@ -200,12 +199,15 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )}
          )} +
          {contactProfile?.projects?.length > 0 && (
          -
          -

          Projects :

          +
          +

          + Projects : +

            @@ -220,9 +222,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
          )} +
          -
          -

          Description :

          +
          +

          + Description : +

          {displayText} @@ -237,6 +242,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
          +
          Date: Fri, 25 Jul 2025 14:46:13 +0530 Subject: [PATCH 02/23] Adding "( , )" when user has multiple phone numbers. --- src/components/Directory/ProfileContactDirectory.jsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx index 297c2904..62ca077f 100644 --- a/src/components/Directory/ProfileContactDirectory.jsx +++ b/src/components/Directory/ProfileContactDirectory.jsx @@ -84,15 +84,19 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.contactPhones?.length > 0 && (
          -
          +

          Phone :

            - {contactProfile?.contactPhones.map((phone, idx) => ( -
          • + {contactProfile.contactPhones.map((phone, idx) => ( +
          • {phone.phoneNumber} + {idx < contactProfile.contactPhones.length - 1 && ","}
            • ))}
          @@ -100,6 +104,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
          )} + {contactProfile?.createdAt && (
          From e3d0b440f8ac0883cd47b050bf5ec6d1cf74f37c Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Fri, 25 Jul 2025 12:54:02 +0530 Subject: [PATCH 03/23] UI Alignment and Icon Styling Issue in Contact Card Design in Directory. --- .../Directory/CardViewDirectory.jsx | 4 +- .../Directory/ProfileContactDirectory.jsx | 78 ++++++++++--------- 2 files changed, 44 insertions(+), 38 deletions(-) diff --git a/src/components/Directory/CardViewDirectory.jsx b/src/components/Directory/CardViewDirectory.jsx index 0d955810..31b56c9b 100644 --- a/src/components/Directory/CardViewDirectory.jsx +++ b/src/components/Directory/CardViewDirectory.jsx @@ -107,13 +107,13 @@ const CardViewDirectory = ({ {/*
          • */} -
        • +
        • {contact.organization}
        { if (IsActive) { diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx index 41e1dadd..297c2904 100644 --- a/src/components/Directory/ProfileContactDirectory.jsx +++ b/src/components/Directory/ProfileContactDirectory.jsx @@ -47,7 +47,6 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
        {contact?.name} - {/* {contactProfile?.tags?.map((tag) => tag.name).join(" | ")} */} {contactProfile?.designation}
        @@ -56,23 +55,22 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
        {contactProfile?.contactEmails?.length > 0 && (
        -
        -

        Email:

        +
        + +

        Email :

          {contactProfile.contactEmails.map((email, idx) => (
        • - {email.emailAddress} handleCopy(email.emailAddress, idx)} @@ -86,14 +84,14 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.contactPhones?.length > 0 && (
          -
          -

          Phone :

          +
          + +

          Phone :

            {contactProfile?.contactPhones.map((phone, idx) => (
          • - {phone.phoneNumber}
            • ))} @@ -104,12 +102,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.createdAt && (
            -
            -

            Created :

            +
            + +

            Created :

          • - {moment(contactProfile.createdAt).format("MMMM, DD YYYY")}
            • @@ -117,11 +115,11 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.address && (
            -
            -

            Location:

            +
            + +

            Location :

            - {contactProfile.address} @@ -133,12 +131,11 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
            {contactProfile?.organization && (
            -
            -

            Orgnization :

            +
            + +

            Organization :

            - - {contactProfile.organization} @@ -147,29 +144,29 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.contactCategory && (
            -
            -

            Category :

            +
            + +

            Category :

            • - {contactProfile.contactCategory.name}
            )} - {contactProfile?.tags?.length > 0 && ( + {contactProfile?.tags?.length > 0 && (
            -
            -

            Tags :

            +
            + +

            Tags :

              {contactProfile.tags.map((tag, index) => (
            • - {tag.name}
              • ))} @@ -179,11 +176,13 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )} {contactProfile?.buckets?.length > 0 && ( -
              +
              {contactProfile?.contactEmails?.length > 0 && (
              -
              -

              Buckets :

              +
              +

              + Buckets : +

                @@ -200,12 +199,15 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { )}
              )} +
              {contactProfile?.projects?.length > 0 && (
              -
              -

              Projects :

              +
              +

              + Projects : +

                @@ -220,9 +222,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              )} +
              -
              -

              Description :

              +
              +

              + Description : +

              {displayText} @@ -237,6 +242,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              +
              Date: Fri, 25 Jul 2025 14:46:13 +0530 Subject: [PATCH 04/23] Adding "( , )" when user has multiple phone numbers. --- src/components/Directory/ProfileContactDirectory.jsx | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx index 297c2904..62ca077f 100644 --- a/src/components/Directory/ProfileContactDirectory.jsx +++ b/src/components/Directory/ProfileContactDirectory.jsx @@ -84,15 +84,19 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { {contactProfile?.contactPhones?.length > 0 && (
              -
              +

              Phone :

                - {contactProfile?.contactPhones.map((phone, idx) => ( -
              • + {contactProfile.contactPhones.map((phone, idx) => ( +
              • {phone.phoneNumber} + {idx < contactProfile.contactPhones.length - 1 && ","}
                • ))}
              @@ -100,6 +104,7 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              )} + {contactProfile?.createdAt && (
              From 2bba01211e7d5265005ae84ab29e406d1b2d72fd Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Sat, 26 Jul 2025 10:00:27 +0530 Subject: [PATCH 05/23] UI changes in Contact Profile page. --- src/components/Directory/NotesDirectory.jsx | 184 ++++++----- .../Directory/ProfileContactDirectory.jsx | 310 +++++++++++------- 2 files changed, 284 insertions(+), 210 deletions(-) diff --git a/src/components/Directory/NotesDirectory.jsx b/src/components/Directory/NotesDirectory.jsx index 61908853..f310bfcc 100644 --- a/src/components/Directory/NotesDirectory.jsx +++ b/src/components/Directory/NotesDirectory.jsx @@ -4,7 +4,6 @@ import Avatar from "../common/Avatar"; import { useForm } from "react-hook-form"; import { z } from "zod"; import { zodResolver } from "@hookform/resolvers/zod"; -import { showText } from "pdf-lib"; import { DirectoryRepository } from "../../repositories/DirectoryRepository"; import moment from "moment"; import { cacheData, getCachedData } from "../../slices/apiDataManager"; @@ -19,15 +18,14 @@ const schema = z.object({ const NotesDirectory = ({ refetchProfile, isLoading, - contactProfile, + contactProfile, // This contactProfile now reliably includes firstName, middleName, lastName, and fullName setProfileContact, }) => { const [IsActive, setIsActive] = useState(true); - const { contactNotes, refetch } = useContactNotes(contactProfile?.id, true); + const { contactNotes, refetch } = useContactNotes(contactProfile?.id, IsActive); - const [NotesData, setNotesData] = useState(); const [IsSubmitting, setIsSubmitting] = useState(false); - const [addNote, setAddNote] = useState(true); + const [showEditor, setShowEditor] = useState(false); const { register, handleSubmit, @@ -67,102 +65,115 @@ const NotesDirectory = ({ ) { const updatedProfile = { ...cached_contactProfile.data, - notes: [...(cached_contactProfile.notes || []), createdNote], + notes: [...(cached_contactProfile.data.notes || []), createdNote], }; - cacheData("Contact Profile", updatedProfile); + cacheData("Contact Profile", { contactId: contactProfile?.id, data: updatedProfile }); } setValue("note", ""); setIsSubmitting(false); showToast("Note added successfully!", "success"); - setAddNote(true); + setShowEditor(false); setIsActive(true); + refetch(contactProfile?.id, true); } catch (error) { setIsSubmitting(false); const msg = - error.response.data.message || + error.response?.data?.message || error.message || - "Error occured during API calling"; + "Error occurred during API calling"; showToast(msg, "error"); } }; const onCancel = () => { - setValue( "note", "" ); - + setValue("note", ""); + setShowEditor(false); }; + const handleSwitch = () => { - setIsActive(!IsActive); - if (IsActive) { - refetch(contactProfile?.id, false); - } + setIsActive((prevIsActive) => { + const newState = !prevIsActive; + refetch(contactProfile?.id, newState); + return newState; + }); }; + // Use the fullName from contactProfile, which now includes middle and last names if available + const contactName = contactProfile?.fullName || contactProfile?.firstName || "Contact"; + const noNotesMessage = `Be the first to share your insights! ${contactName} currently has no notes.`; + + const notesToDisplay = IsActive ? (contactProfile?.notes || []) : (contactNotes || []); + return ( -
              +
              -

              Notes :

              +

              Notes :

              -
              - {contactNotes?.length > 0 ? ( - - ) : ( -
              - +
              + {(contactProfile?.notes?.length > 0 || contactNotes?.length > 0) && ( + + )} + {!(contactProfile?.notes?.length > 0 || contactNotes?.length > 0) && ( +
              + +
              + )} +
              + + {!showEditor && ( +
              + +
              + )} +
              - )} -
              -
              - setAddNote(!addNote)} - > - {addNote ? "Hide Editor" : "Add a Note"} - -
              -
              - - - {addNote && ( -
              + {showEditor && ( +
              - {/*
              - setAddNote(!addNote)} - > - {addNote ? "Hide Editor" : "Add Note"} - -
              */}
              - {errors.notes && ( + {errors.note && (

              {errors.note.message}

              )}
              )} -
              +
              {isLoading && (
              {" "}

              Loading...

              {" "}
              )} - {!isLoading && - [...(IsActive ? contactProfile?.notes || [] : contactNotes || [])] + {!isLoading && notesToDisplay.length > 0 ? ( + notesToDisplay + .slice() .reverse() .map((noteItem) => ( - ))} - - {IsActive && ( -
              - {!isLoading && contactProfile?.notes.length == 0 && !addNote && ( -
              No Notes Found
              - )} -
              - )} - {!IsActive && ( -
              - {!isLoading && contactNotes.length == 0 && !addNote && ( -
              No Notes Found
              - )} -
              + )) + ) : ( + !isLoading && !showEditor && ( +
              + {noNotesMessage} +
              + ) )}
              ); }; -export default NotesDirectory; +export default NotesDirectory; \ No newline at end of file diff --git a/src/components/Directory/ProfileContactDirectory.jsx b/src/components/Directory/ProfileContactDirectory.jsx index 62ca077f..7e30aa71 100644 --- a/src/components/Directory/ProfileContactDirectory.jsx +++ b/src/components/Directory/ProfileContactDirectory.jsx @@ -8,9 +8,10 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { const { contactProfile, loading, refetch } = useContactProfile(contact?.id); const [copiedIndex, setCopiedIndex] = useState(null); - const [profileContact, setProfileContact] = useState(); + const [profileContactState, setProfileContactState] = useState(null); const [expanded, setExpanded] = useState(false); - const description = contactProfile?.description || ""; + + const description = profileContactState?.description || ""; const limit = 500; const toggleReadMore = () => setExpanded(!expanded); @@ -19,14 +20,51 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => { const displayText = expanded ? description : description.slice(0, limit) + (isLong ? "..." : ""); + useEffect(() => { - setProfileContact(contactProfile); - }, [contactProfile]); + if (contactProfile) { + const names = (contact?.name || "").trim().split(" "); + let firstName = ""; + let middleName = ""; + let lastName = ""; + let fullName = contact?.name || ""; + + // Logic to determine first, middle, and last names + if (names.length === 1) { + firstName = names[0]; + } else if (names.length === 2) { + firstName = names[0]; + lastName = names[1]; + } else if (names.length >= 3) { + firstName = names[0]; + middleName = names[1]; // This was an error in the original prompt, corrected to names[1] + lastName = names[names.length - 1]; + // Reconstruct full name to be precise with spacing + fullName = `${firstName} ${middleName ? middleName + ' ' : ''}${lastName}`; + } else { + // Fallback if no names or empty string + firstName = "Contact"; + fullName = "Contact"; + } + + + setProfileContactState({ + ...contactProfile, + firstName: contactProfile.firstName || firstName, + // Adding middleName and lastName to the state for potential future use or more granular access + middleName: contactProfile.middleName || middleName, + lastName: contactProfile.lastName || lastName, + fullName: contactProfile.fullName || fullName, // Prioritize fetched fullName, fallback to derived + }); + } + }, [contactProfile, contact?.name]); + const handleCopy = (email, index) => { navigator.clipboard.writeText(email); setCopiedIndex(index); - setTimeout(() => setCopiedIndex(null), 2000); // Reset after 2 seconds + setTimeout(() => setCopiedIndex(null), 2000); }; + return (
              @@ -47,29 +85,34 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              {contact?.name} - {contactProfile?.designation} + {profileContactState?.designation}
              -
              +
              - {contactProfile?.contactEmails?.length > 0 && ( -
              -
              - -

              Email :

              + {profileContactState?.contactEmails?.length > 0 && ( +
              +
              + + + Email + + :
              +
                - {contactProfile.contactEmails.map((email, idx) => ( + {profileContactState.contactEmails.map((email, idx) => (
              • - + {email.emailAddress} {
              )} - {contactProfile?.contactPhones?.length > 0 && ( -
              -
              - -

              Phone :

              + {profileContactState?.contactPhones?.length > 0 && ( +
              +
              + + + Phone + + :
              +
                - {contactProfile.contactPhones.map((phone, idx) => ( + {profileContactState.contactPhones.map((phone, idx) => (
              • {phone.phoneNumber} - {idx < contactProfile.contactPhones.length - 1 && ","} + {idx < profileContactState.contactPhones.length - 1 && ","}
                • ))}
              @@ -104,73 +148,92 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              )} - - {contactProfile?.createdAt && ( -
              -
              - -

              Created :

              + {profileContactState?.createdAt && ( +
              +
              + + + Created + + :
              +
              -
            • - {moment(contactProfile.createdAt).format("MMMM, DD YYYY")} -
              • + + {moment(profileContactState.createdAt).format("MMMM DD, YYYY")} +
              )} - {contactProfile?.address && ( -
              -
              - -

              Location :

              -
              -
              - - {contactProfile.address} + + {profileContactState?.address && ( +
              +
              + + + Location + : +
              +
              + {profileContactState.address}
              )}
              - {contactProfile?.organization && ( -
              -
              - -

              Organization :

              + {profileContactState?.organization && ( +
              +
              + + + Organization + + :
              +
              - {contactProfile.organization} + {profileContactState.organization}
              )} - {contactProfile?.contactCategory && ( -
              -
              - -

              Category :

              + + {profileContactState?.contactCategory && ( +
              +
              + + + Category + + :
              +
              • - {contactProfile.contactCategory.name} + {profileContactState.contactCategory.name}
              )} - {contactProfile?.tags?.length > 0 && ( -
              -
              - -

              Tags :

              + + {profileContactState?.tags?.length > 0 && ( +
              +
              + + + Tags + + :
              +
                - {contactProfile.tags.map((tag, index) => ( + {profileContactState.tags.map((tag, index) => (
              • {tag.name}
                • @@ -180,69 +243,76 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              )} - {contactProfile?.buckets?.length > 0 && ( -
              - {contactProfile?.contactEmails?.length > 0 && ( -
              -
              -

              - Buckets : -

              -
              -
              -
                - {contactProfile.buckets.map((bucket) => ( -
              • - - {bucket.name} - -
                • - ))} -
              -
              -
              - )} + {profileContactState?.buckets?.length > 0 && ( +
              +
              + + + Buckets + + : +
              + +
              +
                + {profileContactState.buckets.map((bucket) => ( +
              • + + {bucket.name} + +
                • + ))} +
              +
              )} -
              + + {profileContactState?.projects?.length > 0 && ( +
              +
              + + + Projects + + : +
              + +
              +
                + {profileContactState.projects.map((project, index) => ( +
              • + {project.name} + {index < profileContactState.projects.length - 1 && ","} +
                • + ))} +
              +
              +
              + )}
              - {contactProfile?.projects?.length > 0 && ( -
              -
              -

              - Projects : -

              -
              -
              -
                - {contactProfile.projects.map((project, index) => ( -
              • - {project.name} - {index < contactProfile.projects.length - 1 && ","} -
                • - ))} -
              -
              -
              - )} - -
              -
              -

              - Description : -

              +
              +
              + + + Description + + :
              +
              {displayText} {isLong && ( - - {expanded ? "Read less" : "Read more"} - + <> +
              + + {expanded ? "Read less" : "Read more"} + + )}
              @@ -252,12 +322,12 @@ const ProfileContactDirectory = ({ contact, setOpen_contact, closeModal }) => {
              ); }; -export default ProfileContactDirectory; +export default ProfileContactDirectory; \ No newline at end of file From 832685fedd04bc10f8ec972d6898e4d04818ea54 Mon Sep 17 00:00:00 2001 From: Kartik Sharma Date: Sat, 26 Jul 2025 10:44:02 +0530 Subject: [PATCH 06/23] Changes in Contact Profile. --- src/components/Directory/NotesDirectory.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Directory/NotesDirectory.jsx b/src/components/Directory/NotesDirectory.jsx index f310bfcc..3efb2340 100644 --- a/src/components/Directory/NotesDirectory.jsx +++ b/src/components/Directory/NotesDirectory.jsx @@ -111,7 +111,7 @@ const NotesDirectory = ({

              Notes :

              -
              +
              {(contactProfile?.notes?.length > 0 || contactNotes?.length > 0) && (