@product7/feedback-sdk 1.0.1

package/src/core/APIService.js

@@ -0,0 +1,338 @@
+import { APIError } from '../utils/errors.js';
+
+export class APIService {
+	constructor(config = {}) {
+		this.workspace = config.workspace;
+		this.sessionToken = null;
+		this.sessionExpiry = null;
+		this.userContext = config.userContext || null;
+
+		// Construct workspace-specific API URL
+		if (config.apiUrl) {
+			// If explicitly provided, use it
+			this.baseURL = config.apiUrl;
+		} else if (this.workspace) {
+			// Construct from workspace: workspace.api.staging.product7.io/api/v1
+			this.baseURL = `https://${this.workspace}.api.staging.product7.io/api/v1`;
+		} else {
+			// Fallback to default
+			this.baseURL = 'https://api.staging.product7.io/api/v1';
+		}
+
+		console.log('[APIService] Using API URL:', this.baseURL);
+
+		// Try to load existing session from localStorage
+		this._loadStoredSession();
+	}
+
+	async init(userContext = null) {
+		console.log('[APIService] Starting initialization...');
+
+		if (userContext) {
+			this.userContext = userContext;
+		}
+
+		// Check if we have a valid session token
+		if (this.isSessionValid()) {
+			console.log('[APIService] Found valid existing session');
+			return { sessionToken: this.sessionToken };
+		}
+
+		// Try to get user context from various sources if not provided
+		if (!this.userContext) {
+			console.log(
+				'[APIService] No user context provided, attempting auto-detection...'
+			);
+			this.userContext = this._getUserContextFromStorage();
+		}
+
+		if (!this.userContext || !this.workspace) {
+			const error = `Missing ${!this.workspace ? 'workspace' : 'user context'} for initialization`;
+			console.error('[APIService]', error);
+			throw new APIError(400, error);
+		}
+
+		console.log('[APIService] User context detected:', this.userContext);
+
+		const payload = {
+			workspace: this.workspace,
+			user: this.userContext,
+		};
+
+		console.log(
+			'[APIService] Making init request to:',
+			`${this.baseURL}/widget/init`
+		);
+		console.log('[APIService] Payload:', payload);
+
+		try {
+			const response = await this._makeRequest('/widget/init', {
+				method: 'POST',
+				body: JSON.stringify(payload),
+				headers: {
+					'Content-Type': 'application/json',
+				},
+			});
+
+			console.log('[APIService] Init response:', response);
+
+			// Store session token and expiry
+			this.sessionToken = response.session_token;
+			this.sessionExpiry = new Date(Date.now() + response.expires_in * 1000);
+
+			// Store session in localStorage for persistence
+			this._storeSession();
+
+			return {
+				sessionToken: this.sessionToken,
+				config: response.config || {},
+				expiresIn: response.expires_in,
+			};
+		} catch (error) {
+			console.error('[APIService] Init failed:', error);
+			throw new APIError(
+				error.status || 500,
+				`Failed to initialize widget: ${error.message}`,
+				error.response
+			);
+		}
+	}
+
+	async submitFeedback(feedbackData) {
+		// Ensure we have a valid session
+		if (!this.isSessionValid()) {
+			await this.init();
+		}
+
+		if (!this.sessionToken) {
+			throw new APIError(401, 'No valid session token available');
+		}
+
+		const payload = {
+			board:
+				feedbackData.board_id || feedbackData.board || feedbackData.boardId,
+			title: feedbackData.title,
+			content: feedbackData.content,
+			attachments: feedbackData.attachments || [],
+		};
+
+		try {
+			const response = await this._makeRequest('/widget/feedback', {
+				method: 'POST',
+				body: JSON.stringify(payload),
+				headers: {
+					'Content-Type': 'application/json',
+					Authorization: `Bearer ${this.sessionToken}`,
+				},
+			});
+
+			return response;
+		} catch (error) {
+			// If session expired, try to reinitialize once
+			if (error.status === 401) {
+				this.sessionToken = null;
+				this.sessionExpiry = null;
+				await this.init();
+
+				// Retry the request with new session
+				return this.submitFeedback(feedbackData);
+			}
+
+			throw new APIError(
+				error.status || 500,
+				`Failed to submit feedback: ${error.message}`,
+				error.response
+			);
+		}
+	}
+
+	isSessionValid() {
+		return (
+			this.sessionToken && this.sessionExpiry && new Date() < this.sessionExpiry
+		);
+	}
+
+	setUserContext(userContext) {
+		this.userContext = userContext;
+		// Store in localStorage for persistence
+		if (typeof localStorage !== 'undefined') {
+			localStorage.setItem(
+				'feedbackSDK_userContext',
+				JSON.stringify(userContext)
+			);
+		}
+	}
+
+	getUserContext() {
+		return this.userContext;
+	}
+
+	clearSession() {
+		this.sessionToken = null;
+		this.sessionExpiry = null;
+		if (typeof localStorage !== 'undefined') {
+			localStorage.removeItem('feedbackSDK_session');
+		}
+	}
+
+	_getUserContextFromStorage() {
+		if (typeof localStorage === 'undefined') return null;
+
+		console.log('[APIService] Attempting to detect user from storage...');
+
+		try {
+			// Try to get from feedbackSDK specific storage first
+			const stored = localStorage.getItem('feedbackSDK_userContext');
+			if (stored) {
+				console.log('[APIService] Found user context in feedbackSDK storage');
+				return JSON.parse(stored);
+			}
+
+			// Try to get from window object (if set by parent application)
+			if (typeof window !== 'undefined' && window.FeedbackSDKUserContext) {
+				console.log(
+					'[APIService] Found user context in window.FeedbackSDKUserContext'
+				);
+				return window.FeedbackSDKUserContext;
+			}
+
+			// Check window.currentUser
+			if (typeof window !== 'undefined' && window.currentUser) {
+				console.log('[APIService] Found user context in window.currentUser');
+				return this._mapUserData(window.currentUser);
+			}
+
+			// Try to extract from existing session storage
+			const authSources = ['auth', 'currentUser', 'userSession', 'user'];
+
+			for (const key of authSources) {
+				const sessionData = localStorage.getItem(key);
+				if (sessionData) {
+					console.log(`[APIService] Found data in localStorage.${key}`);
+					const parsed = JSON.parse(sessionData);
+
+					// Handle nested user data (like {user: {...}, token: ...})
+					const userData = parsed.user || parsed;
+
+					if (userData && (userData.id || userData.user_id || userData.email)) {
+						console.log('[APIService] Successfully mapped user data');
+						return this._mapUserData(userData);
+					}
+				}
+			}
+
+			console.log('[APIService] No user context found in any storage location');
+			return null;
+		} catch (error) {
+			console.warn(
+				'[FeedbackSDK] Failed to load user context from storage:',
+				error
+			);
+			return null;
+		}
+	}
+
+	_mapUserData(userData) {
+		console.log('[APIService] Mapping user data:', userData);
+
+		const mapped = {
+			user_id: userData.id || userData.user_id || userData.userId,
+			email: userData.email,
+			name: userData.name || userData.displayName || userData.full_name,
+			custom_fields: {},
+			company: {},
+		};
+
+		// Map company data if available
+		if (userData.company || userData.organization) {
+			const company = userData.company || userData.organization;
+			mapped.company = {
+				id: company.id || company.company_id,
+				name: company.name || company.company_name,
+				monthly_spend: company.monthly_spend || company.spend,
+			};
+		}
+
+		// Map any additional custom fields
+		const customFieldKeys = ['plan', 'role', 'tier', 'subscription'];
+		customFieldKeys.forEach((key) => {
+			if (userData[key]) {
+				mapped.custom_fields[key] = userData[key];
+			}
+		});
+
+		console.log('[APIService] Mapped result:', mapped);
+		return mapped;
+	}
+
+	_storeSession() {
+		if (typeof localStorage === 'undefined') return;
+
+		try {
+			const sessionData = {
+				token: this.sessionToken,
+				expiry: this.sessionExpiry.toISOString(),
+				workspace: this.workspace,
+			};
+			localStorage.setItem('feedbackSDK_session', JSON.stringify(sessionData));
+		} catch (error) {
+			console.warn('[FeedbackSDK] Failed to store session:', error);
+		}
+	}
+
+	_loadStoredSession() {
+		if (typeof localStorage === 'undefined') return false;
+
+		try {
+			const stored = localStorage.getItem('feedbackSDK_session');
+			if (!stored) return false;
+
+			const sessionData = JSON.parse(stored);
+			this.sessionToken = sessionData.token;
+			this.sessionExpiry = new Date(sessionData.expiry);
+
+			return this.isSessionValid();
+		} catch (error) {
+			console.warn('[FeedbackSDK] Failed to load stored session:', error);
+			return false;
+		}
+	}
+
+	async _makeRequest(endpoint, options = {}) {
+		const url = `${this.baseURL}${endpoint}`;
+		console.log('[APIService] Making request to:', url);
+
+		try {
+			const response = await fetch(url, options);
+
+			if (!response.ok) {
+				let errorMessage = `HTTP ${response.status}`;
+				let responseData = null;
+
+				try {
+					responseData = await response.json();
+					errorMessage =
+						responseData.message || responseData.error || errorMessage;
+				} catch (e) {
+					errorMessage = (await response.text()) || errorMessage;
+				}
+
+				throw new APIError(response.status, errorMessage, responseData);
+			}
+
+			const contentType = response.headers.get('content-type');
+			if (contentType && contentType.includes('application/json')) {
+				return await response.json();
+			}
+
+			return await response.text();
+		} catch (error) {
+			if (error instanceof APIError) {
+				throw error;
+			}
+
+			// Network or other errors
+			throw new APIError(0, error.message, null);
+		}
+	}
+}

package/src/core/EventBus.js

@@ -0,0 +1,54 @@
+export class EventBus {
+	constructor() {
+		this.events = new Map();
+	}
+
+	on(event, callback) {
+		if (!this.events.has(event)) {
+			this.events.set(event, []);
+		}
+		this.events.get(event).push(callback);
+
+		return () => this.off(event, callback);
+	}
+
+	off(event, callback) {
+		const callbacks = this.events.get(event);
+		if (callbacks) {
+			const index = callbacks.indexOf(callback);
+			if (index > -1) {
+				callbacks.splice(index, 1);
+			}
+		}
+	}
+
+	emit(event, data) {
+		const callbacks = this.events.get(event);
+		if (callbacks) {
+			callbacks.forEach((callback) => {
+				try {
+					callback(data);
+				} catch (error) {
+					console.error('[FeedbackSDK] Event callback error:', error);
+				}
+			});
+		}
+	}
+
+	once(event, callback) {
+		const unsubscribe = this.on(event, (data) => {
+			callback(data);
+			unsubscribe();
+		});
+		return unsubscribe;
+	}
+
+	clear() {
+		this.events.clear();
+	}
+
+	getListenerCount(event) {
+		const callbacks = this.events.get(event);
+		return callbacks ? callbacks.length : 0;
+	}
+}

package/src/core/FeedbackSDK.js

@@ -0,0 +1,285 @@
+import { ConfigError, SDKError } from '../utils/errors.js';
+import { deepMerge, generateId } from '../utils/helpers.js';
+import { WidgetFactory } from '../widgets/WidgetFactory.js';
+import { APIService } from './APIService.js';
+import { EventBus } from './EventBus.js';
+
+export class FeedbackSDK {
+	constructor(config = {}) {
+		this.config = this._validateAndMergeConfig(config);
+		this.initialized = false;
+		this.widgets = new Map();
+		this.eventBus = new EventBus();
+
+		// Initialize API service
+		this.apiService = new APIService({
+			apiUrl: this.config.apiUrl,
+			workspace: this.config.workspace,
+			userContext: this.config.userContext,
+		});
+
+		this._bindMethods();
+	}
+
+	async init() {
+		if (this.initialized) {
+			return { alreadyInitialized: true };
+		}
+
+		try {
+			// Initialize the API service (this will handle the /widget/init call)
+			const initData = await this.apiService.init(this.config.userContext);
+
+			// Merge any server-provided config with local config
+			if (initData.config) {
+				this.config = deepMerge(this.config, initData.config);
+			}
+
+			this.initialized = true;
+			this.eventBus.emit('sdk:initialized', {
+				config: this.config,
+				sessionToken: initData.sessionToken,
+			});
+
+			return {
+				initialized: true,
+				config: initData.config || {},
+				sessionToken: initData.sessionToken,
+				expiresIn: initData.expiresIn,
+			};
+		} catch (error) {
+			this.eventBus.emit('sdk:error', { error });
+			throw new SDKError(`Failed to initialize SDK: ${error.message}`, error);
+		}
+	}
+
+	createWidget(type = 'button', options = {}) {
+		if (!this.initialized) {
+			throw new SDKError(
+				'SDK must be initialized before creating widgets. Call init() first.'
+			);
+		}
+
+		const widgetId = generateId('widget');
+		const widgetOptions = {
+			id: widgetId,
+			sdk: this,
+			apiService: this.apiService,
+			...this.config,
+			...options,
+		};
+
+		try {
+			const widget = WidgetFactory.create(type, widgetOptions);
+			this.widgets.set(widgetId, widget);
+
+			this.eventBus.emit('widget:created', { widget, type });
+			return widget;
+		} catch (error) {
+			throw new SDKError(`Failed to create widget: ${error.message}`, error);
+		}
+	}
+
+	getWidget(id) {
+		return this.widgets.get(id);
+	}
+
+	getAllWidgets() {
+		return Array.from(this.widgets.values());
+	}
+
+	destroyWidget(id) {
+		const widget = this.widgets.get(id);
+		if (widget) {
+			widget.destroy();
+			this.widgets.delete(id);
+			this.eventBus.emit('widget:removed', { widgetId: id });
+			return true;
+		}
+		return false;
+	}
+
+	destroyAllWidgets() {
+		for (const widget of this.widgets.values()) {
+			widget.destroy();
+		}
+		this.widgets.clear();
+		this.eventBus.emit('widgets:cleared');
+	}
+
+	updateConfig(newConfig) {
+		const oldConfig = { ...this.config };
+		this.config = this._validateAndMergeConfig(newConfig, this.config);
+
+		// Update all existing widgets with new config
+		for (const widget of this.widgets.values()) {
+			widget.handleConfigUpdate(this.config);
+		}
+
+		this.eventBus.emit('config:updated', {
+			oldConfig,
+			newConfig: this.config,
+		});
+	}
+
+	setUserContext(userContext) {
+		this.config.userContext = userContext;
+		if (this.apiService) {
+			this.apiService.setUserContext(userContext);
+		}
+		this.eventBus.emit('user:updated', { userContext });
+	}
+
+	getUserContext() {
+		return (
+			this.config.userContext ||
+			(this.apiService ? this.apiService.getUserContext() : null)
+		);
+	}
+
+	async reinitialize(newUserContext = null) {
+		// Clear current session
+		this.apiService.clearSession();
+		this.initialized = false;
+
+		// Update user context if provided
+		if (newUserContext) {
+			this.setUserContext(newUserContext);
+		}
+
+		// Reinitialize
+		return this.init();
+	}
+
+	on(event, callback) {
+		this.eventBus.on(event, callback);
+		return this;
+	}
+
+	off(event, callback) {
+		this.eventBus.off(event, callback);
+		return this;
+	}
+
+	once(event, callback) {
+		this.eventBus.once(event, callback);
+		return this;
+	}
+
+	emit(event, data) {
+		this.eventBus.emit(event, data);
+		return this;
+	}
+
+	destroy() {
+		this.destroyAllWidgets();
+		this.eventBus.removeAllListeners();
+		this.apiService.clearSession();
+		this.initialized = false;
+		this.eventBus.emit('sdk:destroyed');
+	}
+
+	_validateAndMergeConfig(newConfig, existingConfig = {}) {
+		const defaultConfig = {
+			apiUrl: null,
+			workspace: null,
+			userContext: null,
+			position: 'bottom-right',
+			theme: 'light',
+			boardId: 'general',
+			autoShow: true,
+			debug: false,
+		};
+
+		const mergedConfig = deepMerge(
+			deepMerge(defaultConfig, existingConfig),
+			newConfig
+		);
+
+		// Validate required config
+		const requiredFields = ['workspace'];
+		const missingFields = requiredFields.filter(
+			(field) => !mergedConfig[field]
+		);
+
+		if (missingFields.length > 0) {
+			throw new ConfigError(
+				`Missing required configuration: ${missingFields.join(', ')}`
+			);
+		}
+
+		// Validate userContext structure if provided
+		if (mergedConfig.userContext) {
+			this._validateUserContext(mergedConfig.userContext);
+		}
+
+		return mergedConfig;
+	}
+
+	_validateUserContext(userContext) {
+		if (!userContext.user_id && !userContext.email) {
+			throw new ConfigError(
+				'User context must include at least user_id or email'
+			);
+		}
+
+		// Validate structure matches expected API format
+		const validStructure = {
+			user_id: 'string',
+			email: 'string',
+			name: 'string',
+			custom_fields: 'object',
+			company: 'object',
+		};
+
+		for (const [key, expectedType] of Object.entries(validStructure)) {
+			if (userContext[key] && typeof userContext[key] !== expectedType) {
+				throw new ConfigError(
+					`User context field '${key}' must be of type '${expectedType}'`
+				);
+			}
+		}
+	}
+
+	_bindMethods() {
+		this.createWidget = this.createWidget.bind(this);
+		this.destroyWidget = this.destroyWidget.bind(this);
+		this.updateConfig = this.updateConfig.bind(this);
+	}
+
+	// Static helper methods
+	static create(config) {
+		return new FeedbackSDK(config);
+	}
+
+	static async createAndInit(config) {
+		const sdk = new FeedbackSDK(config);
+		await sdk.init();
+		return sdk;
+	}
+
+	// Utility methods for external integrations
+	static extractUserContextFromAuth(authData) {
+		// Helper method to extract user context from common auth structures
+		if (!authData) return null;
+
+		return {
+			user_id: authData.sub || authData.id || authData.user_id,
+			email: authData.email,
+			name: authData.name || authData.display_name || authData.full_name,
+			custom_fields: {
+				role: authData.role,
+				plan: authData.plan || authData.subscription?.plan,
+				...(authData.custom_fields || {}),
+			},
+			company:
+				authData.company || authData.organization
+					? {
+							id: authData.company?.id || authData.organization?.id,
+							name: authData.company?.name || authData.organization?.name,
+							monthly_spend: authData.company?.monthly_spend,
+						}
+					: undefined,
+		};
+	}
+}