datakeen-session-react 1.1.198 → 1.1.199-rc.3

package/examples/analysis-progress-example.tsx

@@ -1,220 +0,0 @@
-import React, { useState } from "react";
-import { analyzeFiles } from "../src/services/analysis";
-import type { onUploadFiles } from "../src/types/uploadFiles";
-
-/**
- * Example component showing how to display user-friendly analysis progress
- * This demonstrates the enhanced polling system with multiple analysis support
- */
-export const AnalysisProgressExample: React.FC = () => {
-  const [sessionId] = useState("your-session-id");
-  const [progress, setProgress] = useState(0);
-  const [statusMessage, setStatusMessage] = useState("Waiting to start...");
-  const [isAnalyzing, setIsAnalyzing] = useState(false);
-  const [analysisResult, setAnalysisResult] = useState<any>(null);
-
-  /**
-   * User-friendly progress messages based on backend status
-   */
-  const getProgressDisplay = (progress: number, step: string): string => {
-    // 50% = Processing
-    if (progress === 50) {
-      return "Analyzing your documents...";
-    }
-
-    // 100% = Completed (various outcomes)
-    if (progress === 100) {
-      switch (step) {
-        case "approved":
-          return "Document verified successfully ✓";
-        case "rejected":
-          return "Document verification failed";
-        case "to_verify":
-          return "Manual verification required";
-        case "failed":
-        case "error":
-          return "Analysis error occurred";
-        default:
-          return "Analysis completed";
-      }
-    }
-
-    return "Processing...";
-  };
-
-  /**
-   * Handle file upload and analysis with progress tracking
-   */
-  const handleAnalyzeFiles = async () => {
-    setIsAnalyzing(true);
-    setProgress(0);
-    setStatusMessage("Starting analysis...");
-
-    try {
-      // Example files (replace with actual file data)
-      const files: onUploadFiles = {
-        front: "data:image/jpeg;base64,...", // Your front image data URL
-        back: "data:image/jpeg;base64,...",  // Your back image data URL (optional)
-      };
-
-      const result = await analyzeFiles(
-        sessionId,
-        files,
-        "identity_card", // Document type ID
-        {
-          save: true,
-          incrementAnalysis: true,
-          enablePolling: true, // Enable automatic polling
-          pollingOptions: {
-            interval: 2000, // Poll every 2 seconds
-            maxAttempts: 300, // Max 10 minutes
-
-            // Progress callback - called during analysis
-            onProgress: (status) => {
-              console.log("📊 Progress update:", status);
-              setProgress(status.progress);
-              
-              // Use user-friendly message from backend
-              const displayMessage = getProgressDisplay(
-                status.progress,
-                status.currentStep
-              );
-              setStatusMessage(displayMessage);
-            },
-
-            // Complete callback - called when analysis finishes successfully
-            onComplete: (status) => {
-              console.log("✅ Analysis completed:", status);
-              setProgress(100);
-              
-              const displayMessage = getProgressDisplay(
-                status.progress,
-                status.currentStep
-              );
-              setStatusMessage(displayMessage);
-              
-              // Show different UI based on the result
-              if (status.currentStep === "approved") {
-                // Document was approved - show success UI
-                console.log("✅ Document approved!");
-              } else if (status.currentStep === "rejected") {
-                // Document was rejected - show error UI
-                console.log("❌ Document rejected!");
-              } else if (status.currentStep === "to_verify") {
-                // Manual verification needed - show pending UI
-                console.log("⏳ Manual verification required");
-              }
-            },
-
-            // Failed callback - called if analysis fails
-            onFailed: (status, error) => {
-              console.error("❌ Analysis failed:", error);
-              setProgress(100);
-              setStatusMessage("Analysis failed - please try again");
-            },
-          },
-        }
-      );
-
-      console.log("🎉 Final result:", result);
-      setAnalysisResult(result);
-    } catch (error) {
-      console.error("❌ Analysis error:", error);
-      setStatusMessage("Error: " + (error as Error).message);
-    } finally {
-      setIsAnalyzing(false);
-    }
-  };
-
-  /**
-   * Progress bar color based on status
-   */
-  const getProgressColor = (): string => {
-    if (progress === 100) {
-      if (statusMessage.includes("successfully")) return "bg-green-500";
-      if (statusMessage.includes("failed") || statusMessage.includes("error"))
-        return "bg-red-500";
-      if (statusMessage.includes("verification required")) return "bg-yellow-500";
-    }
-    return "bg-blue-500";
-  };
-
-  return (
-    <div className="max-w-2xl mx-auto p-6 space-y-6">
-      <div className="bg-white rounded-lg shadow-md p-6">
-        <h2 className="text-2xl font-bold mb-4">Document Analysis</h2>
-
-        {/* Progress Bar */}
-        <div className="mb-6">
-          <div className="flex justify-between mb-2">
-            <span className="text-sm font-medium text-gray-700">Progress</span>
-            <span className="text-sm font-medium text-gray-700">
-              {progress}%
-            </span>
-          </div>
-          <div className="w-full bg-gray-200 rounded-full h-3">
-            <div
-              className={`h-3 rounded-full transition-all duration-300 ${getProgressColor()}`}
-              style={{ width: `${progress}%` }}
-            />
-          </div>
-        </div>
-
-        {/* Status Message */}
-        <div className="mb-6">
-          <p className="text-center text-lg font-medium text-gray-700">
-            {statusMessage}
-          </p>
-        </div>
-
-        {/* Action Button */}
-        <button
-          onClick={handleAnalyzeFiles}
-          disabled={isAnalyzing}
-          className={`w-full py-3 px-4 rounded-lg font-semibold text-white transition-colors ${
-            isAnalyzing
-              ? "bg-gray-400 cursor-not-allowed"
-              : "bg-blue-600 hover:bg-blue-700"
-          }`}
-        >
-          {isAnalyzing ? "Analyzing..." : "Start Analysis"}
-        </button>
-
-        {/* Result Display */}
-        {analysisResult && (
-          <div className="mt-6 p-4 bg-gray-50 rounded-lg">
-            <h3 className="font-semibold mb-2">Analysis Result:</h3>
-            <pre className="text-xs overflow-auto">
-              {JSON.stringify(analysisResult, null, 2)}
-            </pre>
-          </div>
-        )}
-      </div>
-
-      {/* Status Legend */}
-      <div className="bg-white rounded-lg shadow-md p-6">
-        <h3 className="font-semibold mb-3">Status Guide</h3>
-        <ul className="space-y-2 text-sm">
-          <li className="flex items-center">
-            <span className="w-3 h-3 bg-blue-500 rounded-full mr-2"></span>
-            <span>50% - Document is being analyzed</span>
-          </li>
-          <li className="flex items-center">
-            <span className="w-3 h-3 bg-green-500 rounded-full mr-2"></span>
-            <span>100% - Document approved ✓</span>
-          </li>
-          <li className="flex items-center">
-            <span className="w-3 h-3 bg-red-500 rounded-full mr-2"></span>
-            <span>100% - Document rejected or failed</span>
-          </li>
-          <li className="flex items-center">
-            <span className="w-3 h-3 bg-yellow-500 rounded-full mr-2"></span>
-            <span>100% - Manual verification required</span>
-          </li>
-        </ul>
-      </div>
-    </div>
-  );
-};
-
-export default AnalysisProgressExample;

package/examples/sdk-configuration.ts

@@ -1,187 +0,0 @@
-/**
- * Exemple d'utilisation de la configuration dynamique du SDK
- * Ce fichier montre comment configurer le SDK pour différents environnements
- */
-
-import { configureApiBaseURL } from "client-sessions-react-sdk";
-
-const PRODUCTION_API_URL: string =
-  process.env.VITE_API_URL ||
-  "https://app.datakeen.co/backend";
-
-// =====================================
-// Configuration par environnement
-// =====================================
-
-export const configureSDKForEnvironment = () => {
-  const environment = process.env.NODE_ENV || "development";
-
-  let apiBaseURL: string;
-
-  switch (environment) {
-    case "production":
-      apiBaseURL = PRODUCTION_API_URL;
-      break;
-
-    case "staging":
-      apiBaseURL = "https://app.staging.datakeen.co/backend";
-      break;
-
-    case "development":
-    default:
-      apiBaseURL = "https://app.dev.datakeen.co/backend";
-      break;
-  }
-
-  // Configurer l'URL de base du SDK
-  configureApiBaseURL(apiBaseURL);
-
-  console.info(`🔧 SDK configuré pour l'environnement: ${environment}`);
-  console.info(`🌐 URL de l'API: ${apiBaseURL}`);
-
-  return apiBaseURL;
-};
-
-// =====================================
-// Configuration avec variables d'environnement personnalisées
-// =====================================
-
-export const configureSDKFromEnv = () => {
-  // Récupérer l'URL depuis les variables d'environnement
-  const apiBaseURL =
-    process.env.REACT_APP_SDK_API_URL ||
-    process.env.VITE_SESSION_SDK_BASE_URL ||
-    "https://app.dev.datakeen.co/backend";
-
-  configureApiBaseURL(apiBaseURL);
-
-  return apiBaseURL;
-};
-
-// =====================================
-// Configuration dynamique avec détection automatique
-// =====================================
-
-export const configureSDKDynamically = () => {
-  // Détecter l'environnement basé sur l'URL actuelle
-  const hostname = window.location.hostname;
-
-  let apiBaseURL: string;
-
-  if (hostname.includes("app.datakeen.co") || hostname.includes("app-v3.datakeen.co")) {
-    // Production
-    apiBaseURL = PRODUCTION_API_URL;
-  } else if (hostname.includes("app.staging.datakeen.co")) {
-    // Staging
-    apiBaseURL = "https://app.staging.datakeen.co/backend";
-  } else if (hostname.includes("app.dev.datakeen.co")) {
-    // Development
-    apiBaseURL = "https://app.dev.datakeen.co/backend";
-  } else if (hostname === "localhost" || hostname.startsWith("192.168.")) {
-    // Développement local
-    apiBaseURL = "http://localhost:8888/backend";
-  } else {
-    // Fallback - dev par défaut
-    apiBaseURL = "https://app.dev.datakeen.co/backend";
-  }
-
-  configureApiBaseURL(apiBaseURL);
-
-  return apiBaseURL;
-};
-
-// =====================================
-// Configuration pour les tests
-// =====================================
-
-export const configureSDKForTesting = (mockApiURL?: string) => {
-  const apiBaseURL = mockApiURL || "http://localhost:3001/backend";
-
-  configureApiBaseURL(apiBaseURL);
-
-  return apiBaseURL;
-};
-
-// =====================================
-// Configuration avancée avec retry et timeout
-// =====================================
-
-export const configureSDKAdvanced = (options: {
-  environment?: "development" | "staging" | "production";
-  customURL?: string;
-  timeout?: number;
-  retryAttempts?: number;
-}) => {
-  const { environment, customURL, timeout, retryAttempts } = options;
-
-  let apiBaseURL = customURL;
-
-  if (!apiBaseURL && environment) {
-    switch (environment) {
-      case "production":
-        apiBaseURL = PRODUCTION_API_URL;
-        break;
-      case "staging":
-        apiBaseURL = "https://app.staging.datakeen.co/backend";
-        break;
-      case "development":
-      default:
-        apiBaseURL = "https://app.dev.datakeen.co/backend";
-        break;
-    }
-  }
-
-  if (!apiBaseURL) {
-    apiBaseURL = "https://dev2.datakeen.co/backend";
-  }
-
-  // Pour l'instant, on configure juste l'URL de base
-  // Dans une version future, on pourrait créer une nouvelle instance avec config complète
-  configureApiBaseURL(apiBaseURL);
-
-  return {
-    apiBaseURL,
-    timeout: timeout || 30000,
-    retryAttempts: retryAttempts || 3,
-  };
-};
-
-// =====================================
-// Fonction utilitaire pour valider la configuration
-// =====================================
-
-export const validateSDKConfiguration = async (
-  apiBaseURL: string
-): Promise<boolean> => {
-  try {
-    // Test simple de connectivité
-    const response = await fetch(
-      `${apiBaseURL.replace("/backend/session", "")}/health`,
-      {
-        method: "GET",
-        headers: {
-          Accept: "application/json",
-        },
-        timeout: 5000,
-      } as RequestInit
-    );
-
-    return response.ok;
-  } catch (error) {
-    console.warn("❌ Impossible de valider la configuration du SDK:", error);
-    return false;
-  }
-};
-
-// =====================================
-// Export par défaut avec configuration automatique
-// =====================================
-
-export default {
-  configureForEnvironment: configureSDKForEnvironment,
-  configureFromEnv: configureSDKFromEnv,
-  configureDynamically: configureSDKDynamically,
-  configureForTesting: configureSDKForTesting,
-  configureAdvanced: configureSDKAdvanced,
-  validate: validateSDKConfiguration,
-};

package/examples/test-updated-urls.ts

@@ -1,162 +0,0 @@
-/**
- * Test de validation pour les nouvelles URLs d'environnement
- * Vérifier que toutes les URLs ont été mises à jour correctement
- */
-
-import {
-  configureSDKForEnvironment,
-  configureSDKFromEnv,
-  configureSDKDynamically,
-  configureSDKAdvanced,
-  validateSDKConfiguration,
-} from "./sdk-configuration";
-
-// URLs attendues pour chaque environnement
-const EXPECTED_URLS = {
-  production: "https://app.datakeen.co/backend/session",
-  staging: "https://app.staging.datakeen.co/backend/session",
-  development: "https://app.dev.datakeen.co/backend/session",
-  localhost: "http://localhost:8888/backend/session",
-};
-
-// Test 1: Configuration par environnement
-const testEnvironmentConfiguration = () => {
-  console.group("🧪 Test 1: Configuration par environnement");
-
-  // Mock process.env.NODE_ENV
-  const originalEnv = process.env.NODE_ENV;
-
-  // Test production
-  process.env.NODE_ENV = "production";
-  const prodURL = configureSDKForEnvironment();
-  console.log(
-    `Production: ${prodURL === EXPECTED_URLS.production ? "✅" : "❌"
-    } ${prodURL}`
-  );
-
-  // Test staging
-  process.env.NODE_ENV = "staging";
-  const stagingURL = configureSDKForEnvironment();
-  console.log(
-    `Staging: ${stagingURL === EXPECTED_URLS.staging ? "✅" : "❌"
-    } ${stagingURL}`
-  );
-
-  // Test development
-  process.env.NODE_ENV = "development";
-  const devURL = configureSDKForEnvironment();
-  console.log(
-    `Development: ${devURL === EXPECTED_URLS.development ? "✅" : "❌"
-    } ${devURL}`
-  );
-
-  // Restaurer l'environnement original
-  process.env.NODE_ENV = originalEnv;
-
-  console.groupEnd();
-};
-
-// Test 2: Configuration dynamique par hostname
-const testDynamicConfiguration = () => {
-  console.group("🧪 Test 2: Configuration dynamique");
-
-  const originalLocation = window.location;
-
-  const testCases = [
-    { hostname: "app.datakeen.co", expected: EXPECTED_URLS.production },
-    { hostname: "app.staging.datakeen.co", expected: EXPECTED_URLS.staging },
-    { hostname: "app.dev.datakeen.co", expected: EXPECTED_URLS.development },
-    { hostname: "localhost", expected: EXPECTED_URLS.localhost },
-    { hostname: "unknown.com", expected: EXPECTED_URLS.development }, // fallback
-  ];
-
-  testCases.forEach((testCase) => {
-    // Mock window.location.hostname
-    Object.defineProperty(window, "location", {
-      value: { ...originalLocation, hostname: testCase.hostname },
-      writable: true,
-    });
-
-    const result = configureSDKDynamically();
-    const status = result === testCase.expected ? "✅" : "❌";
-    console.log(`${status} ${testCase.hostname} → ${result}`);
-  });
-
-  // Restaurer window.location
-  Object.defineProperty(window, "location", {
-    value: originalLocation,
-    writable: true,
-  });
-
-  console.groupEnd();
-};
-
-// Test 3: Configuration avancée
-const testAdvancedConfiguration = () => {
-  console.group("🧪 Test 3: Configuration avancée");
-
-  // Test avec environnement spécifique
-  const prodConfig = configureSDKAdvanced({ environment: "production" });
-  console.log(
-    `Production avancée: ${prodConfig.apiBaseURL === EXPECTED_URLS.production ? "✅" : "❌"
-    } ${prodConfig.apiBaseURL}`
-  );
-
-  // Test avec URL custom
-  const customURL = "https://custom.datakeen.co/backend/session";
-  const customConfig = configureSDKAdvanced({ customURL });
-  console.log(
-    `URL custom: ${customConfig.apiBaseURL === customURL ? "✅" : "❌"} ${customConfig.apiBaseURL
-    }`
-  );
-
-  console.groupEnd();
-};
-
-// Test 4: Validation des URLs
-const testURLValidation = async () => {
-  console.group("🧪 Test 4: Validation des URLs");
-
-  const urlsToTest = Object.values(EXPECTED_URLS);
-
-  for (const url of urlsToTest) {
-    try {
-      const isValid = await validateSDKConfiguration(url);
-      console.log(
-        `${isValid ? "✅" : "⚠️"} ${url} - ${isValid ? "Accessible" : "Non accessible"
-        }`
-      );
-    } catch (error) {
-      console.log(`❌ ${url} - Erreur: ${error.message}`);
-    }
-  }
-
-  console.groupEnd();
-};
-
-// Test principal
-export const runEnvironmentTests = async () => {
-  console.log("🚀 Tests de validation des environnements mis à jour\n");
-
-  console.log("📋 URLs attendues:");
-  console.table(EXPECTED_URLS);
-  console.log("");
-
-  testEnvironmentConfiguration();
-  testDynamicConfiguration();
-  testAdvancedConfiguration();
-  await testURLValidation();
-
-  console.log("\n✨ Tests terminés");
-};
-
-// Export pour la console
-if (typeof window !== "undefined") {
-  window.runEnvironmentTests = runEnvironmentTests;
-  console.log("💡 Pour tester les nouvelles URLs: runEnvironmentTests()");
-}
-
-export default {
-  runEnvironmentTests,
-  EXPECTED_URLS,
-};

package/examples/usage-example.tsx

@@ -1,49 +0,0 @@
-import React from "react";
-// Dans un projet qui utilise le SDK, l'import serait:
-// import { DatakeenSession } from 'datakeen-session-react';
-import DatakeenSession from "../src/components/DatakeenSession";
-
-interface DatakeenSDKTestProps {
-  sessionId: string;
-}
-
-export const DatakeenSDKTest: React.FC<DatakeenSDKTestProps> = ({
-  sessionId,
-}) => {
-  // Option 1: Utiliser la variable d'environnement directement (recommandée)
-  // Dans un vrai projet: const apiUrl = import.meta.env.VITE_API_URL;
-  const apiUrl = process.env.VITE_API_URL || "http://localhost:8888";
-
-  console.log("🔗 API URL utilisée pour le SDK:", apiUrl);
-
-  return (
-    <div className="w-full h-screen">
-      <DatakeenSession
-        sessionId={sessionId}
-        sessionConfig={{
-          selfie: true,
-          requireMobile: true,
-        }}
-        apiBaseUrl={apiUrl} // Configuration dynamique selon l'environnement
-      />
-    </div>
-  );
-};
-
-// Exemple d'utilisation alternative sans props
-export const DatakeenSDKAutoConfig: React.FC<DatakeenSDKTestProps> = ({
-  sessionId,
-}) => {
-  // Le SDK utilisera automatiquement VITE_API_URL ou VITE_API_BASE_URL
-  return (
-    <div className="w-full h-screen">
-      <DatakeenSession
-        sessionId={sessionId}
-        sessionConfig={{ selfie: true }}
-        // Pas besoin de spécifier apiBaseUrl, le SDK détectera automatiquement
-      />
-    </div>
-  );
-};
-
-export default DatakeenSDKTest;

package/jest.config.js

@@ -1,32 +0,0 @@
-module.exports = {
-    preset: 'ts-jest',
-    testEnvironment: 'jsdom',
-    transform: {
-        '^.+\\.(ts|tsx)$': 'babel-jest',
-    },
-    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
-    setupFilesAfterEnv: ['<rootDir>/setupTests.js'],
-    collectCoverage: true,
-    coverageDirectory: 'coverage',
-    testMatch: [
-        '**/__tests__/**/*.[jt]s?(x)',
-        '**/?(*.)+(spec|test).[tj]s?(x)'
-    ],
-    collectCoverageFrom: [
-        "src/**/*.{ts,tsx}",
-        "!src/**/*.d.ts",
-        "!src/types/**",
-        "!src/**/types.ts",
-        "!src/**/index.ts",
-        "!src/index.ts",
-        "!src/assets/**",
-        "!src/components/ui/Camera.tsx",
-        "!src/components/signature-electronic/DocusealSignature.tsx",
-        "!src/i18n/**",
-    ],
-    coverageReporters: ['text', 'lcov', 'cobertura'],
-    moduleNameMapper: {
-        '\\.(svg|png|jpg|jpeg|gif)$': '<rootDir>/__mocks__/fileMock.js',
-        '\\.css$': '<rootDir>/__mocks__/fileMock.js',
-    },
-};

package/postcss.config.js

@@ -1,6 +0,0 @@
-module.exports = {
-  plugins: {
-    "@tailwindcss/postcss": {},
-    autoprefixer: {},
-  },
-};