How to change Incoming pop up with Contact person Name from our DB?

  • 1
  • Idea
  • Updated 3 weeks ago
  • (Edited)
Hello Support,

for an incoming call are we doing a screen pop if the phone number matches a contact's phone number?

Also we need to be able to define what happens if the incoming number doesn't match any of the contact phone numbers in the database then it should redirect to other page like below.
- Add a lead pages
- Open a custom form
- Display the search page
- Display the home page with quick search open

Can we change incoming pop up with person name if incoming number match in out DB ?

Thank you,

Photo of Jatin Barot

Jatin Barot

  • 94 Points 75 badge 2x thumb

Posted 4 weeks ago

  • 1
Photo of Phong Vu

Phong Vu, Devangelist

  • 3,102 Points 3k badge 2x thumb
Hi Jatin,

Can you be more specific about the popup environment?  Are you talking about the RingCentral embeddable web widget or some other integrations?

Thanks,
Phong
Photo of Jatin Barot

Jatin Barot

  • 94 Points 75 badge 2x thumb
Hello Phong Vu,

Yes, I want to change incoming popup of RingCentral embeddable web widget.

If I receive incoming call then I want to see Contact name instead of phone number / Anonymous

http://prntscr.com/l9d5z2

It should check first incoming number in our database and if number matched then it should show that contact Name.

Thank you,
Jatin
Photo of Embbnux Ji

Embbnux Ji, Employee

  • 948 Points 500 badge 2x thumb
Hi, Jatin, you can use third party contact service feature to support this https://github.com/ringcentral/ringcentral-embeddable/blob/master/docs/third-party-service-in-widget...  In incoming call page, widget will request `contact match` service to get the contact name. 

For your requirements in incoming call, I think you can listen to incoming call event. You can get phone number in that event, and add logics to implement them.
Photo of Jatin Barot

Jatin Barot

  • 94 Points 75 badge 2x thumb
Hi,

what is difference between this 
contactsPath: '/contacts',
contactSearchPath: '/contacts/search', 
contactMatchPath: '/contacts/match',

Do I need to replace this value with my application Contact search api endpoint ?

Please give me any sample if possible.

Thank you,
Jatin
Photo of Embbnux Ji

Embbnux Ji, Employee

  • 926 Points 500 badge 2x thumb
Hi,Jatin
For first question:
  1. Data from contactsPath will be showed in contacts list page in widget.
  2. Data from contactSearchPath will be showed in contacts search dropdown in dial page.
  3. Data from contactMatchPath will be showed on messages, call history and call page in the widget.
If you just want to change incoming call popup contact name, you just need contactMatchPath .

For second question:

You don't need to replace your endpoint. Just need to add scripts in your HTML out of widget to create a message listener and response to widget. It likes a proxy from your endpoints to widget.

window.addEventListener('message', function (e) {
  var data = e.data;
  if (data && data.type === 'rc-post-message-request') {
    if (data.path === '/contacts/match') {
      console.log(data); // include phone number array that need to match
      // Add your logic here to create matchedContacts;
      const matchedContacts = {
        '+12165325078': [
          {
            id: '123456', // id to identify third party contact
            type: 'TestService', // need to same as service name
            name: 'TestService 1',
            phoneNumbers: [{
              phoneNumber: '+12165325078',
              phoneType: 'directPhone',
            }]
          }
        ]
      };
      // return matched contact object with phone number as key
      document.querySelector("#rc-widget-adapter-frame").contentWindow.postMessage({
        type: 'rc-post-message-response',
        responseId: data.requestId,
        response: {
          data: matchedContacts
        },
      }, '*');
    }
  }
});