diff --git a/demos/demo-minimal-js/index.js b/demos/demo-minimal-js/index.js index b574ac4..f67f1cb 100644 --- a/demos/demo-minimal-js/index.js +++ b/demos/demo-minimal-js/index.js @@ -6,10 +6,11 @@ import { messageType, callEndStatus } from "../../src/Constants"; export const state = { engagementId: 0, - toNumber: "+1234", fromNumber: "+123456", - userAvailable: false, incomingContactName: "", + toNumber: "+1234", + userAvailable: false, + userId: 0, }; const sizeInfo = { @@ -46,18 +47,25 @@ function enableButtons(ids) { const cti = new CallingExtensions({ debugMode: true, eventHandlers: { - onReady: data => { + onReady: ({ engagementId, portalId, userId } = {}) => { cti.initialized({ + engagementId, isLoggedIn: false, sizeInfo, - engagementId: data.engagementId, }); disableButtons([INITIALIZE]); - if (data.engagementId) { + if (engagementId) { enableButtons([ANSWER_CALL, END_CALL]); + state.engagementId = engagementId; return; } enableButtons([LOG_IN, SEND_ERROR, RESIZE_WIDGET]); + if (portalId) { + state.portalId = portalId; + } + if (userId) { + state.userId = userId; + } }, onDialNumber: (data, rawEvent) => { const { phoneNumber } = data; diff --git a/demos/demo-react-ts/src/hooks/useCti.ts b/demos/demo-react-ts/src/hooks/useCti.ts index 0ca2f67..359f5cd 100644 --- a/demos/demo-react-ts/src/hooks/useCti.ts +++ b/demos/demo-react-ts/src/hooks/useCti.ts @@ -154,17 +154,19 @@ export const useCti = ( debugMode: true, eventHandlers: { onReady: (data: { engagementId: number | undefined }) => { + const { engagementId } = data || {}; cti.initialized({ isLoggedIn: true, sizeInfo: defaultSize, - engagementId: data.engagementId, + engagementId, }); const incomingNumber = window.localStorage.getItem(INCOMING_NUMBER_KEY); const incomingContactName = window.localStorage.getItem( INCOMING_CONTACT_NAME_KEY ); - if (data.engagementId && incomingNumber && incomingContactName) { + if (engagementId && incomingNumber && incomingContactName) { + setEngagementId(engagementId); cti.incomingNumber = incomingNumber; setIncomingContactName(incomingContactName); initializeCallingStateForExistingCall(incomingNumber); @@ -248,7 +250,7 @@ export const useCti = ( }, }, }); - }, []); + }, [initializeCallingStateForExistingCall]); return { phoneNumber, engagementId, diff --git a/package-lock.json b/package-lock.json index 722556a..3001f67 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@hubspot/calling-extensions-sdk", - "version": "0.4.1", + "version": "0.5.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@hubspot/calling-extensions-sdk", - "version": "0.4.1", + "version": "0.5.0", "license": "MIT", "devDependencies": { "@babel/cli": "^7.21.0", diff --git a/package.json b/package.json index 3a9bd7a..16af7a7 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@hubspot/calling-extensions-sdk", - "version": "0.4.1", + "version": "0.5.0", "description": "A JavaScript SDK for integrating calling apps into HubSpot.", "publishConfig": { "access": "public" @@ -10,7 +10,7 @@ "build:test": "npm run build && npm run test", "cover": "open coverage/lcov-report/index.html", "eslint": "eslint src --ext .js", - "eslint:fix": "eslint src .js --fix", + "eslint:fix": "eslint src --ext .js --fix", "preversion": "npm run build:test", "postversion": "git push --follow-tags", "publish:alpha:current": "npm publish --access public --tag alpha", diff --git a/src/IFrameManager.js b/src/IFrameManager.js index 4ed528e..738088e 100644 --- a/src/IFrameManager.js +++ b/src/IFrameManager.js @@ -77,7 +77,9 @@ class IFrameManager { } static createIFrame(iFrameOptions, onLoadCallback) { - const { src, width, height, hostElementSelector } = iFrameOptions; + const { + src, width, height, hostElementSelector, + } = iFrameOptions; if (!src || !width || !height || !hostElementSelector) { throw new Error( @@ -118,11 +120,11 @@ class IFrameManager { } } - onReady(engagementId) { + onReady(data = {}) { this.isReady = true; this.onMessageHandler({ type: messageType.READY, - data: { engagementId }, + data, }); } @@ -179,7 +181,9 @@ class IFrameManager { onMessage(event) { const { data, origin } = event; - const { type, engagementId } = event.data; + const { + type, engagementId, portalId, userId, + } = event.data; if (type === messageType.SYNC) { // The iFrame host can send this message multiple times, don't respond more than once if (!this.isReady) { @@ -196,7 +200,7 @@ class IFrameManager { this.destinationHost = hostUrl || this.destinationHost; this.logDebugMessage(prefix, debugMessageType.FROM_HUBSPOT, type, data); this.sendMessage(message); - this.onReady(engagementId); + this.onReady({ engagementId, portalId, userId }); } return; }