@product7/feedback-sdk 1.4.2 → 1.4.4

package/dist/feedback-sdk.js

@@ -3398,6 +3398,13 @@
 			this.isLoading = false;
 			this.isLoadingMessages = false;
 
+			this.urls = options.urls || {
+				feedback: null,
+				changelog: null,
+				help: null,
+				roadmap: null,
+			};
+
 			this._listeners = new Set();
 		}
 
@@ -3981,14 +3988,14 @@
 
 		_updateContent() {
 			this.element.innerHTML = `
-        <div class="messenger-changelog-header">
-            <h2>Latest Updates</h2>
-        </div>
+			<div class="messenger-changelog-header">
+				<h2>Latest Updates</h2>
+			</div>
 
-        <div class="messenger-changelog-body">
-            <div class="messenger-changelog-list"></div>
-        </div>
-    `;
+			<div class="messenger-changelog-body">
+				<div class="messenger-changelog-list"></div>
+			</div>
+		`;
 
 			this._updateChangelogList();
 			this._attachEvents();
@@ -4984,30 +4991,29 @@
 
 		_updateContent() {
 			const searchQuery = this.state.helpSearchQuery || '';
-			this.state.helpArticles || [];
 
 			this.element.innerHTML = `
-        <div class="messenger-help-header">
-            <div class="messenger-help-header-top">
-                <h2>Help</h2>
-                <button class="sdk-close-btn" aria-label="Close">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256">
-                        <path d="M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z"></path>
-                    </svg>
-                </button>
-            </div>
-            <input
-                type="text"
-                class="messenger-help-search-input"
-                placeholder="Search for help..."
-                value="${searchQuery}"
-            />
-        </div>
+			<div class="messenger-help-header">
+				<div class="messenger-help-header-top">
+					<h2>Help</h2>
+					<button class="sdk-close-btn" aria-label="Close">
+						<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256">
+							<path d="M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z"></path>
+						</svg>
+					</button>
+				</div>
+				<input
+					type="text"
+					class="messenger-help-search-input"
+					placeholder="Search for help..."
+					value="${searchQuery}"
+				/>
+			</div>
 
-        <div class="messenger-help-body">
-            <div class="messenger-help-collections"></div>
-        </div>
-    `;
+			<div class="messenger-help-body">
+				<div class="messenger-help-collections"></div>
+			</div>
+		`;
 
 			this._updateCollectionsList();
 			this._attachEvents();
@@ -5273,11 +5279,6 @@
 		`;
 
 			if (openConversation) {
-				openConversation.lastMessage
-					? openConversation.lastMessage.length > 40
-						? openConversation.lastMessage.substring(0, 40) + '...'
-						: openConversation.lastMessage
-					: 'Continue your conversation';
 				return `
 				<button class="messenger-home-message-btn messenger-home-continue-btn" data-conversation-id="${openConversation.id}">
 					<div class="messenger-home-continue-info">
@@ -5285,18 +5286,19 @@
 					</div>
 					${sendIcon}
 				</button>
-				<button class="messenger-home-message-btn" data-action="feedback">
+				<button class="messenger-home-message-btn messenger-feedback-btn" data-action="feedback">
 					<span class="messenger-home-continue-label">Leave us feedback</span>
 					${caretIcon}
 				</button>
 			`;
 			}
+
 			return `
 			<button class="messenger-home-message-btn">
 				<span>Start a conversation</span>
 				${sendIcon}
 			</button>
-			<button class="messenger-home-message-btn" data-action="feedback">
+			<button class="messenger-home-message-btn messenger-feedback-btn" data-action="feedback">
 				<span>Leave us feedback</span>
 				${caretIcon}
 			</button>
@@ -5378,7 +5380,9 @@
 					this.state.setOpen(false);
 				});
 
-			const msgBtn = this.element.querySelector('.messenger-home-message-btn');
+			const msgBtn = this.element.querySelector(
+				'.messenger-home-message-btn:not(.messenger-feedback-btn)'
+			);
 			if (msgBtn) {
 				msgBtn.addEventListener('click', () => {
 					const convId = msgBtn.dataset.conversationId;
@@ -5395,11 +5399,35 @@
 				});
 			}
 
+			const feedbackBtn = this.element.querySelector('.messenger-feedback-btn');
+			if (feedbackBtn) {
+				feedbackBtn.addEventListener('click', () => {
+					const url = this.state.urls?.feedback;
+
+					if (this.options.onFeedbackClick) {
+						this.options.onFeedbackClick();
+					} else if (url) {
+						window.open(url, '_blank');
+					} else {
+						console.warn(
+							'[Messenger] No feedback destination configured. Set `feedbackUrl` in MessengerWidget options.'
+						);
+					}
+				});
+			}
+
 			this.element
-				.querySelectorAll('.messenger-home-changelog-item')
-				.forEach((item) => {
-					item.addEventListener('click', () => {
-						this.state.setView('changelog');
+				.querySelectorAll('.messenger-home-changelog-card')
+				.forEach((card) => {
+					card.addEventListener('click', () => {
+						const item = this.state.homeChangelogItems.find(
+							(i) => i.id === card.dataset.changelogId
+						);
+						if (item?.url) {
+							window.open(item.url, '_blank');
+						} else {
+							this.state.setView('changelog');
+						}
 					});
 				});
 
@@ -5681,7 +5709,12 @@
 				enableHelp: options.enableHelp !== false,
 				enableChangelog: options.enableChangelog !== false,
 				featuredContent: options.featuredContent || null,
+				feedbackUrl: options.feedbackUrl || null,
+				changelogUrl: options.changelogUrl || null,
+				helpUrl: options.helpUrl || null,
+				roadmapUrl: options.roadmapUrl || null,
 				onSendMessage: options.onSendMessage || null,
+				onFeedbackClick: options.onFeedbackClick || null,
 				onArticleClick: options.onArticleClick || null,
 				onChangelogClick: options.onChangelogClick || null,
 			};
@@ -5693,6 +5726,12 @@
 				enableHelp: this.messengerOptions.enableHelp,
 				enableChangelog: this.messengerOptions.enableChangelog,
 				userContext: this.sdk?.apiService?.getUserContext() || null,
+				urls: {
+					feedback: this.messengerOptions.feedbackUrl,
+					changelog: this.messengerOptions.changelogUrl,
+					help: this.messengerOptions.helpUrl,
+					roadmap: this.messengerOptions.roadmapUrl,
+				},
 			});
 
 			this.launcher = null;
@@ -5739,6 +5778,7 @@
 				onSelectConversation: this._handleSelectConversation.bind(this),
 				onStartNewConversation: this._handleNewConversationClick.bind(this),
 				onIdentifyContact: this._handleIdentifyContact.bind(this),
+				onFeedbackClick: this.messengerOptions.onFeedbackClick,
 				onArticleClick: this.messengerOptions.onArticleClick,
 				onChangelogClick: this.messengerOptions.onChangelogClick,
 			});
@@ -6194,12 +6234,16 @@
 				const response = await this.apiService.getHelpCollections();
 				if (response.success && response.data) {
 					const collections = response.data.collections || response.data;
+					const helpBase = (this.messengerOptions.helpUrl || '').replace(/\/$/, '');
+
 					return collections.map((collection) => ({
 						id: collection.id,
 						title: collection.title,
 						description: collection.description || '',
 						articleCount: collection.article_count || 0,
-						url: collection.url_slug ? `/help-docs/${collection.url_slug}` : null,
+						url: collection.url_slug && helpBase
+							? `${helpBase}/collections/${collection.url_slug}`
+							: helpBase || null,
 					}));
 				}
 				return [];
@@ -6304,7 +6348,7 @@
 			try {
 				await this.apiService.sendTypingIndicator(conversationId, isTyping);
 			} catch (error) {
-				// Silent fail
+				// silent fail
 			}
 		}
 
@@ -6412,6 +6456,7 @@
 
 				if (response.success && response.data) {
 					const changelogs = Array.isArray(response.data) ? response.data : [];
+					const changelogBase = (this.messengerOptions.changelogUrl || '').replace(/\/$/, '');
 
 					const mappedItems = changelogs.map((item) => ({
 						id: item.id,
@@ -6420,7 +6465,9 @@
 						tags: item.labels ? item.labels.map((label) => label.name) : [],
 						coverImage: item.cover_image || null,
 						publishedAt: item.published_at,
-						url: item.slug ? `/changelog/${item.slug}` : null,
+						url: item.slug && changelogBase
+							? `${changelogBase}/${item.slug}`
+							: changelogBase || null,
 					}));
 
 					return {