CODEWITHSUNDEEP
angulartypescripthubspot
Clark Chan
Clark Chan

Reputation: 31

how to use hubspot Conversations sdk on typescript/angular program?

I got some javascript code form https://developers.hubspot.com/docs/api/conversation/chat-widget-sdk

window.HubSpotConversations.widget.load();
window.HubSpotConversations.widget.refresh();
window.HubSpotConversations.widget.open();
window.HubSpotConversations.widget.close();

Now I want to hide or show HubSpot chat bubble on different pages on a typescript/angular program, any idea about it? thanks in advance

Upvotes: 1

Views: 2459

Answers (1)

Jaqueline
Jaqueline

Reputation: 37

To hide/remove the Hubspot chat bubble you can use the methods available on window, like:

window.HubSpotConversations.widget.remove();

to load it again, you can use either:

window.HubSpotConversations.widget.load();

or, if you want to reset and reload (in case you changed some user info for example):

window.HubSpotConversations.widget.resetAndReloadWidget();

And also, for typescript you will need to add a type for the elements you are going to use something like:

declare global {
  var HubSpotConversations: {
    widget: {
      remove: () => void;
      load: () => void;
    };
  };
}

You can check the docs: https://developers.hubspot.com/docs/api/conversation/chat-widget-sdk

Upvotes: 4

Related Questions