@product7/product7-js 0.3.2 → 0.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@product7/product7-js",
-	"version": "0.3.2",
+	"version": "0.3.5",
 	"description": "JavaScript SDK for integrating Product7 feedback widgets into any website",
 	"main": "dist/product7-js.js",
 	"module": "src/index.js",

package/src/api/services/MessengerService.js

@@ -225,36 +225,7 @@ export class MessengerService {
 	}
 
 	async identifyContact(data) {
-		await this.api._ensureSession();
-
-		if (this.api.mock) {
-			await delay(300);
-			return {
-				status: true,
-				data: {
-					contact_id: 'mock_contact_' + Date.now(),
-					email: data.email,
-					name: data.name || '',
-					is_new: true,
-				},
-			};
-		}
-
-		return this.api._makeRequest('/widget/messenger/identify', {
-			method: 'POST',
-			headers: {
-				'Content-Type': 'application/json',
-				Authorization: `Bearer ${this.api.sessionToken}`,
-			},
-			body: JSON.stringify({
-				email: data.email,
-				name: data.name || '',
-				phone: data.phone || '',
-				company: data.company || '',
-				avatar_url: data.avatar_url || '',
-				metadata: data.metadata || {},
-			}),
-		});
+		return this.api.identify(data);
 	}
 
 	async sendTypingIndicator(conversationId, isTyping) {

package/src/core/APIService.js

@@ -224,8 +224,94 @@ export class APIService extends BaseAPIService {
 		return this.messenger.submitRating(conversationId, data);
 	}
 
+	async identify(metadata) {
+		await this._ensureSession();
+
+		if (this.mock) {
+			await new Promise((r) => setTimeout(r, 300));
+			const mockResponse = {
+				status: true,
+				data: {
+					contact_id: 'mock_contact_' + Date.now(),
+					email: metadata.email,
+					name: metadata.name || '',
+					is_new: true,
+				},
+			};
+			this._storeContactIdentity(mockResponse.data, metadata);
+			return mockResponse;
+		}
+
+		const response = await this._makeRequest('/widget/messenger/identify', {
+			method: 'POST',
+			headers: {
+				'Content-Type': 'application/json',
+				Authorization: `Bearer ${this.sessionToken}`,
+			},
+			body: JSON.stringify({
+				user_id: metadata.user_id || null,
+				email: metadata.email || '',
+				name: metadata.name || '',
+				phone: metadata.phone || '',
+				company: metadata.company || '',
+				avatar_url: metadata.avatar_url || '',
+				metadata: metadata.custom_fields || {},
+			}),
+		});
+
+		if (response?.status && response?.data) {
+			this._storeContactIdentity(response.data, metadata);
+		}
+
+		return response;
+	}
+
+	_storeContactIdentity(data, metadata = {}) {
+		this.contactId = data.contact_id || null;
+		this.contactEmail = data.email || metadata.email || null;
+		this.contactName = data.name || metadata.name || null;
+
+		try {
+			localStorage.setItem(
+				'product7_contact',
+				JSON.stringify({
+					contactId: this.contactId,
+					contactEmail: this.contactEmail,
+					contactName: this.contactName,
+				})
+			);
+		} catch (e) {
+			/* silent */
+		}
+	}
+
+	getContactIdentity() {
+		if (this.contactId) {
+			return {
+				contactId: this.contactId,
+				contactEmail: this.contactEmail,
+				contactName: this.contactName,
+			};
+		}
+
+		try {
+			const stored = localStorage.getItem('product7_contact');
+			if (stored) {
+				const parsed = JSON.parse(stored);
+				this.contactId = parsed.contactId;
+				this.contactEmail = parsed.contactEmail;
+				this.contactName = parsed.contactName;
+				return parsed;
+			}
+		} catch (e) {
+			/* silent */
+		}
+
+		return null;
+	}
+
 	async identifyContact(data) {
-		return this.messenger.identifyContact(data);
+		return this.identify(data);
 	}
 
 	async getHelpCollections(options) {

package/src/core/BaseAPIService.js

@@ -6,11 +6,16 @@ export class BaseAPIService {
 		this.sessionToken = null;
 		this.sessionExpiry = null;
 		this.metadata = config.metadata || null;
+		this.identitySyncedToken = null;
 		this.mock = config.mock || false;
 		this.env = config.env || 'production';
 		this.baseURL = this._getBaseURL(config);
 
 		this._loadStoredSession();
+		this._loadStoredMetadata();
+		if (this.isSessionValid() && this.metadata) {
+			this.identitySyncedToken = this.sessionToken;
+		}
 	}
 
 	_getBaseURL(config) {
@@ -50,20 +55,17 @@ export class BaseAPIService {
 			: envConfig.base;
 	}
 
-	async init(metadata = null) {
-		if (metadata) {
-			this.metadata = metadata;
+	async init(metadata = undefined) {
+		if (metadata !== undefined) {
+			this.setMetadata(metadata);
 		}
 
 		if (this.isSessionValid()) {
 			return { sessionToken: this.sessionToken };
 		}
 
-		if (!this.workspace || !this.metadata) {
-			throw new APIError(
-				400,
-				`Missing ${!this.workspace ? 'workspace' : 'user context'} for initialization`
-			);
+		if (!this.workspace) {
+			throw new APIError(400, 'Missing workspace for initialization');
 		}
 
 		if (this.mock) {
@@ -76,6 +78,7 @@ export class BaseAPIService {
 	async _initMockSession() {
 		this.sessionToken = 'mock_session_' + Date.now();
 		this.sessionExpiry = new Date(Date.now() + 3600 * 1000);
+		this.identitySyncedToken = null;
 		this._storeSession();
 		return {
 			sessionToken: this.sessionToken,
@@ -94,7 +97,6 @@ export class BaseAPIService {
 	async _initRealSession() {
 		const payload = {
 			workspace: this.workspace,
-			user: this.metadata,
 		};
 
 		try {
@@ -107,6 +109,7 @@ export class BaseAPIService {
 
 			this.sessionToken = initData.sessionToken;
 			this.sessionExpiry = new Date(Date.now() + initData.expiresIn * 1000);
+			this.identitySyncedToken = null;
 			this._storeSession();
 
 			return {
@@ -173,12 +176,52 @@ export class BaseAPIService {
 				this.sessionToken = null;
 				this.sessionExpiry = null;
 				await this.init();
+				await this._restoreIdentity();
 				return await method.apply(this, args);
 			}
 			throw error;
 		}
 	}
 
+	async identify(metadata = this.metadata) {
+		if (metadata !== undefined) {
+			this.setMetadata(metadata);
+		}
+
+		if (!this.metadata) {
+			throw new APIError(400, 'Missing user context for identify');
+		}
+
+		await this._ensureSession();
+
+		const payload = this._buildIdentifyPayload(this.metadata);
+
+		if (this.mock) {
+			this.identitySyncedToken = this.sessionToken;
+			return {
+				status: true,
+				identified: true,
+				data: {
+					user_id: payload.user_id || null,
+					email: payload.email || null,
+					name: payload.name || null,
+				},
+			};
+		}
+
+		const response = await this._makeRequest('/widget/identify', {
+			method: 'POST',
+			body: JSON.stringify(payload),
+			headers: {
+				'Content-Type': 'application/json',
+				Authorization: `Bearer ${this.sessionToken}`,
+			},
+		});
+
+		this.identitySyncedToken = this.sessionToken;
+		return response;
+	}
+
 	isSessionValid() {
 		return (
 			this.sessionToken && this.sessionExpiry && new Date() < this.sessionExpiry
@@ -186,8 +229,13 @@ export class BaseAPIService {
 	}
 
 	setMetadata(metadata) {
-		this.metadata = metadata;
-		this._storeData('product7_metadata', metadata);
+		this.metadata = metadata || null;
+		this.identitySyncedToken = null;
+		if (this.metadata) {
+			this._storeData('product7_metadata', this.metadata);
+		} else {
+			this._removeData('product7_metadata');
+		}
 	}
 
 	getMetadata() {
@@ -197,8 +245,13 @@ export class BaseAPIService {
 	clearSession() {
 		this.sessionToken = null;
 		this.sessionExpiry = null;
+		this.identitySyncedToken = null;
+		this.contactId = null;
+		this.contactEmail = null;
+		this.contactName = null;
 		this._removeData('product7_session');
 		this._removeData('product7_metadata');
+		this._removeData('product7_contact');
 	}
 
 	_storeSession() {
@@ -222,6 +275,14 @@ export class BaseAPIService {
 			if (!stored) return false;
 
 			const sessionData = JSON.parse(stored);
+			if (
+				this.workspace &&
+				sessionData.workspace &&
+				sessionData.workspace !== this.workspace
+			) {
+				localStorage.removeItem('product7_session');
+				return false;
+			}
 			this.sessionToken = sessionData.token;
 			this.sessionExpiry = new Date(sessionData.expiry);
 
@@ -231,6 +292,32 @@ export class BaseAPIService {
 		}
 	}
 
+	_loadStoredMetadata() {
+		if (this.metadata || typeof localStorage === 'undefined') return false;
+
+		try {
+			const session = localStorage.getItem('product7_session');
+			if (session) {
+				const sessionData = JSON.parse(session);
+				if (
+					this.workspace &&
+					sessionData.workspace &&
+					sessionData.workspace !== this.workspace
+				) {
+					return false;
+				}
+			}
+
+			const stored = localStorage.getItem('product7_metadata');
+			if (!stored) return false;
+
+			this.metadata = JSON.parse(stored);
+			return true;
+		} catch (error) {
+			return false;
+		}
+	}
+
 	_storeData(key, value) {
 		if (typeof localStorage !== 'undefined') {
 			localStorage.setItem(key, JSON.stringify(value));
@@ -293,4 +380,34 @@ export class BaseAPIService {
 		const queryString = this._buildQueryParams(params);
 		return `${endpoint}${queryString ? '?' + queryString : ''}`;
 	}
+
+	_buildIdentifyPayload(metadata = {}) {
+		const payload = {
+			user_id: metadata.user_id,
+			email: metadata.email,
+			name: metadata.name,
+			avatar:
+				metadata.profile_picture || metadata.avatar_url || metadata.avatar,
+			attributes: metadata.custom_fields || {},
+		};
+
+		if (metadata.company) {
+			payload.company = metadata.company;
+		}
+
+		return payload;
+	}
+
+	async _restoreIdentity() {
+		if (
+			!this.metadata ||
+			!this.sessionToken ||
+			!this.identitySyncedToken ||
+			this.identitySyncedToken === this.sessionToken
+		) {
+			return;
+		}
+
+		await this.identify(this.metadata);
+	}
 }

package/src/core/Product7.js

@@ -9,6 +9,7 @@ export class Product7 {
 	constructor(config = {}) {
 		this.config = this._validateAndMergeConfig(config);
 		this.initialized = false;
+		this.identified = false;
 		this.widgets = new Map();
 		this.eventBus = new EventBus();
 
@@ -53,13 +54,14 @@ export class Product7 {
 		this._injectStyles();
 
 		try {
-			const initData = await this.apiService.init(this.config.metadata);
+			const initData = await this.apiService.init();
 
 			if (initData.config) {
 				this.config = deepMerge(initData.config, this.config);
 			}
 
 			this.initialized = true;
+			const identifyResult = await this._syncConfiguredMetadataAfterInit();
 			this.eventBus.emit('sdk:initialized', {
 				config: this.config,
 				sessionToken: initData.sessionToken,
@@ -70,6 +72,7 @@ export class Product7 {
 				config: initData.config || {},
 				sessionToken: initData.sessionToken,
 				expiresIn: initData.expiresIn,
+				identified: Boolean(identifyResult?.identified),
 			};
 		} catch (error) {
 			this.eventBus.emit('sdk:error', { error });
@@ -84,10 +87,14 @@ export class Product7 {
 			);
 		}
 
+		const requestedType = type || 'button';
+		const normalizedType = this._normalizeWidgetType(requestedType);
 		const widgetId = generateId('widget');
-		const widgetConfig = this._getWidgetTypeConfig(type);
-		const explicitOptions = this._omitUndefined(options);
-		const widgetEnabled = this._isWidgetEnabled(type, {
+		const widgetConfig = this._getWidgetTypeConfig(normalizedType);
+		const explicitOptions = this._omitUndefined(
+			this._normalizeWidgetOptions(normalizedType, options)
+		);
+		const widgetEnabled = this._isWidgetEnabled(normalizedType, {
 			...widgetConfig,
 			...explicitOptions,
 		});
@@ -102,15 +109,35 @@ export class Product7 {
 		};
 
 		try {
-			const widget = WidgetFactory.create(type, widgetOptions);
+			const widget = WidgetFactory.create(normalizedType, widgetOptions);
 			this.widgets.set(widgetId, widget);
-			this.eventBus.emit('widget:created', { widget, type });
+			this.eventBus.emit('widget:created', {
+				widget,
+				type: requestedType,
+				internalType: normalizedType,
+			});
 			return widget;
 		} catch (error) {
 			throw new SDKError(`Failed to create widget: ${error.message}`, error);
 		}
 	}
 
+	createFeedbackWidget(options = {}) {
+		return this.createWidget('feedback', options);
+	}
+
+	createMessengerWidget(options = {}) {
+		return this.createWidget('messenger', options);
+	}
+
+	createChangelogWidget(options = {}) {
+		return this.createWidget('changelog', options);
+	}
+
+	createSurveyWidget(options = {}) {
+		return this.createWidget('survey', options);
+	}
+
 	getWidget(id) {
 		return this.widgets.get(id);
 	}
@@ -229,7 +256,7 @@ export class Product7 {
 			return null;
 		}
 
-		const surveyWidget = this.createWidget('survey', {
+		const surveyWidget = this.createSurveyWidget({
 			surveyId: normalizedOptions.surveyId,
 			surveyType:
 				normalizedOptions.surveyType || normalizedOptions.type || 'nps',
@@ -463,18 +490,34 @@ export class Product7 {
 			? this.config.widgets
 			: {};
 
-		const legacyTypeConfig = this._isPlainObject(this.config?.[type])
-			? this.config[type]
-			: {};
+		const mergedTypeConfig = this._getWidgetTypeAliases(type).reduce(
+			(config, alias) => {
+				const legacyTypeConfig = this._isPlainObject(this.config?.[alias])
+					? this.config[alias]
+					: {};
 
-		const namespacedTypeConfig = this._isPlainObject(widgetsConfig?.[type])
-			? widgetsConfig[type]
-			: {};
+				const namespacedTypeConfig = this._isPlainObject(widgetsConfig?.[alias])
+					? widgetsConfig[alias]
+					: {};
 
-		const mergedTypeConfig = deepMerge(legacyTypeConfig, namespacedTypeConfig);
+				return deepMerge(
+					config,
+					deepMerge(legacyTypeConfig, namespacedTypeConfig)
+				);
+			},
+			{}
+		);
 		return this._toCamelCaseObject(mergedTypeConfig);
 	}
 
+	_getWidgetTypeAliases(type) {
+		if (type === 'button') {
+			return ['button', 'feedback'];
+		}
+
+		return [type];
+	}
+
 	_isWidgetEnabled(type, options = {}) {
 		const typeConfig = this._getWidgetTypeConfig(type);
 		if (typeConfig.enabled === false) {
@@ -517,6 +560,31 @@ export class Product7 {
 		return normalized;
 	}
 
+	_normalizeWidgetType(type) {
+		if (type === 'feedback') {
+			return 'button';
+		}
+
+		return type;
+	}
+
+	_normalizeWidgetOptions(type, options = {}) {
+		if (!this._isPlainObject(options)) {
+			return options;
+		}
+
+		const normalizedOptions = { ...options };
+		if (
+			normalizedOptions.headless === true &&
+			normalizedOptions.trigger === undefined &&
+			type !== 'survey'
+		) {
+			normalizedOptions.trigger = false;
+		}
+
+		return normalizedOptions;
+	}
+
 	_omitUndefined(value) {
 		if (!this._isPlainObject(value)) {
 			return value;
@@ -561,7 +629,7 @@ export class Product7 {
 			return null;
 		}
 
-		const changelogWidget = this.createWidget('changelog', {
+		const changelogWidget = this.createChangelogWidget({
 			...defaults,
 			...configDefaults,
 			...explicitOptions,
@@ -628,10 +696,15 @@ export class Product7 {
 	}
 
 	setMetadata(metadata) {
+		if (metadata) {
+			this._validateMetadata(metadata);
+		}
+
 		this.config.metadata = metadata;
 		if (this.apiService) {
 			this.apiService.setMetadata(metadata);
 		}
+		this.identified = false;
 		this.eventBus.emit('metadata:updated', { metadata });
 	}
 
@@ -642,11 +715,53 @@ export class Product7 {
 		);
 	}
 
+	async identify(metadata = this.config.metadata) {
+		if (!this.initialized) {
+			throw new SDKError(
+				'SDK must be initialized before identifying users. Call init() first.'
+			);
+		}
+
+		if (!metadata) {
+			throw new SDKError(
+				'Identify requires metadata. Provide at least user_id or email.'
+			);
+		}
+
+		this._validateMetadata(metadata);
+		this.setMetadata(metadata);
+
+		try {
+			const response = await this.apiService.identify(metadata);
+			const configPatch = this._extractIdentifyConfig(response);
+			if (Object.keys(configPatch).length > 0) {
+				this.updateConfig(configPatch);
+			}
+
+			this.identified = true;
+			this._applyIdentityToWidgets(metadata);
+
+			const result = {
+				identified: true,
+				metadata: this.getMetadata(),
+				response,
+			};
+
+			this.eventBus.emit('sdk:identified', result);
+			return result;
+		} catch (error) {
+			this.identified = false;
+			this.eventBus.emit('sdk:error', { error, phase: 'identify' });
+			throw new SDKError(`Failed to identify user: ${error.message}`, error);
+		}
+	}
+
 	async reinitialize(newMetadata = null) {
 		this.apiService.clearSession();
 		this.initialized = false;
+		this.identified = false;
 
-		if (newMetadata) {
+		if (newMetadata !== null) {
 			this.setMetadata(newMetadata);
 		}
 
@@ -675,10 +790,11 @@ export class Product7 {
 
 	destroy() {
 		this.destroyAllWidgets();
-		this.eventBus.removeAllListeners();
+		this.eventBus.emit('sdk:destroyed');
+		this.eventBus.clear();
 		this.apiService.clearSession();
 		this.initialized = false;
-		this.eventBus.emit('sdk:destroyed');
+		this.identified = false;
 	}
 
 	hasFeedbackBeenSubmitted(cooldownDays = 30) {
@@ -746,7 +862,7 @@ export class Product7 {
 			metadata: null,
 			position: 'right',
 			theme: 'light',
-			boardName: 'general',
+			boardName: 'feature-requests',
 			autoShow: true,
 			debug: false,
 			mock: false,
@@ -797,7 +913,12 @@ export class Product7 {
 
 	_bindMethods() {
 		this.createWidget = this.createWidget.bind(this);
+		this.createFeedbackWidget = this.createFeedbackWidget.bind(this);
+		this.createMessengerWidget = this.createMessengerWidget.bind(this);
+		this.createChangelogWidget = this.createChangelogWidget.bind(this);
+		this.createSurveyWidget = this.createSurveyWidget.bind(this);
 		this.destroyWidget = this.destroyWidget.bind(this);
+		this.identify = this.identify.bind(this);
 		this.updateConfig = this.updateConfig.bind(this);
 	}
 
@@ -833,4 +954,47 @@ export class Product7 {
 					: undefined,
 		};
 	}
+
+	async _syncConfiguredMetadataAfterInit() {
+		if (
+			!this.config.metadata ||
+			this.apiService.identitySyncedToken === this.apiService.sessionToken
+		) {
+			return null;
+		}
+
+		try {
+			return await this.identify(this.config.metadata);
+		} catch (error) {
+			if (this.config.debug) {
+				console.warn('[Product7] Initial identify failed:', error);
+			}
+			return null;
+		}
+	}
+
+	_extractIdentifyConfig(response) {
+		const payload = this._isPlainObject(response?.data)
+			? response.data
+			: response || {};
+		const configPatch = this._isPlainObject(payload.config)
+			? payload.config
+			: {};
+
+		if (payload.last_feedback_at !== undefined) {
+			configPatch.last_feedback_at = payload.last_feedback_at;
+		} else if (payload.lastFeedbackAt !== undefined) {
+			configPatch.last_feedback_at = payload.lastFeedbackAt;
+		}
+
+		return this._omitUndefined(configPatch);
+	}
+
+	_applyIdentityToWidgets(metadata) {
+		for (const widget of this.widgets.values()) {
+			if (typeof widget.applyIdentity === 'function') {
+				widget.applyIdentity(metadata);
+			}
+		}
+	}
 }