@solucx/react-native-solucx-widget 0.1.15 → 0.2.0

package/src/hooks/useWidgetState.ts

@@ -1,101 +1,101 @@
-import { useState, useCallback, useMemo } from 'react';
-import { Dimensions } from 'react-native';
-import {
-  WidgetData,
-  WidgetOptions,
-  WidgetType,
-  WidgetSamplerLog
-} from '../interfaces';
-import { StorageService } from '../services/storage';
-
-function getUserId(widgetData: WidgetData): string {
-  return (
-    widgetData.customer_id ??
-    widgetData.document ??
-    widgetData.email ??
-    'default_user'
-  );
-}
-
-export const useWidgetState = (
-  data: WidgetData,
-  options?: WidgetOptions,
-  type?: WidgetType
-) => {
-  const [savedData, setSavedData] = useState<WidgetSamplerLog | null>(null);
-  const [isWidgetVisible, setIsWidgetVisible] = useState<boolean>(false);
-
-  const userId = getUserId(data);
-
-  const storageService = useMemo(() => new StorageService(userId), [userId]);
-
-  const screenHeight = Dimensions.get('screen').height;
-  const height = options?.height ? Number(options.height) : undefined;
-
-  const [widgetHeight, setWidgetHeight] = useState<number>(height ?? 300);
-
-  const loadSavedData = useCallback(async () => {
-    try {
-      const jsonValue = await storageService.read();
-      setSavedData(jsonValue);
-    } catch (error) {
-      console.error('Error loading storage data:', error);
-    }
-  }, [storageService]);
-
-  const saveData = useCallback(
-    async (data: WidgetSamplerLog) => {
-      try {
-        await storageService.write(data);
-        setSavedData(data);
-      } catch (error) {
-        console.error('Error saving storage data:', error);
-      }
-    },
-    [storageService]
-  );
-
-  const open = useCallback(async () => {
-    const userLogs = await storageService.read();
-    userLogs.attempts = (userLogs.attempts || 0) + 1;
-    userLogs.lastAttempt = Date.now();
-    try {
-      await storageService.write(userLogs);
-      setSavedData(userLogs);
-    } catch (error) {
-      console.error('Error saving storage data:', error);
-    }
-    setIsWidgetVisible(true);
-  }, [storageService]);
-
-  const close = useCallback(() => {
-    setIsWidgetVisible(false);
-  }, []);
-
-  const resize = useCallback(
-    (value: string) => {
-      const receivedHeight = Number(value);
-
-      if (height !== undefined) {
-        setWidgetHeight(height);
-      } else if (receivedHeight > 0) {
-        setWidgetHeight(receivedHeight);
-      }
-    },
-    [height]
-  );
-
-  return {
-    savedData,
-    widgetHeight,
-    isWidgetVisible,
-    setIsWidgetVisible,
-    loadSavedData,
-    saveData,
-    open,
-    close,
-    resize,
-    userId,
-    screenHeight
-  };
-};
+import { useState, useCallback, useMemo } from 'react';
+import { Dimensions } from 'react-native';
+import type {
+  WidgetData,
+  WidgetOptions,
+  WidgetType,
+  WidgetSamplerLog
+} from '../interfaces';
+import { StorageService } from '../services/storage';
+
+function getUserId(widgetData: WidgetData): string {
+  return (
+    widgetData.customer_id ??
+    widgetData.document ??
+    widgetData.email ??
+    'default_user'
+  );
+}
+
+export const useWidgetState = (
+  data: WidgetData,
+  options?: WidgetOptions,
+  type?: WidgetType
+) => {
+  const [savedData, setSavedData] = useState<WidgetSamplerLog | null>(null);
+  const [isWidgetVisible, setIsWidgetVisible] = useState<boolean>(false);
+
+  const userId = getUserId(data);
+
+  const storageService = useMemo(() => new StorageService(userId), [userId]);
+
+  const screenHeight = Dimensions.get('screen').height;
+  const height = options?.height ? Number(options.height) : undefined;
+
+  const [widgetHeight, setWidgetHeight] = useState<number>(height ?? 300);
+
+  const loadSavedData = useCallback(async () => {
+    try {
+      const jsonValue = await storageService.read();
+      setSavedData(jsonValue);
+    } catch (error) {
+      console.error('Error loading storage data:', error);
+    }
+  }, [storageService]);
+
+  const saveData = useCallback(
+    async (data: WidgetSamplerLog) => {
+      try {
+        await storageService.write(data);
+        setSavedData(data);
+      } catch (error) {
+        console.error('Error saving storage data:', error);
+      }
+    },
+    [storageService]
+  );
+
+  const open = useCallback(async () => {
+    const userLogs = await storageService.read();
+    userLogs.attempts = (userLogs.attempts || 0) + 1;
+    userLogs.lastAttempt = Date.now();
+    try {
+      await storageService.write(userLogs);
+      setSavedData(userLogs);
+    } catch (error) {
+      console.error('Error saving storage data:', error);
+    }
+    setIsWidgetVisible(true);
+  }, [storageService]);
+
+  const close = useCallback(() => {
+    setIsWidgetVisible(false);
+  }, []);
+
+  const resize = useCallback(
+    (value: string) => {
+      const receivedHeight = Number(value);
+
+      if (height !== undefined) {
+        setWidgetHeight(height);
+      } else if (receivedHeight > 0) {
+        setWidgetHeight(receivedHeight);
+      }
+    },
+    [height]
+  );
+
+  return {
+    savedData,
+    widgetHeight,
+    isWidgetVisible,
+    setIsWidgetVisible,
+    loadSavedData,
+    saveData,
+    open,
+    close,
+    resize,
+    userId,
+    screenHeight
+  };
+};

package/src/index.ts

@@ -1,8 +1,12 @@
-export { SoluCXWidget } from './SoluCXWidget';
-export { useWidgetState } from './hooks/useWidgetState';
-export { WidgetEventService } from './services/widgetEventService';
-export { StorageService } from './services/storage';
-export { buildWidgetURL } from './utils/urlUtils';
-export { ModalWidget } from './components/ModalWidget';
-export { getWidgetStyles, styles } from './styles/widgetStyles';
-export * from './interfaces';
+export { SoluCXWidget } from './SoluCXWidget';
+export { useWidgetState } from './hooks/useWidgetState';
+export { WidgetEventService } from './services/widgetEventService';
+export { StorageService } from './services/storage';
+export { getDeviceInfo, type DeviceInfo } from './hooks/useDeviceInfoCollector';
+export { requestWidgetUrl } from './services/widgetBootstrapService';
+export { buildWidgetURL } from './utils/urlUtils';
+export { ModalWidget } from './components/ModalWidget';
+export { getWidgetStyles, styles } from './styles/widgetStyles';
+export { SDK_NAME, SDK_VERSION } from './constants/Constants';
+export { getClientVersion } from './services/ClientVersionCollector';
+export * from './interfaces';

package/src/interfaces/WidgetCallbacks.ts

@@ -0,0 +1,15 @@
+import { BlockReason } from "../services/widgetValidationService";
+
+export interface WidgetCallbacks {
+    onPreOpen?: (userId: string) => void;
+    onOpened?: (userId: string) => void;
+    onBlock?: (blockReason: BlockReason | undefined) => void;
+    onPingError?: (error: unknown) => void;
+    onClosed?: () => void;
+    onError?: (message: string) => void;
+    onPageChanged?: (page: string) => void;
+    onQuestionAnswered?: () => void;
+    onCompleted?: (userId: string) => void;
+    onPartialCompleted?: (userId: string) => void;
+    onResize?: (height: string) => void;
+}

package/src/interfaces/WidgetData.ts

@@ -1,20 +1,20 @@
-export interface WidgetData {
-    transaction_id?: string;
-    attempt_id?: string;
-    form_id?: string;
-    customer_id?: string;
-    name?: string;
-    email?: string;
-    phone?: string;
-    phone2?: string;
-    document?: string;
-    birth_date?: string;
-    store_id?: string;
-    store_name?: string;
-    employee_id?: string;
-    employee_name?: string;
-    amount?: number;
-    score?: number;
-    journey?: string;
-    [key: string]: string | number | undefined;
+export interface WidgetData {
+    transaction_id?: string;
+    attempt_id?: string;
+    form_id?: string;
+    customer_id?: string;
+    name?: string;
+    email?: string;
+    phone?: string;
+    phone2?: string;
+    document?: string;
+    birth_date?: string;
+    store_id?: string;
+    store_name?: string;
+    employee_id?: string;
+    employee_name?: string;
+    amount?: number;
+    score?: number;
+    journey?: string;
+    [key: string]: string | number | undefined;
 }

package/src/interfaces/WidgetOptions.ts

@@ -1,8 +1,8 @@
-export interface WidgetOptions {
-    height?: number;
-    retry?: {
-        attempts?: number;
-        interval?: number;
-    };
-    waitDelayAfterRating?: number;
+export interface WidgetOptions {
+    height?: number;
+    retry?: {
+        attempts?: number;
+        interval?: number;
+    };
+    waitDelayAfterRating?: number;
 }

package/src/interfaces/WidgetResponse.ts

@@ -1,15 +1,15 @@
-export interface WidgetResponse {
-    status?: "success" | "error";
-    message?: string;
-}
-
-export class WidgetError extends Error implements WidgetResponse {
-    status: "error";
-    message: string;
-
-    constructor(message: string) {
-        super(message);
-        this.status = "error";
-        this.message = message;
-    }
-}
+export interface WidgetResponse {
+    status?: "success" | "error";
+    message?: string;
+}
+
+export class WidgetError extends Error implements WidgetResponse {
+    status: "error";
+    message: string;
+
+    constructor(message: string) {
+        super(message);
+        this.status = "error";
+        this.message = message;
+    }
+}

package/src/interfaces/WidgetSamplerLog.ts

@@ -1,6 +1,6 @@
-export interface WidgetSamplerLog {
-    attempts: number;
-    lastAttempt: number;
-    lastRating: number;
-    lastParcial: number;
+export interface WidgetSamplerLog {
+    attempts: number;
+    lastAttempt: number;
+    lastRating: number;
+    lastParcial: number;
 }

package/src/interfaces/index.ts

@@ -1,24 +1,25 @@
-export type SoluCXKey = string;
-export type WidgetType = "bottom" | "top" | "inline" | "modal";
-export type EventKey =
-    | "FORM_OPENED"
-    | "FORM_CLOSE"
-    | "FORM_ERROR"
-    | "FORM_PAGECHANGED"
-    | "QUESTION_ANSWERED"
-    | "FORM_COMPLETED"
-    | "FORM_PARTIALCOMPLETED"
-    | "FORM_RESIZE";
-export type SurveyEventKey =
-    | "closeSoluCXWidget"
-    | "dismissSoluCXWidget"
-    | "completeSoluCXWidget"
-    | "partialSoluCXWidget"
-    | "resizeSoluCXWidget"
-    | "openSoluCXWidget"
-    | `errorSoluCXWidget`;
-export type { WidgetResponse } from './WidgetResponse';
-export type { WidgetData } from './WidgetData';
-export type { WidgetOptions } from './WidgetOptions';
-export type { WidgetSamplerLog } from './WidgetSamplerLog';
-export type { WidgetError } from './WidgetResponse';
+export type SoluCXKey = string;
+export type WidgetType = "bottom" | "top" | "inline" | "modal";
+export type EventKey =
+    | "FORM_CLOSE"
+    | "FORM_ERROR"
+    | "FORM_PAGECHANGED"
+    | "QUESTION_ANSWERED"
+    | "FORM_COMPLETED"
+    | "FORM_PARTIALCOMPLETED"
+    | "FORM_RESIZE";
+export type SurveyEventKey =
+    | "closeSoluCXWidget"
+    | "dismissSoluCXWidget"
+    | "completeSoluCXWidget"
+    | "partialSoluCXWidget"
+    | "resizeSoluCXWidget"
+    | "openSoluCXWidget"
+    | `errorSoluCXWidget`;
+export type { WidgetResponse } from './WidgetResponse';
+export type { WidgetData } from './WidgetData';
+export type { WidgetOptions } from './WidgetOptions';
+export type { WidgetSamplerLog } from './WidgetSamplerLog';
+export type { WidgetError } from './WidgetResponse';
+export type { WidgetCallbacks } from './WidgetCallbacks';
+export type { WidgetDisplayResult } from '../services/widgetValidationService';

package/src/services/ClientVersionCollector.ts

@@ -0,0 +1,15 @@
+export const getClientVersion = (): string => {
+    try {
+        const DeviceInfo = require("react-native-device-info");
+        if (DeviceInfo?.default?.getVersion) {
+            return DeviceInfo.default.getVersion();
+        }
+        if (DeviceInfo?.getVersion) {
+            return DeviceInfo.getVersion();
+        }
+    } catch (error) {
+        // react-native-device-info não disponível
+    }
+
+    return "unknown";
+};

package/src/services/storage.ts

@@ -1,21 +1,21 @@
-import AsyncStorage from '@react-native-async-storage/async-storage';
-import { WidgetSamplerLog } from '../interfaces';
-import { STORAGE_KEY } from '../constants/webViewConstants';
-
-export class StorageService {
-    private key: string;
-
-    constructor(key: string) {
-        this.key = `${STORAGE_KEY}_${key}`;
-    }
-
-    async write(data: WidgetSamplerLog): Promise<void> {
-        const json = JSON.stringify(data);
-        await AsyncStorage.setItem(this.key, json);
-    }
-
-    async read(): Promise<WidgetSamplerLog> {
-        const json = await AsyncStorage.getItem(this.key);
-        return json ? JSON.parse(json) as WidgetSamplerLog : {} as WidgetSamplerLog;
-    }
-}
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import type { WidgetSamplerLog } from '../interfaces';
+import { STORAGE_KEY } from '../constants/webViewConstants';
+
+export class StorageService {
+    private key: string;
+
+    constructor(key: string) {
+        this.key = `${STORAGE_KEY}_${key}`;
+    }
+
+    async write(data: WidgetSamplerLog): Promise<void> {
+        const json = JSON.stringify(data);
+        await AsyncStorage.setItem(this.key, json);
+    }
+
+    async read(): Promise<WidgetSamplerLog> {
+        const json = await AsyncStorage.getItem(this.key);
+        return json ? JSON.parse(json) as WidgetSamplerLog : {} as WidgetSamplerLog;
+    }
+}

package/src/services/widgetBootstrapService.ts

@@ -0,0 +1,67 @@
+import type { SoluCXKey, WidgetData } from "../interfaces";
+import { RATING_FORM_ENDPOINT } from "../constants/webViewConstants";
+import { getClientVersion } from "../services/ClientVersionCollector";
+import { getDeviceInfo } from "../hooks/useDeviceInfoCollector";
+import { SDK_NAME, SDK_VERSION } from "../constants/Constants";
+
+type Payload = {
+    url: string;
+};
+
+const buildRequestParams = (requestParams: WidgetData): URLSearchParams => {
+    const params = new URLSearchParams();
+
+    Object.entries(requestParams).forEach(([key, value]) => {
+        if (value === undefined || value === null) return;
+        params.append(key, typeof value === "number" ? value.toString() : String(value));
+    });
+
+    params.set("transactionId", "");
+    params.set("attemptId", "");
+
+    return params;
+};
+
+const buildRequestHeaders = (instanceKey: SoluCXKey, userId: string): Record<string, string> => {
+    const deviceInfo = getDeviceInfo();
+    const appVersion = getClientVersion();
+    const isMobile = deviceInfo.deviceType === "phone" ? "?1" : "?0";
+    const userAgent = `${SDK_NAME}/${SDK_VERSION} (${deviceInfo.platform}; OS ${deviceInfo.osVersion}; ${deviceInfo.model}) App/${appVersion}`;
+
+    return {
+        accept: "application/json, text/plain, */*",
+        "x-solucx-api-key": instanceKey,
+        "x-solucx-device-id": userId,
+        "x-client-id": userId,
+        "x-sdk-name": SDK_NAME,
+        "x-sdk-version": SDK_VERSION,
+        "x-solucx-app-version": appVersion,
+        "x-solucx-client-platform": deviceInfo.platform,
+        "Sec-CH-UA": `"${SDK_NAME}";v="${SDK_VERSION}", "app";v="${appVersion}"`,
+        "Sec-CH-UA-Platform": `"${deviceInfo.platform}"`,
+        "Sec-CH-UA-Mobile": isMobile,
+        "Sec-CH-UA-Platform-Version": `"${deviceInfo.osVersion}"`,
+        "Sec-CH-UA-Model": `"${deviceInfo.model}"`,
+        "User-Agent": userAgent,
+    };
+};
+
+export async function requestWidgetUrl(
+    instanceKey: SoluCXKey,
+    requestParams: WidgetData,
+    userId: string,
+): Promise<string | undefined> {
+    if (typeof fetch !== "function") return;
+
+    const params = buildRequestParams(requestParams);
+    const url = `${RATING_FORM_ENDPOINT}?${params.toString()}`;
+    const headers = buildRequestHeaders(instanceKey, userId);
+    const response = await fetch(url, { method: "GET", headers });
+
+    if (!response.ok) return;
+
+    const payload: Payload = await response.json();
+    return payload?.url;
+}
+
+export { buildRequestParams };