Merge pull request #3017 from glific/contact-names

Made contact name consistent everywhere
glific · Aug 20, 2024 · 7cda788 · 7cda788
2 parents ec2bfed + 0cc6824
commit 7cda788
Show file tree

Hide file tree

Showing 9 changed files with 47 additions and 18 deletions.
diff --git a/src/common/constants.ts b/src/common/constants.ts
@@ -339,7 +339,7 @@ export const getConversation = (
       selectedRecord = true;
     }
     entityId = conversation.contact.id;
-    displayName = getDisplayName(conversation);
+    displayName = getDisplayName(conversation.contact);
     contactIsOrgRead = conversation.contact.isOrgRead;
     timer = {
       contactStatus: conversation.contact.status,

diff --git a/src/common/utils.ts b/src/common/utils.ts
@@ -167,27 +167,27 @@ export const getInteractiveMessageBody = (interactiveJSON: any) => {
   return messageBody;
 };
 
-export const getDisplayName = (conversation: any) => {
+export const getDisplayName = (contact: any) => {
   // let's return early with default simulator name if we are looking at simulator contact
-  const isSimulatorContact = isSimulator(conversation.contact.phone);
+  const isSimulatorContact = isSimulator(contact.phone);
   if (isSimulatorContact) {
-    return conversation.contact.name || conversation.contact.maskedPhone;
+    return contact.name || contact.maskedPhone;
   }
 
   let displayName = '';
   let contactFields: any = {};
   try {
-    contactFields = JSON.parse(conversation.contact.fields);
+    contactFields = JSON.parse(contact.fields);
   } catch (er) {
     setLogs(er, 'error');
   }
 
-  if (contactFields?.name && contactFields.name.value) {
+  if (contactFields?.name?.value) {
     displayName = contactFields.name.value;
-  } else if (conversation.contact.name) {
-    displayName = conversation.contact.name;
+  } else if (contact.name) {
+    displayName = contact.name;
   } else {
-    displayName = conversation.contact.maskedPhone;
+    displayName = contact.maskedPhone;
   }
   return displayName;
 };

diff --git a/src/containers/Chat/ChatMessages/ChatMessages.test.tsx b/src/containers/Chat/ChatMessages/ChatMessages.test.tsx
@@ -123,12 +123,13 @@ export const searchQuery = {
         group: null,
         contact: {
           id: '2',
-          name: 'Effie Cormier',
+          name: null,
           phone: '987654321',
           maskedPhone: '98****321',
           lastMessageAt: new Date(),
           status: 'VALID',
-          fields: '{}',
+          fields:
+            '{"name":{"value":"Effie Cormier","type":"string","label":"name","inserted_at":"2024-08-12T04:40:25.098162Z"}}',
           bspStatus: 'SESSION_AND_HSM',
           isOrgRead: true,
         },

diff --git a/src/containers/Chat/ChatMessages/ChatMessages.tsx b/src/containers/Chat/ChatMessages/ChatMessages.tsx
@@ -740,7 +740,9 @@ export const ChatMessages = ({ entityId, collectionId, phoneId }: ChatMessagesPr
   const isSimulatorProp = groups ? false : isSimulator(conversationInfo.contact?.phone);
 
   if (entityId && conversationInfo[chatType]) {
-    const displayName = groups ? conversationInfo.waGroup.label : getDisplayName(conversationInfo);
+    const displayName = groups
+      ? conversationInfo.waGroup.label
+      : getDisplayName(conversationInfo[chatType]);
 
     topChatBar = (
       <ConversationHeader

diff --git a/src/containers/Profile/Contact/ContactProfile.test.tsx b/src/containers/Profile/Contact/ContactProfile.test.tsx
@@ -27,9 +27,22 @@ describe('contact profile', () => {
   );
 
   test('contact profile should render', async () => {
-    const { getByText } = render(contactProfile);
+    const { getByText, getAllByRole } = render(contactProfile);
     await waitFor(() => {
       expect(getByText('Profile')).toBeInTheDocument();
     });
+
+    await waitFor(() => {
+      expect(getByText('Loading...')).toBeInTheDocument();
+    });
+
+    await waitFor(() => {
+      expect(getByText('Provider status')).toBeInTheDocument();
+    });
+
+    // shows N/A when no name
+    await waitFor(() => {
+      expect(getAllByRole('textbox')[0]).toHaveValue('N/A');
+    });
   });
 });
diff --git a/src/containers/Profile/Contact/ContactProfile.tsx b/src/containers/Profile/Contact/ContactProfile.tsx
@@ -50,7 +50,7 @@ export const ContactProfile = () => {
   const { phone, maskedPhone, groups, lastMessage, settings, activeProfile } = contactData;
   let { fields } = contactData;
 
-  const contactDisplayName = getDisplayName(contact);
+  const contactDisplayName = getDisplayName(contactData);
 
   let selectedProfile;
 

diff --git a/src/containers/Profile/Profile.tsx b/src/containers/Profile/Profile.tsx
@@ -18,7 +18,7 @@ import {
 } from 'graphql/mutations/Contact';
 import { GET_CURRENT_USER } from 'graphql/queries/User';
 import { getOrganizationServices } from 'services/AuthService';
-import { isSimulator } from 'common/utils';
+import { getDisplayName, isSimulator } from 'common/utils';
 import { AutoComplete } from 'components/UI/Form/AutoComplete/AutoComplete';
 
 const profileIcon = <ProfileIcon />;
@@ -102,10 +102,19 @@ export const Profile = ({
     status: statusValue,
     bspStatus: bspStatusValue,
     language: languageIdValue,
+    fields: fieldsValue,
   }: any) => {
-    setName(nameValue);
     updateName();
     let hideDeleteButton = false;
+    let displayName = getDisplayName({
+      name: nameValue,
+      fields: fieldsValue,
+      phone: phoneValue,
+    });
+
+    if (!displayName) {
+      displayName = 'N/A';
+    }
 
     if (phoneValue) {
       setPhone(phoneValue);
@@ -117,6 +126,7 @@ export const Profile = ({
       hideDeleteButton = organizationPhone === currentUserPhone;
     }
 
+    setName(displayName);
     setStatus(statusValue);
     setBspStatus(bspStatusValue);
     setHideRemoveBtn(hideDeleteButton);

diff --git a/src/graphql/queries/Contact.ts b/src/graphql/queries/Contact.ts
@@ -113,6 +113,7 @@ export const GET_CONTACT_DETAILS = gql`
   query getContact($id: ID!) {
     contact(id: $id) {
       contact {
+        name
         activeProfile {
           id
         }

diff --git a/src/mocks/Contact.tsx b/src/mocks/Contact.tsx
@@ -78,15 +78,15 @@ export const getContactSampleQuery = (variables: any) => {
         contact: {
           contact: {
             id: '1',
-            name: 'Default User',
+            name: null,
             activeProfile: null,
             phone: '+919820198765',
             language: { id: '1', label: 'English' },
             groups: [],
             status: 'VALID',
             bspStatus: 'SESSION_AND_HSM',
             settings: {},
-            fields: {},
+            fields: '{}',
           },
         },
       },
@@ -125,6 +125,7 @@ export const getContactDetailsQuery = (attributes: any = {}) => ({
       contact: {
         contact: {
           ...attributes,
+          name: 'Default User',
           activeProfile: null,
           phone: '+919820198765',
           maskedPhone: '+919820198765',
@@ -510,6 +511,7 @@ export const LOGGED_IN_USER_MOCK = [
   getCurrentUserQuery,
   getContactProfiles,
   getContactDetailsQuery(),
+  getContactDetailsQuery(),
   getOrganizationLanguagesQuery,
   getOrganizationLanguagesQuery,
   getContactQuery,