@product7/feedback-sdk 1.3.6 → 1.3.8

package/package.json

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

package/src/api/services/MessengerService.js

@@ -107,6 +107,7 @@ export class MessengerService {
 						content: data.message,
 						sender_type: 'customer',
 						created_at: new Date().toISOString(),
+						attachments: data.attachments || [],
 					},
 				],
 			};
@@ -124,6 +125,7 @@ export class MessengerService {
 			body: JSON.stringify({
 				message: data.message,
 				subject: data.subject || '',
+				attachments: data.attachments || []
 			}),
 		});
 	}
@@ -138,6 +140,7 @@ export class MessengerService {
 				content: data.content,
 				sender_type: 'customer',
 				created_at: new Date().toISOString(),
+				attachments: data.attachments || [],
 			};
 			if (!MOCK_MESSAGES[conversationId]) {
 				MOCK_MESSAGES[conversationId] = [];
@@ -154,7 +157,10 @@ export class MessengerService {
 					'Content-Type': 'application/json',
 					Authorization: `Bearer ${this.api.sessionToken}`,
 				},
-				body: JSON.stringify({ content: data.content }),
+				body: JSON.stringify({ 
+					content: data.content,
+					attachments: data.attachments || []
+				}),
 			}
 		);
 	}
@@ -270,4 +276,4 @@ export class MessengerService {
 			}
 		);
 	}
-}
+}

package/src/widgets/MessengerWidget.js

@@ -1,4 +1,3 @@
-
 import { BaseWidget } from './BaseWidget.js';
 import { MessengerState } from './messenger/MessengerState.js';
 import { MessengerLauncher } from './messenger/components/MessengerLauncher.js';
@@ -132,44 +131,41 @@ export class MessengerWidget extends BaseWidget {
 		}
 	}
 
-async _handleStartConversation(messageContent, pendingAttachments) {
-	try {
-		// Check if already identified
-		if (!this.messengerState.isIdentified) {
-			// Not identified - show pre-chat form
-			this.messengerState.pendingMessage = {
-				content: messageContent,
-				attachments: pendingAttachments,
-			};
-			this.messengerState.setView('prechat');
-			return null;
-		}
+	async _handleStartConversation(messageContent, pendingAttachments) {
+		try {
+			if (!this.messengerState.isIdentified) {
+				this.messengerState.pendingMessage = {
+					content: messageContent,
+					attachments: pendingAttachments,
+				};
+				this.messengerState.setView('prechat');
+				return null;
+			}
 
-		// Already identified - proceed with conversation
-		const openConversation = this.messengerState.conversations.find(
-			(c) => c.status === 'open'
-		);
+			const openConversation = this.messengerState.conversations.find(
+				(c) => c.status === 'open'
+			);
 
-		if (openConversation) {
-			this.messengerState.setActiveConversation(openConversation.id);
-			await this._handleSendMessage(
-				openConversation.id,
-				{ content: messageContent },
+			if (openConversation) {
+				this.messengerState.setActiveConversation(openConversation.id);
+				await this._handleSendMessage(
+					openConversation.id,
+					{ content: messageContent },
+					pendingAttachments
+				);
+				return openConversation;
+			}
+
+			return await this.startNewConversation(
+				messageContent,
+				'',
 				pendingAttachments
 			);
-			return openConversation;
+		} catch (error) {
+			console.error('[MessengerWidget] Failed to start conversation:', error);
+			return null;
 		}
-
-		return await this.startNewConversation(
-			messageContent,
-			'',
-			pendingAttachments
-		);
-	} catch (error) {
-		console.error('[MessengerWidget] Failed to start conversation:', error);
-		return null;
 	}
-}
 
 	async _handleSelectConversation(conversationId) {
 		try {
@@ -194,47 +190,33 @@ async _handleStartConversation(messageContent, pendingAttachments) {
 		}
 	}
 
-async _handleIdentifyContact(contactData) {
-	try {
-		const response = await this.apiService.identifyContact({
-			name: contactData.name,
-			email: contactData.email,
-		});
-
-		if (response.status) {
-			console.log('[MessengerWidget] Contact identified:', response.data.contact_id);
+	async _handleIdentifyContact(contactData) {
+		try {
+			const response = await this.apiService.identifyContact({
+				name: contactData.name,
+				email: contactData.email,
+			});
 
-			if (!this.messengerState.userContext) {
-				this.messengerState.userContext = {};
-			}
-			this.messengerState.userContext.name = contactData.name;
-			this.messengerState.userContext.email = contactData.email;
-			this.messengerState.isIdentified = true;
-
-			const pendingMessage = this.messengerState.pendingMessage;
-			if (pendingMessage) {
-				this.messengerState.pendingMessage = null;
-				
-				// SET VIEW FIRST
-				this.messengerState.setView('chat');
-				
-				// THEN start conversation
-				await this.startNewConversation(
-					pendingMessage.content,
-					'',
-					pendingMessage.attachments
-				);
-			} else {
-				this.messengerState.setView('chat');
+			if (response.status) {
+				console.log('[MessengerWidget] Contact identified:', response.data.contact_id);
+				this.messengerState.setIdentified(true, {
+					name: contactData.name,
+					email: contactData.email,
+				});
 			}
+
+			return response;
+		} catch (error) {
+			console.error('[MessengerWidget] Failed to identify contact:', error);
+			throw error;
 		}
+	}
 
-		return response;
-	} catch (error) {
-		console.error('[MessengerWidget] Failed to identify contact:', error);
-		throw error;
+	markAsIdentified(name, email) {
+		this.messengerState.setIdentified(true, { name, email });
+		console.log('[MessengerWidget] Marked as identified:', email);
 	}
-}
+
 	async _handleUploadFile(base64Data, filename) {
 		try {
 			const response = await this.apiService.uploadFile(base64Data, filename);
@@ -610,25 +592,12 @@ async _handleIdentifyContact(contactData) {
 			const uploadedAttachments =
 				await this._uploadPendingAttachments(pendingAttachments);
 
-			console.log('[MessengerWidget] Starting conversation...', {
-				message,
-				attachmentCount: uploadedAttachments.length,
-				hasSession: this.apiService.isSessionValid(),
-				sessionToken: this.apiService.sessionToken
-					? this.apiService.sessionToken.substring(0, 10) + '...'
-					: null,
-				baseURL: this.apiService.baseURL,
-				mock: this.apiService.mock,
-			});
-
 			const response = await this.apiService.startConversation({
 				message,
 				subject,
 				attachments: uploadedAttachments,
 			});
 
-			console.log('[MessengerWidget] Conversation response:', response);
-
 			if (response.status && response.data) {
 				const conv = response.data;
 				const newConversation = {
@@ -795,19 +764,19 @@ async _handleIdentifyContact(contactData) {
 		};
 	}
 
-async onMount() {
-	this.loadInitialData();
+	async onMount() {
+		this.loadInitialData();
 
-	if (this.apiService?.sessionToken) {
-		this._initWebSocket();
-	}
-
-	this.checkAgentAvailability();
+		if (this.apiService?.sessionToken) {
+			this._initWebSocket();
+		}
 
-	this._availabilityInterval = setInterval(() => {
 		this.checkAgentAvailability();
-	}, 60000);
-}
+
+		this._availabilityInterval = setInterval(() => {
+			this.checkAgentAvailability();
+		}, 60000);
+	}
 
 	onDestroy() {
 		if (this._stateUnsubscribe) {

package/src/widgets/messenger/MessengerState.js

@@ -1,133 +1,99 @@
-/**
- * MessengerState - State management for the Messenger widget
- */
 export class MessengerState {
-constructor(options = {}) {
-	this.currentView = 'home';
-	this.isOpen = false;
-	this.unreadCount = 0;
-	this.activeConversationId = null;
-
-	// Conversations
-	this.conversations = [];
-	this.messages = {};
-
-	// Help articles
-	this.helpArticles = [];
-	this.helpSearchQuery = '';
-
-	// Changelog
-	this.homeChangelogItems = [];
-	this.changelogItems = [];
-
-	// Team info
-	this.teamName = options.teamName || 'Support';
-	this.teamAvatars = options.teamAvatars || [];
-	this.welcomeMessage = options.welcomeMessage || 'How can we help?';
-
-	// User info
-	this.userContext = options.userContext || null;
-	
-	// ADD THESE TWO PROPERTIES
-	this.isIdentified = false; // Track if user has been identified
-	this.pendingMessage = null; // { content, attachments } - for pre-chat flow
-
-	// Feature flags
-	this.enableHelp = options.enableHelp !== false;
-	this.enableChangelog = options.enableChangelog !== false;
-
-	// Agent availability
-	this.agentsOnline = false;
-	this.onlineCount = 0;
-	this.responseTime = 'Usually replies within a few minutes';
-
-	// Typing indicators
-	this.typingUsers = {};
-
-	// Loading states
-	this.isLoading = false;
-	this.isLoadingMessages = false;
-
-	// Listeners
-	this._listeners = new Set();
-}
-	/**
-	 * Subscribe to state changes
-	 */
+	constructor(options = {}) {
+		this.currentView = 'home';
+		this.isOpen = false;
+		this.unreadCount = 0;
+		this.activeConversationId = null;
+
+		this.conversations = [];
+		this.messages = {};
+
+		this.helpArticles = [];
+		this.helpSearchQuery = '';
+
+		this.homeChangelogItems = [];
+		this.changelogItems = [];
+
+		this.teamName = options.teamName || 'Support';
+		this.teamAvatars = options.teamAvatars || [];
+		this.welcomeMessage = options.welcomeMessage || 'How can we help?';
+
+		this.userContext = options.userContext || null;
+		this.isIdentified = false;
+		this.pendingMessage = null;
+
+		this.enableHelp = options.enableHelp !== false;
+		this.enableChangelog = options.enableChangelog !== false;
+
+		this.agentsOnline = false;
+		this.onlineCount = 0;
+		this.responseTime = 'Usually replies within a few minutes';
+
+		this.typingUsers = {};
+
+		this.isLoading = false;
+		this.isLoadingMessages = false;
+
+		this._listeners = new Set();
+	}
+
 	subscribe(callback) {
 		this._listeners.add(callback);
 		return () => this._listeners.delete(callback);
 	}
 
-	/**
-	 * Notify all listeners of state change
-	 */
 	_notify(changeType, data) {
 		this._listeners.forEach((cb) => cb(changeType, data, this));
 	}
 
-	/**
-	 * Set current view
-	 */
 	setView(view) {
 		const previousView = this.currentView;
 		this.currentView = view;
 		this._notify('viewChange', { previousView, currentView: view });
 	}
 
-	/**
-	 * Toggle panel open/closed
-	 */
 	setOpen(isOpen) {
 		this.isOpen = isOpen;
 		this._notify('openChange', { isOpen });
 	}
 
-	/**
-	 * Set active conversation for chat view
-	 */
 	setActiveConversation(conversationId) {
 		const previousConversationId = this.activeConversationId;
 		this.activeConversationId = conversationId;
 		this._notify('conversationChange', { conversationId, previousConversationId });
 	}
 
-	/**
-	 * Update conversations list
-	 */
+	setIdentified(isIdentified, userContext = null) {
+		this.isIdentified = isIdentified;
+		if (userContext) {
+			this.userContext = { ...this.userContext, ...userContext };
+		}
+		this._notify('identificationChange', { isIdentified, userContext });
+	}
+
 	setConversations(conversations) {
 		this.conversations = conversations;
 		this._updateUnreadCount();
 		this._notify('conversationsUpdate', { conversations });
 	}
 
-	/**
-	 * Add a new conversation
-	 */
 	addConversation(conversation) {
 		this.conversations.unshift(conversation);
 		this._updateUnreadCount();
 		this._notify('conversationAdded', { conversation });
 	}
 
-	/**
-	 * Update messages for a conversation
-	 */
 	setMessages(conversationId, messages) {
 		this.messages[conversationId] = messages;
 		this._notify('messagesUpdate', { conversationId, messages });
 	}
 
-	/**
-	 * Add a message to a conversation
-	 */
 	addMessage(conversationId, message) {
 		if (!this.messages[conversationId]) {
 			this.messages[conversationId] = [];
 		}
 		this.messages[conversationId].push(message);
 
-		// Update conversation preview
 		const conv = this.conversations.find((c) => c.id === conversationId);
 		if (conv) {
 			conv.lastMessage = message.content;
@@ -141,9 +107,6 @@ constructor(options = {}) {
 		this._notify('messageAdded', { conversationId, message });
 	}
 
-	/**
-	 * Update a conversation by id
-	 */
 	updateConversation(conversationId, updates) {
 		const conv = this.conversations.find((c) => c.id === conversationId);
 		if (!conv) {
@@ -155,9 +118,6 @@ constructor(options = {}) {
 		return conv;
 	}
 
-	/**
-	 * Mark conversation as read
-	 */
 	markAsRead(conversationId) {
 		const conv = this.conversations.find((c) => c.id === conversationId);
 		if (conv && conv.unread > 0) {
@@ -167,9 +127,6 @@ constructor(options = {}) {
 		}
 	}
 
-	/**
-	 * Update unread count
-	 */
 	_updateUnreadCount() {
 		this.unreadCount = this.conversations.reduce(
 			(sum, c) => sum + (c.unread || 0),
@@ -178,57 +135,34 @@ constructor(options = {}) {
 		this._notify('unreadCountChange', { count: this.unreadCount });
 	}
 
-	/**
-	 * Set help articles
-	 */
 	setHelpArticles(articles) {
 		this.helpArticles = articles;
 		this._notify('helpArticlesUpdate', { articles });
 	}
 
-	/**
-	 * Set help search query
-	 */
 	setHelpSearchQuery(query) {
 		this.helpSearchQuery = query;
 		this._notify('helpSearchChange', { query });
 	}
 
-	/**
-	 * Set home changelog items
-	 */
 	setHomeChangelogItems(items) {
 		this.homeChangelogItems = items;
 		this._notify('homeChangelogUpdate', { items });
 	}
 
-	/**
-	 * Set changelog items
-	 */
 	setChangelogItems(items) {
 		this.changelogItems = items;
 		this._notify('changelogUpdate', { items });
 	}
 
-	/**
-	 * Get current conversation
-	 */
 	getActiveConversation() {
 		return this.conversations.find((c) => c.id === this.activeConversationId);
 	}
 
-	/**
-	 * Get messages for active conversation
-	 */
 	getActiveMessages() {
 		return this.messages[this.activeConversationId] || [];
 	}
 
-	/**
-	 * Update team avatars from backend agent data.
-	 * Converts available_agents ({full_name, picture}) into avatar strings
-	 * the views already support (URL strings or initial strings).
-	 */
 	setTeamAvatarsFromAgents(agents) {
 		if (!agents || agents.length === 0) return;
 
@@ -239,9 +173,6 @@ constructor(options = {}) {
 		this._notify('teamAvatarsUpdate', { teamAvatars: this.teamAvatars });
 	}
 
-	/**
-	 * Get filtered help articles
-	 */
 	getFilteredHelpArticles() {
 		if (!this.helpSearchQuery) {
 			return this.helpArticles;
@@ -255,13 +186,10 @@ constructor(options = {}) {
 		);
 	}
 
-	/**
-	 * Reset state
-	 */
 	reset() {
 		this.currentView = 'home';
 		this.activeConversationId = null;
 		this.helpSearchQuery = '';
 		this._notify('reset', {});
 	}
-}
+}