From cc7414a441b49cb8c1624cc724f1ff7e44b7c7e2 Mon Sep 17 00:00:00 2001
From: Sadrinho27 <Titouan.tabere@gmail.com>
Date: Tue, 30 Sep 2025 00:19:30 +0200
Subject: [PATCH] Added the 4NK authentication

---
 app/dashboard/layout.tsx     |   23 +-
 app/dashboard/page.tsx       |    9 +-
 app/login/page.tsx           |  214 ++----
 components/4nk/AuthModal.tsx |  308 ++-------
 components/4nk/Iframe.tsx    |   14 +-
 lib/4nk/EventBus.ts          |   52 +-
 lib/4nk/IframeReference.ts   |   18 +-
 lib/4nk/MessageBus.ts        | 1205 ++++++++++++++++++++--------------
 lib/4nk/UserStore.ts         |   62 +-
 9 files changed, 868 insertions(+), 1037 deletions(-)

diff --git a/app/dashboard/layout.tsx b/app/dashboard/layout.tsx
index d38129d..f3464a5 100644
--- a/app/dashboard/layout.tsx
+++ b/app/dashboard/layout.tsx
@@ -25,8 +25,9 @@ import {
   Home,
 } from "lucide-react"
 import { AuthModal } from "@/components/4nk/AuthModal"
-import { MessageBus } from "@/lib/4nk/MessageBus"
-import { UserStore } from "@/lib/4nk/UserStore"
+import { Iframe } from "@/components/4nk/Iframe"
+import MessageBus from "@/lib/4nk/MessageBus"
+import UserStore from "@/lib/4nk/UserStore"
 // DebugInfo supprimé
 
 export default function DashboardLayout({ children }: { children: React.ReactNode }) {
@@ -40,7 +41,7 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
 
   const router = useRouter()
   const pathname = usePathname()
-  const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev.4nk.io"
+  const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev3.4nkweb.com"
 
   const navigation = [
     { name: "Tableau de bord", href: "/dashboard", icon: LayoutDashboard },
@@ -60,11 +61,10 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
         const messageBus = MessageBus.getInstance(iframeUrl)
 
         if (accessToken) {
-          // Vérifier si on est en mode mock
-          const mockMode = messageBus.isInMockMode()
-          setIsMockMode(mockMode)
+          // Mode normal (pas de mock)
+          setIsMockMode(false)
 
-          if (mockMode) {
+          if (false) {
             console.log("🎭 Dashboard en mode mock")
             setIsAuthenticated(true)
             setUserInfo({
@@ -117,7 +117,6 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
     const messageBus = MessageBus.getInstance(iframeUrl)
 
     userStore.disconnect()
-    messageBus.disableMockMode()
 
     // Afficher un message de confirmation avec options
     setShowLogoutConfirm(true)
@@ -321,6 +320,14 @@ export default function DashboardLayout({ children }: { children: React.ReactNod
         </div>
       )}
 
+      {/* Iframe 4NK - affichée seulement si connecté */}
+      {isAuthenticated && (
+        <Iframe 
+          iframeUrl={process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev3.4nkweb.com"} 
+          showIframe={true} 
+        />
+      )}
+
       {/* Debug info retiré */}
     </div>
   )
diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx
index bc6c578..86c606f 100644
--- a/app/dashboard/page.tsx
+++ b/app/dashboard/page.tsx
@@ -26,7 +26,7 @@ import {
   HardDrive,
   X,
 } from "lucide-react"
-import { MessageBus } from "@/lib/4nk/MessageBus"
+import MessageBus from "@/lib/4nk/MessageBus"
 import Link from "next/link"
 
 export default function DashboardPage() {
@@ -54,13 +54,12 @@ export default function DashboardPage() {
   const [notifications, setNotifications] = useState<any[]>([])
 
   useEffect(() => {
-    const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev.4nk.io"
+    const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev3.4nkweb.com"
     const messageBus = MessageBus.getInstance(iframeUrl)
-    const mockMode = messageBus.isInMockMode()
-    setIsMockMode(mockMode)
+    setIsMockMode(false)
 
     // Simuler le chargement des données
-    if (mockMode) {
+    if (false) {
       setStats({
         totalDocuments: 1247,
         totalFolders: 89,
diff --git a/app/login/page.tsx b/app/login/page.tsx
index 19c9f8b..9d965b7 100644
--- a/app/login/page.tsx
+++ b/app/login/page.tsx
@@ -23,9 +23,9 @@ import {
   EyeOff,
 } from "lucide-react"
 import { AuthModal } from "@/components/4nk/AuthModal"
-import { MessageBus } from "@/lib/4nk/MessageBus"
+import MessageBus from "@/lib/4nk/MessageBus"
 import { MockService } from "@/lib/4nk/MockService"
-import { UserStore } from "@/lib/4nk/UserStore"
+import UserStore from "@/lib/4nk/UserStore"
 
 export default function LoginPage() {
   const [companyId, setCompanyId] = useState("")
@@ -34,11 +34,17 @@ export default function LoginPage() {
   const [showPairingSection, setShowPairingSection] = useState(false)
   const [pairingWords, setPairingWords] = useState(["", "", "", ""])
   const [pairingError, setPairingError] = useState("")
+  const [error, setError] = useState<string | null>(null)
   const [pairingSuccess, setPairingSuccess] = useState(false)
   const router = useRouter()
   const [showPairingInput, setShowPairingInput] = useState(false)
 
-  const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev.4nk.io"
+  const iframeUrl = process.env.NEXT_PUBLIC_4NK_IFRAME_URL || "https://dev3.4nkweb.com"
+
+  const handleLogin = () => {
+    setIsAuthModalOpen(true)
+    setError(null)
+  }
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault()
@@ -58,8 +64,7 @@ export default function LoginPage() {
         const mockService = MockService.getInstance()
         const userStore = UserStore.getInstance()
 
-        // Activer le mode mock
-        messageBus.enableMockMode()
+        // Mode normal (pas de mock)
 
         // Authentification mock
         const authResult = await mockService.mockAuthentication(companyId)
@@ -159,160 +164,57 @@ export default function LoginPage() {
           <p className="text-gray-600">Gestion électronique de documents sécurisée</p>
         </div>
 
-        {/* Navigation entre connexion et pairing */}
-        <div className="flex space-x-1 bg-gray-100 p-1 rounded-lg">
-          <button
-            onClick={() => setShowPairingSection(false)}
-            className={`flex-1 py-2 px-4 text-sm font-medium rounded-md transition-colors ${
-              !showPairingSection ? "bg-white text-gray-900 shadow-sm" : "text-gray-600 hover:text-gray-900"
-            }`}
-          >
-            <Building2 className="h-4 w-4 inline mr-2" />
-            Connexion
-          </button>
-          <button
-            onClick={() => setShowPairingSection(true)}
-            className={`flex-1 py-2 px-4 text-sm font-medium rounded-md transition-colors ${
-              showPairingSection ? "bg-white text-gray-900 shadow-sm" : "text-gray-600 hover:text-gray-900"
-            }`}
-          >
-            <Key className="h-4 w-4 inline mr-2" />
-            Pairing
-          </button>
-        </div>
+        {/* Carte de connexion 4NK */}
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-center">
+              <Shield className="h-8 w-8 mx-auto mb-4 text-blue-600" />
+              Connexion sécurisée 4NK
+            </CardTitle>
+            <CardDescription className="text-center">
+              Authentification cryptographique sans mot de passe
+            </CardDescription>
+          </CardHeader>
+          <CardContent className="space-y-6">
+            {/* Description de la connexion 4NK */}
+            <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
+              <h3 className="font-semibold text-blue-900 mb-2">🔐 Authentification 4NK</h3>
+              <ul className="text-sm text-blue-800 space-y-1">
+                <li>• Aucun mot de passe requis</li>
+                <li>• Identité cryptographique sécurisée</li>
+                <li>• Chiffrement bout en bout</li>
+                <li>• Protection par blockchain</li>
+              </ul>
+            </div>
 
-        {!showPairingSection ? (
-          /* Carte de connexion */
-          <Card>
-            <CardHeader>
-              <CardTitle className="flex items-center">
-                <Building2 className="h-5 w-5 mr-2 text-blue-600" />
-                Identification d'entreprise
-              </CardTitle>
-              <CardDescription>Connectez-vous avec votre identifiant unique sécurisé par 4NK</CardDescription>
-            </CardHeader>
-            <CardContent>
-              <form onSubmit={handleSubmit} className="space-y-4">
-                <div className="space-y-2">
-                  <Label htmlFor="companyId">Votre identifiant unique</Label>
-                  <Input
-                    id="companyId"
-                    type="text"
-                    placeholder="Saisissez votre identifiant d'entreprise"
-                    value={companyId}
-                    onChange={(e) => setCompanyId(e.target.value)}
-                    required
-                    className="w-full"
-                  />
-                </div>
+            {/* Affichage des erreurs */}
+            {error && (
+              <div className="bg-red-50 border border-red-200 rounded-lg p-4">
+                <p className="text-red-700 font-medium">Erreur de connexion :</p>
+                <p className="text-red-600 text-sm">{error}</p>
+              </div>
+            )}
 
-                {/* Info mode démonstration */}
-                <div className="bg-green-50 border border-green-200 rounded-lg p-3">
-                  <div className="flex items-start space-x-2">
-                    <TestTube className="h-4 w-4 text-green-600 mt-0.5 flex-shrink-0" />
-                    <div className="text-xs text-green-700">
-                      <p className="font-medium mb-1">Mode démonstration</p>
-                      <p>
-                        Utilisez l'identifiant <strong>"1234"</strong> pour accéder directement aux écrans de
-                        démonstration avec des données simulées.
-                      </p>
-                    </div>
-                  </div>
-                </div>
+            {/* Bouton de connexion */}
+            <Button 
+              onClick={handleLogin} 
+              className="w-full" 
+              size="lg"
+              disabled={isLoading}
+            >
+              <Shield className="h-5 w-5 mr-2" />
+              {isLoading ? "Connexion en cours..." : "Se connecter avec 4NK"}
+            </Button>
 
-                <Button type="submit" className="w-full" disabled={isLoading}>
-                  {isLoading ? "Connexion en cours..." : "Se connecter"}
-                </Button>
-              </form>
-            </CardContent>
-          </Card>
-        ) : (
-          /* Carte de pairing */
-          <Card>
-            <CardHeader>
-              <CardTitle className="flex items-center">
-                <Key className="h-5 w-5 mr-2 text-blue-600" />
-                Pairing d'appareil
-              </CardTitle>
-              <CardDescription>Ajoutez cet appareil à votre compte existant</CardDescription>
-            </CardHeader>
-            <CardContent>
-              {!pairingSuccess ? (
-                <form onSubmit={handlePairingSubmit} className="space-y-4">
-                  <div className="space-y-2">
-                    <div className="flex items-center justify-between">
-                      <Label>Mots de pairing temporaires</Label>
-                      <Button
-                        type="button"
-                        variant="outline"
-                        size="sm"
-                        onClick={() => setShowPairingInput(!showPairingInput)}
-                        className="text-blue-700 border-blue-300"
-                      >
-                        {showPairingInput ? <EyeOff className="h-4 w-4 mr-1" /> : <Eye className="h-4 w-4 mr-1" />}
-                        {showPairingInput ? "Masquer" : "Afficher"}
-                      </Button>
-                    </div>
-                    <p className="text-sm text-gray-600">Saisissez les 4 mots affichés sur votre autre appareil</p>
-                    <div className="grid grid-cols-2 gap-2">
-                      {pairingWords.map((word, index) => (
-                        <Input
-                          key={index}
-                          type={showPairingInput ? "text" : "password"}
-                          placeholder={`Mot ${index + 1}`}
-                          value={word}
-                          onChange={(e) => handlePairingWordChange(index, e.target.value)}
-                          className="text-center font-mono select-none"
-                          style={{ userSelect: "none", WebkitUserSelect: "none" }}
-                          onContextMenu={(e) => e.preventDefault()}
-                          onCopy={(e) => e.preventDefault()}
-                          onCut={(e) => e.preventDefault()}
-                          onPaste={(e) => e.preventDefault()}
-                          autoComplete="off"
-                          spellCheck={false}
-                          required
-                        />
-                      ))}
-                    </div>
-                  </div>
-
-                  {pairingError && (
-                    <div className="bg-red-50 border border-red-200 rounded-lg p-3">
-                      <div className="flex items-start space-x-2">
-                        <AlertTriangle className="h-4 w-4 text-red-600 mt-0.5 flex-shrink-0" />
-                        <p className="text-sm text-red-700">{pairingError}</p>
-                      </div>
-                    </div>
-                  )}
-
-                  <div className="bg-blue-50 border border-blue-200 rounded-lg p-3">
-                    <div className="text-xs text-blue-700">
-                      <p className="font-medium mb-1">Instructions :</p>
-                      <ol className="space-y-1">
-                        <li>1. Ouvrez DocV sur votre appareil principal</li>
-                        <li>2. Allez dans Paramètres → Sécurité</li>
-                        <li>3. Cliquez sur "Ajouter un appareil"</li>
-                        <li>4. Saisissez les 4 mots affichés ici</li>
-                      </ol>
-                    </div>
-                  </div>
-
-                  <Button type="submit" className="w-full">
-                    <Key className="h-4 w-4 mr-2" />
-                    Appairer cet appareil
-                  </Button>
-                </form>
-              ) : (
-                <div className="text-center py-6">
-                  <CheckCircle className="h-12 w-12 mx-auto text-green-600 mb-4" />
-                  <h3 className="text-lg font-semibold text-gray-900 mb-2">Pairing réussi !</h3>
-                  <p className="text-gray-600 mb-4">Cet appareil a été ajouté à votre compte avec succès.</p>
-                  <div className="animate-pulse text-blue-600">Redirection vers le dashboard...</div>
-                </div>
-              )}
-            </CardContent>
-          </Card>
-        )}
+            {/* Informations sur l'iframe */}
+            <div className="bg-gray-50 border border-gray-200 rounded-lg p-3">
+              <p className="text-xs text-gray-600 text-center">
+                <strong>URL d'authentification :</strong><br />
+                {iframeUrl}
+              </p>
+            </div>
+          </CardContent>
+        </Card>
 
         {/* Badges de sécurité */}
         <div className="flex flex-wrap justify-center gap-2">
diff --git a/components/4nk/AuthModal.tsx b/components/4nk/AuthModal.tsx
index 57ee619..b16107e 100644
--- a/components/4nk/AuthModal.tsx
+++ b/components/4nk/AuthModal.tsx
@@ -3,10 +3,9 @@
 import { useState, useEffect, memo } from "react"
 import { Button } from "@/components/ui/button"
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
-import { Shield, CheckCircle, Loader2, AlertCircle, RefreshCw } from "lucide-react"
+import { Shield, CheckCircle, Loader2 } from "lucide-react"
 import { Iframe } from "./Iframe"
-import { MessageBus } from "@/lib/4nk/MessageBus"
-import { IframeReference } from "@/lib/4nk/IframeReference"
+import MessageBus from "@/lib/4nk/MessageBus"
 
 interface AuthModalProps {
   isOpen: boolean
@@ -19,188 +18,38 @@ export const AuthModal = memo(function AuthModal({ isOpen, onConnect, onClose, i
   const [isIframeReady, setIsIframeReady] = useState(false)
   const [showIframe, setShowIframe] = useState(false)
   const [authSuccess, setAuthSuccess] = useState(false)
-  const [isLoading, setIsLoading] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [loadingStep, setLoadingStep] = useState("")
-  const [retryCount, setRetryCount] = useState(0)
-  const [iframeLoaded, setIframeLoaded] = useState(false)
 
-  const maxRetries = 3
+  useEffect(() => {
+    MessageBus.getInstance(iframeUrl).isReady().then(() => {
+      setIsIframeReady(true)
+    })
+  }, [iframeUrl])
 
   useEffect(() => {
     if (!isOpen) {
-      // Reset des états à la fermeture
-      setIsIframeReady(false)
       setShowIframe(false)
+      setIsIframeReady(false)
       setAuthSuccess(false)
-      setIsLoading(false)
-      setError(null)
-      setLoadingStep("")
-      setRetryCount(0)
-      setIframeLoaded(false)
-      return
     }
+  }, [isOpen])
 
-    initAuth()
-  }, [isOpen, iframeUrl, retryCount])
-
-  const initAuth = async () => {
-    try {
-      setIsLoading(true)
-      setError(null)
-      setLoadingStep("Initialisation...")
-
-      console.log("🔗 Initialisation authentification 4NK avec:", iframeUrl)
-      console.log("🔄 Tentative:", retryCount + 1, "/", maxRetries + 1)
-
-      // Étape 1: Attendre que l'iframe soit disponible dans le DOM
-      setLoadingStep("Chargement de l'iframe...")
-      let attempts = 0
-      const maxAttempts = 40 // 20 secondes
-
-      while (attempts < maxAttempts) {
-        const iframe = IframeReference.getIframe()
-        if (iframe && iframe.contentWindow) {
-          console.log("✅ Iframe disponible après", attempts * 500, "ms")
-          break
-        }
-        await new Promise((resolve) => setTimeout(resolve, 500))
-        attempts++
-      }
-
-      if (attempts >= maxAttempts) {
-        throw new Error("Iframe 4NK non disponible dans le DOM après 20 secondes")
-      }
-
-      // Étape 2: Attendre que l'iframe soit complètement chargée
-      setLoadingStep("Attente du chargement complet...")
-      await waitForIframeLoad()
-
+  useEffect(() => {
+    if (isIframeReady && !showIframe) {
       setShowIframe(true)
 
-      // Étape 3: Attendre le message LISTENING de l'iframe
-      setLoadingStep("Attente du signal LISTENING...")
-      const messageBus = MessageBus.getInstance(iframeUrl)
+      MessageBus.getInstance(iframeUrl).requestLink().then(() => {
+        setAuthSuccess(true)
 
-      console.log("⏳ Attente du message LISTENING de l'iframe...")
-      await messageBus.isReady()
-      console.log("✅ Iframe prête et en écoute")
+        setTimeout(() => onConnect(), 500)
+      }).catch((_error: string) => {
+        setShowIframe(false)
+        setIsIframeReady(false)
+        setAuthSuccess(false)
 
-      setIsIframeReady(true)
-
-      // Étape 4: Demander l'authentification (REQUEST_LINK)
-      setLoadingStep("Demande d'authentification...")
-      console.log("🔐 Envoi REQUEST_LINK...")
-      await messageBus.requestLink()
-      console.log("✅ LINK_ACCEPTED reçu, tokens stockés")
-
-      // Étape 5: Récupérer l'ID d'appairage
-      setLoadingStep("Récupération de l'identité...")
-      console.log("🆔 Récupération de l'ID d'appairage...")
-      await messageBus.getUserPairingId()
-      console.log("✅ ID d'appairage récupéré")
-
-      setAuthSuccess(true)
-
-      // Délai avant de déclencher onConnect
-      setTimeout(() => {
-        onConnect()
-      }, 500)
-    } catch (err) {
-      console.error("❌ Authentication error:", err)
-      const errorMessage = err instanceof Error ? err.message : "Erreur d'authentification"
-
-      // Messages d'erreur plus spécifiques selon le protocole 4NK
-      if (errorMessage.includes("LINK_ACCEPTED")) {
-        setError("Erreur d'authentification : réponse inattendue du serveur 4NK")
-      } else if (errorMessage.includes("Tokens manquants")) {
-        setError("Erreur : les tokens d'authentification n'ont pas été reçus")
-      } else if (errorMessage.includes("LISTENING")) {
-        setError("L'iframe 4NK n'est pas en écoute. Vérifiez l'URL de l'iframe.")
-      } else if (errorMessage.includes("Timeout")) {
-        setError("Timeout : L'iframe 4NK ne répond pas. Vérifiez votre connexion.")
-      } else if (errorMessage.includes("origin")) {
-        setError("Erreur de configuration : les domaines ne correspondent pas")
-      } else {
-        setError(errorMessage)
-      }
-
-      setIsIframeReady(false)
-      setShowIframe(false)
-    } finally {
-      setIsLoading(false)
-      setLoadingStep("")
+        onClose()
+      })
     }
-  }
-
-  const waitForIframeLoad = (): Promise<void> => {
-    return new Promise((resolve, reject) => {
-      const iframe = IframeReference.getIframe()
-      if (!iframe) {
-        reject(new Error("Iframe not found"))
-        return
-      }
-
-      // Si l'iframe est déjà chargée
-      if (iframeLoaded) {
-        resolve()
-        return
-      }
-
-      const timeout = setTimeout(() => {
-        cleanup()
-        reject(new Error("Timeout: L'iframe n'a pas fini de se charger"))
-      }, 30000) // 30 secondes pour le chargement
-
-      const cleanup = () => {
-        clearTimeout(timeout)
-        iframe.removeEventListener("load", onLoad)
-        iframe.removeEventListener("error", onError)
-      }
-
-      const onLoad = () => {
-        console.log("✅ Iframe loaded successfully")
-        setIframeLoaded(true)
-        cleanup()
-        // Attendre un peu plus pour que le contenu soit prêt
-        setTimeout(resolve, 2000)
-      }
-
-      const onError = () => {
-        console.error("❌ Iframe failed to load")
-        cleanup()
-        reject(new Error("Erreur de chargement de l'iframe"))
-      }
-
-      iframe.addEventListener("load", onLoad)
-      iframe.addEventListener("error", onError)
-
-      // Si l'iframe semble déjà chargée
-      if (iframe.contentDocument?.readyState === "complete") {
-        onLoad()
-      }
-    })
-  }
-
-  const handleRetry = () => {
-    if (retryCount < maxRetries) {
-      setRetryCount((prev) => prev + 1)
-      setError(null)
-    } else {
-      setError("Nombre maximum de tentatives atteint. Veuillez vérifier votre connexion et réessayer plus tard.")
-    }
-  }
-
-  const handleForceRetry = () => {
-    setRetryCount(0)
-    setError(null)
-    setIframeLoaded(false)
-    // Forcer le rechargement de l'iframe
-    const iframe = IframeReference.getIframe()
-    if (iframe) {
-      iframe.src = iframe.src
-    }
-  }
+  }, [isIframeReady, showIframe, iframeUrl, onConnect, onClose])
 
   if (!isOpen) return null
 
@@ -215,106 +64,25 @@ export const AuthModal = memo(function AuthModal({ isOpen, onConnect, onClose, i
           <CardDescription>Connexion sécurisée avec votre identité cryptographique</CardDescription>
         </CardHeader>
         <CardContent className="space-y-6">
-          {error && (
-            <div className="bg-red-50 border border-red-200 rounded-lg p-4">
-              <div className="flex items-start space-x-2">
-                <AlertCircle className="h-5 w-5 text-red-600 mt-0.5 flex-shrink-0" />
-                <div className="flex-1">
-                  <p className="text-red-700 text-sm font-medium mb-2">Erreur de connexion</p>
-                  <p className="text-red-600 text-xs mb-3">{error}</p>
-
-                  <div className="flex flex-col gap-2">
-                    {retryCount < maxRetries && (
-                      <Button
-                        variant="outline"
-                        size="sm"
-                        onClick={handleRetry}
-                        className="bg-transparent text-red-700 border-red-300 hover:bg-red-50"
-                      >
-                        <RefreshCw className="h-4 w-4 mr-2" />
-                        Réessayer ({retryCount + 1}/{maxRetries + 1})
-                      </Button>
-                    )}
-
-                    <Button
-                      variant="outline"
-                      size="sm"
-                      onClick={handleForceRetry}
-                      className="bg-transparent text-red-700 border-red-300 hover:bg-red-50"
-                    >
-                      <RefreshCw className="h-4 w-4 mr-2" />
-                      Forcer le rechargement
-                    </Button>
-                  </div>
-                </div>
+          {!isIframeReady && (
+            <div className="flex flex-col items-center justify-center h-96 gap-4">
+              <Loader2 className="h-10 w-10 animate-spin text-blue-600" />
+              <div className="font-semibold text-lg">Chargement de l'authentification...</div>
+            </div>
+          )}
+          {authSuccess ? (
+            <div className="flex flex-col items-center justify-center h-96 gap-5">
+              <CheckCircle className="h-12 w-12 text-green-600" />
+              <div className="font-semibold text-lg text-green-700">
+                Authentification réussie !
               </div>
             </div>
-          )}
-
-          {isLoading && !authSuccess && (
-            <div className="text-center py-8">
-              <Loader2 className="h-8 w-8 animate-spin mx-auto mb-4 text-blue-600" />
-              <p className="text-gray-600 font-medium">{loadingStep}</p>
-              {loadingStep && <p className="text-gray-500 text-sm mt-2">Protocole 4NK en cours...</p>}
-
-              {/* Barre de progression visuelle */}
-              <div className="mt-4 w-full bg-gray-200 rounded-full h-2">
-                <div
-                  className="bg-blue-600 h-2 rounded-full transition-all duration-500"
-                  style={{
-                    width:
-                      loadingStep === "Initialisation..."
-                        ? "15%"
-                        : loadingStep === "Chargement de l'iframe..."
-                          ? "30%"
-                          : loadingStep === "Attente du chargement complet..."
-                            ? "45%"
-                            : loadingStep === "Attente du signal LISTENING..."
-                              ? "60%"
-                              : loadingStep === "Demande d'authentification..."
-                                ? "80%"
-                                : loadingStep === "Récupération de l'identité..."
-                                  ? "95%"
-                                  : "0%",
-                  }}
-                />
-              </div>
-            </div>
-          )}
-
-          {authSuccess && (
-            <div className="text-center py-8">
-              <CheckCircle className="h-12 w-12 text-green-600 mx-auto mb-4" />
-              <p className="text-green-700 font-semibold">Authentification réussie !</p>
-              <p className="text-gray-600 text-sm mt-2">Tokens stockés • Redirection en cours...</p>
-            </div>
-          )}
-
-          {showIframe && !authSuccess && !error && (
-            <div className="border rounded-lg overflow-hidden">
-              <div className="bg-blue-50 p-2 text-center">
-                <p className="text-blue-700 text-sm">Interface d'authentification 4NK</p>
-                <p className="text-blue-600 text-xs">En attente de LISTENING → REQUEST_LINK → LINK_ACCEPTED</p>
-              </div>
-              <Iframe iframeUrl={iframeUrl} showIframe={true} />
-            </div>
-          )}
-
-          {/* Informations de debug */}
-          {(error || isLoading) && (
-            <div className="bg-gray-50 p-3 rounded-lg text-xs">
-              <p>
-                <strong>URL:</strong> {iframeUrl}
-              </p>
-              <p>
-                <strong>Tentative:</strong> {retryCount + 1}/{maxRetries + 1}
-              </p>
-              <p>
-                <strong>Iframe chargée:</strong> {iframeLoaded ? "Oui" : "Non"}
-              </p>
-              <p>
-                <strong>Protocole:</strong> LISTENING → REQUEST_LINK → LINK_ACCEPTED
-              </p>
+          ) : (
+            <div className="flex justify-center items-center w-full">
+              <Iframe
+                iframeUrl={iframeUrl}
+                showIframe={showIframe}
+              />
             </div>
           )}
 
diff --git a/components/4nk/Iframe.tsx b/components/4nk/Iframe.tsx
index 18ff21f..7d5203e 100644
--- a/components/4nk/Iframe.tsx
+++ b/components/4nk/Iframe.tsx
@@ -1,7 +1,7 @@
 "use client"
 
 import { useRef, useEffect, memo } from "react"
-import { IframeReference } from "@/lib/4nk/IframeReference"
+import IframeReference from "@/lib/4nk/IframeReference"
 
 interface IframeProps {
   iframeUrl: string
@@ -19,19 +19,19 @@ export const Iframe = memo(function Iframe({ iframeUrl, showIframe = false }: If
     return () => {
       IframeReference.setIframe(null)
     }
-  }, [])
+  }, [iframeRef.current])
 
   return (
     <iframe
       ref={iframeRef}
       src={iframeUrl}
       style={{
-        width: showIframe ? "100%" : "0",
-        height: showIframe ? "400px" : "0",
-        border: "none",
-        display: showIframe ? "block" : "none",
+        display: showIframe ? 'block' : 'none',
+        width: '400px',
+        height: '400px',
+        border: 'none',
+        overflow: 'hidden'
       }}
-      sandbox="allow-scripts allow-same-origin allow-forms"
       title="4NK Authentication"
     />
   )
diff --git a/lib/4nk/EventBus.ts b/lib/4nk/EventBus.ts
index 8b08e5b..20e8c28 100644
--- a/lib/4nk/EventBus.ts
+++ b/lib/4nk/EventBus.ts
@@ -1,47 +1,33 @@
-/**
- * EventBus - Bus d'événements intra-onglet pour la communication interne
- * Pattern Singleton avec pub/sub
- */
-export class EventBus {
-  private static instance: EventBus | null = null
-  private listeners: Map<string, Array<(...args: any[]) => void>> = new Map()
+export default class EventBus {
+  private static instance: EventBus;
+  private listeners: Record<string, Array<(...args: any[]) => void>> = {};
 
-  private constructor() {}
+  private constructor() { }
 
-  static getInstance(): EventBus {
+  public static getInstance(): EventBus {
     if (!EventBus.instance) {
-      EventBus.instance = new EventBus()
+      EventBus.instance = new EventBus();
     }
-    return EventBus.instance
+    return EventBus.instance;
   }
 
-  on(event: string, callback: (...args: any[]) => void): () => void {
-    if (!this.listeners.has(event)) {
-      this.listeners.set(event, [])
+  public on(event: string, callback: (...args: any[]) => void): () => void {
+    if (!this.listeners[event]) {
+      this.listeners[event] = [];
     }
-
-    const eventListeners = this.listeners.get(event)!
-    eventListeners.push(callback)
-
-    // Retourne une fonction d'unsubscribe
+    this.listeners[event].push(callback);
     return () => {
-      const index = eventListeners.indexOf(callback)
-      if (index > -1) {
-        eventListeners.splice(index, 1)
+      if (this.listeners[event]) {
+        this.listeners[event] = this.listeners[event].filter(cb => cb !== callback);
       }
-    }
+    };
   }
 
-  emit(event: string, ...args: any[]): void {
-    const eventListeners = this.listeners.get(event)
-    if (eventListeners) {
-      eventListeners.forEach((callback) => {
-        try {
-          callback(...args)
-        } catch (error) {
-          console.error(`Error in event listener for ${event}:`, error)
-        }
-      })
+  public emit(event: string, ...args: any[]): void {
+    if (this.listeners[event]) {
+      this.listeners[event].forEach(callback => {
+        callback(...args);
+      });
     }
   }
 }
diff --git a/lib/4nk/IframeReference.ts b/lib/4nk/IframeReference.ts
index f27cfd3..90dde57 100644
--- a/lib/4nk/IframeReference.ts
+++ b/lib/4nk/IframeReference.ts
@@ -1,15 +1,13 @@
-/**
- * IframeReference - Référence globale pour l'iframe 4NK
- * Permet aux autres services d'accéder à l'iframe pour postMessage
- */
-export class IframeReference {
-  private static iframe: HTMLIFrameElement | null = null
+export default class IframeReference {
+  private static iframe: HTMLIFrameElement | null = null;
 
-  static setIframe(iframe: HTMLIFrameElement | null): void {
-    IframeReference.iframe = iframe
+  private constructor() { }
+
+  public static setIframe(iframe: HTMLIFrameElement | null): void {
+    this.iframe = iframe;
   }
 
-  static getIframe(): HTMLIFrameElement | null {
-    return IframeReference.iframe
+  public static getIframe(): HTMLIFrameElement | null {
+    return this.iframe;
   }
 }
diff --git a/lib/4nk/MessageBus.ts b/lib/4nk/MessageBus.ts
index 2ffe5da..b8af7b6 100644
--- a/lib/4nk/MessageBus.ts
+++ b/lib/4nk/MessageBus.ts
@@ -1,559 +1,746 @@
-import { v4 as uuidv4 } from "uuid"
-import { IframeReference } from "./IframeReference"
-import { EventBus } from "./EventBus"
-import { UserStore } from "./UserStore"
-import { MockService } from "./MockService"
+import IframeReference from './IframeReference';
+import EventBus from './EventBus';
+import UserStore from './UserStore';
+import { v4 as uuidv4 } from 'uuid';
 
-/**
- * MessageBus - Passerelle de communication avec l'iframe 4NK
- * Supporte le mode mock avec l'identifiant d'entreprise "1234"
- */
-export class MessageBus {
-  private static instance: MessageBus | null = null
-  private origin: string
-  private eventBus: EventBus
-  private userStore: UserStore
-  private mockService: MockService
-  private errors: Map<string, any> = new Map()
-  private isMockMode = false
+export default class MessageBus {
+  private static instance: MessageBus;
+  private readonly origin: string;
+  private messageListener: ((event: MessageEvent) => void) | null = null;
+  private errors: { [key: string]: string } = {};
+  private readyPromise: Promise<void> | null = null;
+  private isReadyFlag = false;
 
   private constructor(origin: string) {
-    this.origin = origin
-    this.eventBus = EventBus.getInstance()
-    this.userStore = UserStore.getInstance()
-    this.mockService = MockService.getInstance()
-
-    console.log("🔧 MessageBus initialized with origin:", origin)
+    this.origin = origin;
   }
 
-  static getInstance(origin: string): MessageBus {
+  public static getInstance(origin: string): MessageBus {
     if (!MessageBus.instance) {
-      MessageBus.instance = new MessageBus(origin)
+      MessageBus.instance = new MessageBus(origin);
     }
-    return MessageBus.instance
+    return MessageBus.instance;
   }
 
-  // Activer le mode mock
-  enableMockMode(): void {
-    this.isMockMode = true
-    console.log("🎭 Mock mode enabled")
-  }
-
-  // Désactiver le mode mock
-  disableMockMode(): void {
-    this.isMockMode = false
-    this.mockService.disconnect()
-    console.log("🎭 Mock mode disabled")
-  }
-
-  isInMockMode(): boolean {
-    return this.isMockMode
-  }
-
-  private getOriginFromUrl(url: string): string {
-    try {
-      const urlObj = new URL(url)
-      return `${urlObj.protocol}//${urlObj.host}`
-    } catch (error) {
-      console.error("Invalid URL:", url)
-      return url
-    }
-  }
-
-  private sendMessage(type: string, data: any = {}, timeoutMs = 30000): Promise<any> {
-    // Si en mode mock, utiliser le service mock
-    if (this.isMockMode) {
-      return this.handleMockMessage(type, data)
+  public isReady(): Promise<void> {
+    if (this.isReadyFlag) {
+      return Promise.resolve();
     }
 
-    return new Promise((resolve, reject) => {
-      const messageId = uuidv4()
-      const iframe = IframeReference.getIframe()
+    if (this.readyPromise) {
+      return this.readyPromise;
+    }
 
-      if (!iframe || !iframe.contentWindow) {
-        reject(new Error("Iframe not available"))
-        return
+    this.readyPromise = new Promise<void>((resolve) => {
+      const correlationId = uuidv4();
+      this.initMessageListener(correlationId);
+
+      const unsubscribe = EventBus.getInstance().on('IS_READY', (responseId: string) => {
+        if (responseId !== correlationId) return;
+        unsubscribe();
+        this.destroyMessageListener();
+        this.isReadyFlag = true;
+        resolve();
+      });
+    });
+
+    return this.readyPromise;
+  }
+
+  public requestLink(): Promise<void> {
+    return new Promise<void>((resolve: () => void, reject: (error: string) => void) => {
+      const correlationId = uuidv4();
+      this.initMessageListener(correlationId);
+
+      const unsubscribe = EventBus.getInstance().on('LINK_ACCEPTED', (responseId: string, accessToken: string, refreshToken: string) => {
+        if (responseId !== correlationId) {
+          return;
+        }
+        unsubscribe();
+        this.destroyMessageListener();
+        UserStore.getInstance().connect(accessToken, refreshToken);
+        resolve();
+      });
+
+      const unsubscribeError = EventBus.getInstance().on('ERROR_LINK_ACCEPTED', (responseId: string, error: string) => {
+        if (responseId !== correlationId) {
+          return;
+        }
+        unsubscribeError();
+        this.destroyMessageListener();
+        reject(error);
+      });
+
+      this.sendMessage({
+        type: 'REQUEST_LINK'
+      });
+    });
+  }
+
+  public getUserPairingId(): Promise<string> {
+    return new Promise<string>((resolve: (userPairingId: string) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PAIRING_ID', (responseId: string, userPairingId: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(userPairingId);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PAIRING_ID', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'GET_PAIRING_ID',
+          accessToken,
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public validateToken(): Promise<boolean> {
+    return new Promise<boolean>((resolve: (isValid: boolean) => void, reject: (error: string) => void) => {
+      const userStore = UserStore.getInstance();
+      if (!userStore.isConnected()) {
+        reject('User is not connected');
+        return;
       }
+      const accessToken = userStore.getAccessToken()!;
+      const refreshToken = userStore.getRefreshToken()!;
 
-      const targetOrigin = this.getOriginFromUrl(this.origin)
+      const correlationId = uuidv4();
+      this.initMessageListener(correlationId);
 
-      // Construire le message selon le protocole 4NK
-      const message: any = {
-        type,
-        messageId,
-        timestamp: Date.now(),
-        ...data,
+      const unsubscribe = EventBus.getInstance().on('TOKEN_VALIDATED', (responseId: string, isValid: boolean) => {
+        if (responseId !== correlationId) {
+          return;
+        }
+        unsubscribe();
+        this.destroyMessageListener();
+        resolve(isValid);
+      });
+
+      const unsubscribeError = EventBus.getInstance().on('ERROR_TOKEN_VALIDATED', (responseId: string, error: string) => {
+        if (responseId !== correlationId) {
+          return;
+        }
+        unsubscribeError();
+        this.destroyMessageListener();
+        reject(error);
+      });
+
+      this.sendMessage({
+        type: 'VALIDATE_TOKEN',
+        accessToken,
+        refreshToken
+      });
+    });
+  }
+
+  public renewToken(): Promise<void> {
+    return new Promise<void>((resolve: () => void, reject: (error: string) => void) => {
+      const userStore = UserStore.getInstance();
+      if (!userStore.isConnected()) {
+        reject('User is not connected');
+        return;
       }
+      const refreshToken = userStore.getRefreshToken()!;
 
-      // Ajouter l'accessToken pour tous les messages sauf REQUEST_LINK
-      if (type !== "REQUEST_LINK") {
-        const accessToken = this.userStore.getAccessToken()
-        if (accessToken) {
-          message.accessToken = accessToken
+      const correlationId = uuidv4();
+      this.initMessageListener(correlationId);
+
+      const unsubscribe = EventBus.getInstance().on('TOKEN_RENEWED', (responseId: string, accessToken: string, refreshToken: string) => {
+        if (responseId !== correlationId) {
+          return;
         }
-      }
+        unsubscribe();
+        this.destroyMessageListener();
+        UserStore.getInstance().connect(accessToken, refreshToken);
+        resolve();
+      });
 
-      console.log(`📤 Sending message ${type} to origin:`, targetOrigin)
-      console.log(`📤 Message data:`, {
-        type,
-        messageId,
-        hasAccessToken: !!message.accessToken,
-      })
-
-      const cleanup = this.initMessageListener(messageId, resolve, reject, timeoutMs)
-
-      // Essayer d'envoyer le message avec plusieurs stratégies
-      const sendStrategies = [
-        () => iframe.contentWindow!.postMessage(message, targetOrigin),
-        () => iframe.contentWindow!.postMessage(message, "*"),
-      ]
-
-      let strategyIndex = 0
-      const trySend = () => {
-        if (strategyIndex >= sendStrategies.length) {
-          cleanup()
-          reject(new Error("Impossible d'envoyer le message après plusieurs tentatives"))
-          return
+      const unsubscribeError = EventBus.getInstance().on('ERROR_TOKEN_RENEWED', (responseId: string, error: string) => {
+        if (responseId !== correlationId) {
+          return;
         }
+        unsubscribeError();
+        this.destroyMessageListener();
+        reject(error);
+      });
 
-        try {
-          sendStrategies[strategyIndex]()
-          console.log(`✅ Message sent with strategy ${strategyIndex + 1}`)
-        } catch (error) {
-          console.error(`❌ Strategy ${strategyIndex + 1} failed:`, error)
-          strategyIndex++
-          setTimeout(trySend, 500)
+      this.sendMessage({
+        type: 'RENEW_TOKEN',
+        refreshToken
+      });
+    });
+  }
+
+  public getProcesses(): Promise<any> {
+    return new Promise<any>((resolve: (processes: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        console.log(correlationId);
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PROCESSES_RETRIEVED', (responseId: string, processes: any) => {
+          console.log(responseId);
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(processes);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PROCESSES_RETRIEVED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'GET_PROCESSES',
+          accessToken,
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public getMyProcesses(): Promise<string[]> {
+    return new Promise<string[]>((resolve: (myProcesses: string[]) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('GET_MY_PROCESSES', (responseId: string, myProcesses: string[]) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(myProcesses);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_GET_MY_PROCESSES', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'GET_MY_PROCESSES',
+          accessToken,
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public getData(processId: string, stateId: string): Promise<Record<string, any>> {
+    return new Promise<Record<string, any>>((resolve: (data: Record<string, any>) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('DATA_RETRIEVED', (responseId: string, data: Record<string, any>) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(data);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_DATA_RETRIEVED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'RETRIEVE_DATA',
+          processId,
+          stateId,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public getPublicData(encodedData: number[]): Promise<any> {
+    return new Promise<any>((resolve: (data: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PUBLIC_DATA_DECODED', (responseId: string, data: any) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(data);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PUBLIC_DATA_DECODED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'DECODE_PUBLIC_DATA',
+          encodedData,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public createProfile(profileData: any, profilePrivateData: string[], roles: any): Promise<any> {
+    return new Promise<any>((resolve: (profileCreated: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PROCESS_CREATED', (responseId: string, processCreated: any) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          // Return value must contain the data commited in the new process
+          const profileData = processCreated.processData;
+          if (!profileData) {
+            reject('Returned invalid profile data');
+          }
+          if (!processCreated.processId || typeof processCreated.processId !== 'string') {
+            console.error('Returned invalid process id');
+            reject('Returned invalid process id');
+          }
+          // TODO check that process is of type Process
+
+          const profileCreated = {
+            processId: processCreated.processId,
+            process: processCreated.process,
+            profileData
+          };
+
+          resolve(profileCreated);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PROCESS_CREATED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'CREATE_PROCESS',
+          processData: profileData,
+          privateFields: profilePrivateData,
+          roles,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public createFolder(folderData: any, folderPrivateData: string[], roles: any): Promise<any> {
+    return new Promise<any>((resolve: (folderData: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PROCESS_CREATED', (responseId: string, processCreated: any) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          // Return value must contain the data commited in the new process
+          const folderData = processCreated.processData;
+          if (!folderData) reject('Returned invalid process data');
+          if (!processCreated.processId || typeof processCreated.processId !== 'string') reject('Returned invalid process id');
+          // TODO check that process is of type Process
+
+          const folderCreated = {
+            processId: processCreated.processId,
+            process: processCreated.process,
+            folderData
+          };
+
+          resolve(folderCreated);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PROCESS_CREATED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'CREATE_PROCESS',
+          processData: folderData,
+          privateFields: folderPrivateData,
+          roles,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public updateProcess(processId: string, lastStateId: string, newData: Record<string, any>, privateFields: string[], roles: any | null): Promise<any> {
+    return new Promise<any>((resolve: (updatedProcess: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('PROCESS_UPDATED', (responseId: string, updatedProcess: any) => {
+          console.log('PROCESS_UPDATED', updatedProcess);
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(updatedProcess);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_PROCESS_UPDATED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'UPDATE_PROCESS',
+          processId,
+          lastStateId,
+          newData,
+          privateFields,
+          roles,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public notifyProcessUpdate(processId: string, stateId: string): Promise<void> {
+    return new Promise<void>((resolve: () => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('UPDATE_NOTIFIED', (responseId: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve();
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_UPDATE_NOTIFIED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'NOTIFY_UPDATE',
+          processId,
+          stateId,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  public validateState(processId: string, stateId: string): Promise<any> {
+    return new Promise<any>((resolve: (updatedProcess: any) => void, reject: (error: string) => void) => {
+      this.checkToken().then(() => {
+        const userStore = UserStore.getInstance();
+        const accessToken = userStore.getAccessToken()!;
+
+        const correlationId = uuidv4();
+        this.initMessageListener(correlationId);
+
+        const unsubscribe = EventBus.getInstance().on('STATE_VALIDATED', (responseId: string, updatedProcess: any) => {
+          console.log(updatedProcess);
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribe();
+          this.destroyMessageListener();
+          resolve(updatedProcess);
+        });
+
+        const unsubscribeError = EventBus.getInstance().on('ERROR_STATE_VALIDATED', (responseId: string, error: string) => {
+          if (responseId !== correlationId) {
+            return;
+          }
+          unsubscribeError();
+          this.destroyMessageListener();
+          reject(error);
+        });
+
+        this.sendMessage({
+          type: 'VALIDATE_STATE',
+          processId,
+          stateId,
+          accessToken
+        });
+      }).catch(console.error);
+    });
+  }
+
+  private checkToken(): Promise<void> {
+    return new Promise<void>((resolve: () => void, reject: (error: string) => void) => {
+      this.validateToken().then((isValid: boolean) => {
+        if (!isValid) {
+          this.renewToken().then(resolve).catch(reject);
+        } else {
+          resolve();
         }
-      }
-
-      trySend()
-    })
+      }).catch(reject);
+    });
   }
 
-  private async handleMockMessage(type: string, data: any): Promise<any> {
-    console.log(`🎭 Handling mock message: ${type}`)
+  private sendMessage(message: any): void {
+    const iframe = IframeReference.getIframe();
+    if (!iframe) {
+      console.error('[MessageBus] sendMessage: iframe not found');
+      return;
+    }
+    console.log('[MessageBus] sendMessage:', message);
+    iframe.contentWindow?.postMessage(message, this.origin);
+  }
 
-    switch (type) {
-      case "REQUEST_LINK":
-        const tokens = await this.mockService.mockRequestLink()
-        return {
-          type: "LINK_ACCEPTED",
-          accessToken: tokens.accessToken,
-          refreshToken: tokens.refreshToken,
+  private initMessageListener(correlationId: string): void {
+    this.destroyMessageListener();
+
+    this.messageListener = this.handleMessage.bind(this, correlationId);
+    window.addEventListener('message', this.messageListener);
+  }
+
+  private destroyMessageListener(): void {
+    if (this.messageListener) {
+      window.removeEventListener('message', this.messageListener);
+      this.messageListener = null;
+    }
+  }
+
+  private handleMessage(correlationId: string, event: MessageEvent): void {
+    if (event.origin !== this.origin) {
+      return;
+    }
+
+    if (!event.data || typeof event.data !== 'object') {
+      return;
+    }
+
+    const message = event.data;
+    switch (message.type) {
+      case 'LISTENING':
+        EventBus.getInstance().emit('IS_READY', correlationId);
+        break;
+
+      case 'LINK_ACCEPTED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_LINK_ACCEPTED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('LINK_ACCEPTED', correlationId, message.accessToken, message.refreshToken);
+        break;
 
-      case "GET_PAIRING_ID":
-        const pairingId = await this.mockService.mockGetUserPairingId()
-        return {
-          type: "GET_PAIRING_ID",
-          userPairingId: pairingId,
+      case 'VALIDATE_TOKEN':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_TOKEN_VALIDATED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('TOKEN_VALIDATED', correlationId, message.isValid);
+        break;
 
-      case "GET_PROCESSES":
-        const processes = await this.mockService.mockGetProcesses()
-        return {
-          type: "PROCESSES_RETRIEVED",
-          processes,
+      case 'RENEW_TOKEN':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_TOKEN_RENEWED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('TOKEN_RENEWED', correlationId, message.accessToken, message.refreshToken);
+        break;
 
-      case "GET_MY_PROCESSES":
-        const myProcesses = await this.mockService.mockGetMyProcesses()
-        return {
-          type: "GET_MY_PROCESSES",
-          myProcesses,
+      case 'GET_PAIRING_ID':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_PAIRING_ID', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('PAIRING_ID', correlationId, message.userPairingId);
+        break;
 
-      case "RETRIEVE_DATA":
-        const processData = await this.mockService.mockGetData(data.processId, data.stateId)
-        return {
-          type: "DATA_RETRIEVED",
-          data: processData,
+      case 'PROCESSES_RETRIEVED': // GET_PROCESSES
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_PROCESSES_RETRIEVED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('PROCESSES_RETRIEVED', correlationId, message.processes);
+        break;
 
-      case "CREATE_PROCESS":
-        const created = await this.mockService.mockCreateProcess(data.processData, data.privateFields, data.roles)
-        return {
-          type: "PROCESS_CREATED",
-          processCreated: created,
+      case 'GET_MY_PROCESSES': 
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_GET_MY_PROCESSES', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('GET_MY_PROCESSES', correlationId, message.myProcesses);
+        break;
 
-      case "NOTIFY_UPDATE":
-        await this.mockService.mockNotifyProcessUpdate(data.processId, data.stateId)
-        return {
-          type: "UPDATE_NOTIFIED",
+      case 'DATA_RETRIEVED': // RETRIEVE_DATA
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_DATA_RETRIEVED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('DATA_RETRIEVED', correlationId, message.data);
+        break;
 
-      case "VALIDATE_STATE":
-        const validated = await this.mockService.mockValidateState(data.processId, data.stateId)
-        return {
-          type: "STATE_VALIDATED",
-          validatedProcess: validated,
+      case 'PROCESS_CREATED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_PROCESS_CREATED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('PROCESS_CREATED', correlationId, message.processCreated);
+        break;
 
-      case "VALIDATE_TOKEN":
-        const isValid = await this.mockService.mockValidateToken()
-        return {
-          type: "VALIDATE_TOKEN",
-          isValid,
+      case 'UPDATE_NOTIFIED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_UPDATE_NOTIFIED', correlationId, error);
+          return;
         }
-
-      case "RENEW_TOKEN":
-        const newTokens = await this.mockService.mockRenewToken()
-        return {
-          type: "RENEW_TOKEN",
-          accessToken: newTokens.accessToken,
-          refreshToken: newTokens.refreshToken,
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('UPDATE_NOTIFIED', correlationId);
+        break;
+        
+      case 'STATE_VALIDATED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_STATE_VALIDATED', correlationId, error);
+          return;
         }
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('STATE_VALIDATED', correlationId, message.validatedProcess);
+        break;
 
-      default:
-        throw new Error(`Mock message type not implemented: ${type}`)
-    }
-  }
-
-  private initMessageListener(messageId: string, resolve: Function, reject: Function, timeoutMs: number): () => void {
-    const timeout = setTimeout(() => {
-      cleanup()
-      reject(new Error(`Timeout: Aucune réponse après ${timeoutMs / 1000} secondes`))
-    }, timeoutMs)
-
-    const handleMessage = (event: MessageEvent) => {
-      console.log(
-        "📥 Received message from:",
-        event.origin,
-        "Type:",
-        event.data.type,
-        "MessageId:",
-        event.data.messageId,
-      )
-
-      // Accepter les messages de domaines 4NK ou localhost
-      const is4NKOrigin =
-        event.origin.includes("4nk") ||
-        event.origin.includes("localhost") ||
-        event.origin.includes("127.0.0.1") ||
-        event.origin === "null" // Pour les iframes en mode file://
-
-      if (!is4NKOrigin) {
-        console.log("🚫 Message ignored - not from 4NK origin:", event.origin)
-        return
-      }
-
-      if (event.data.messageId !== messageId) {
-        console.log("🚫 Message ignored - messageId mismatch")
-        return
-      }
-
-      cleanup()
-
-      // Gérer les erreurs selon le protocole 4NK
-      if (event.data.type === "ERROR") {
-        console.error("❌ Received error:", event.data.error)
-        reject(new Error(event.data.error || "Unknown error"))
-      } else {
-        console.log("✅ Message processed successfully:", event.data.type)
-        resolve(event.data)
-      }
-    }
-
-    const cleanup = () => {
-      clearTimeout(timeout)
-      window.removeEventListener("message", handleMessage)
-    }
-
-    window.addEventListener("message", handleMessage)
-    return cleanup
-  }
-
-  // Méthodes d'authentification
-  async isReady(): Promise<void> {
-    if (this.isMockMode) {
-      console.log("🎭 Mock mode - iframe ready")
-      return Promise.resolve()
-    }
-
-    return new Promise((resolve, reject) => {
-      const iframe = IframeReference.getIframe()
-
-      if (!iframe || !iframe.contentWindow) {
-        reject(new Error("Iframe not available"))
-        return
-      }
-
-      const targetOrigin = this.getOriginFromUrl(this.origin)
-      console.log("🔍 Waiting for LISTENING message from iframe...")
-
-      // Timeout de 45 secondes pour isReady
-      const timeout = setTimeout(() => {
-        cleanup()
-        reject(new Error("Timeout: L'iframe 4NK n'a pas envoyé le message LISTENING après 45 secondes."))
-      }, 45000)
-
-      const cleanup = () => {
-        clearTimeout(timeout)
-        window.removeEventListener("message", handleMessage)
-      }
-
-      const handleMessage = (event: MessageEvent) => {
-        console.log("📥 Ready check - received from:", event.origin, "Type:", event.data.type)
-
-        // Accepter les messages de domaines 4NK
-        const is4NKOrigin =
-          event.origin.includes("4nk") ||
-          event.origin.includes("localhost") ||
-          event.origin.includes("127.0.0.1") ||
-          event.origin === "null"
-
-        if (!is4NKOrigin) {
-          console.log("🚫 Ready check ignored - not from 4NK origin")
-          return
+      case 'PROCESS_UPDATED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_PROCESS_UPDATED', correlationId, error);
+          return;
         }
+        console.log('PROCESS_UPDATED', message);
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('PROCESS_UPDATED', correlationId, message.updatedProcess);
+        break;
 
-        if (event.data.type === "LISTENING") {
-          console.log("✅ Iframe is ready and listening!")
-          cleanup()
-          resolve()
+      case 'PUBLIC_DATA_DECODED':
+        if (this.errors[correlationId]) {
+          const error = this.errors[correlationId];
+          delete this.errors[correlationId];
+          EventBus.getInstance().emit('ERROR_PUBLIC_DATA_DECODED', correlationId, error);
+          return;
         }
-      }
-
-      window.addEventListener("message", handleMessage)
-    })
-  }
-
-  async requestLink(): Promise<void> {
-    console.log("🔐 Requesting authentication link...")
-
-    const response = await this.sendMessage("REQUEST_LINK", {}, 60000)
-
-    console.log("📥 Received response:", response)
-
-    if (response.type === "LINK_ACCEPTED") {
-      console.log("✅ Authentication link accepted")
-
-      // Vérifier que nous avons bien reçu les tokens
-      if (!response.accessToken || !response.refreshToken) {
-        throw new Error("Tokens manquants dans la réponse LINK_ACCEPTED")
-      }
-
-      // Stocker les tokens en sessionStorage selon le protocole
-      this.userStore.connect(response.accessToken, response.refreshToken)
-
-      console.log("💾 Tokens stored in sessionStorage")
-    } else {
-      console.error("❌ Authentication failed:", response)
-      throw new Error(`Authentication failed: expected LINK_ACCEPTED, got ${response.type}`)
+        EventBus.getInstance().emit('MESSAGE_RECEIVED', message);
+        EventBus.getInstance().emit('PUBLIC_DATA_DECODED', correlationId, message.decodedData);
+        break;
+        
+      case 'ERROR':
+        console.error('Error:', message);
+        this.errors[correlationId] = message.error;
+        break;
     }
   }
-
-  async getUserPairingId(): Promise<string> {
-    console.log("🆔 Getting user pairing ID...")
-    const response = await this.sendMessage("GET_PAIRING_ID", {}, 30000)
-
-    if (response.type !== "GET_PAIRING_ID") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    const pairingId = response.userPairingId
-    this.userStore.pair(pairingId)
-    console.log("✅ User pairing ID retrieved:", pairingId?.slice(0, 8) + "...")
-    return pairingId
-  }
-
-  async validateToken(): Promise<boolean> {
-    try {
-      const response = await this.sendMessage(
-        "VALIDATE_TOKEN",
-        {
-          accessToken: this.userStore.getAccessToken(),
-          refreshToken: this.userStore.getRefreshToken(),
-        },
-        15000,
-      )
-
-      return response.isValid === true
-    } catch {
-      return false
-    }
-  }
-
-  async renewToken(): Promise<void> {
-    const response = await this.sendMessage(
-      "RENEW_TOKEN",
-      {
-        refreshToken: this.userStore.getRefreshToken(),
-      },
-      30000,
-    )
-
-    if (response.type === "RENEW_TOKEN") {
-      this.userStore.connect(response.accessToken, response.refreshToken)
-    } else {
-      throw new Error("Failed to renew token")
-    }
-  }
-
-  // Méthodes de gestion des process
-  async getProcesses(): Promise<any> {
-    const response = await this.sendMessage("GET_PROCESSES", {}, 20000)
-
-    if (response.type !== "PROCESSES_RETRIEVED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.processes
-  }
-
-  async getMyProcesses(): Promise<string[]> {
-    const response = await this.sendMessage("GET_MY_PROCESSES", {}, 20000)
-
-    if (response.type !== "GET_MY_PROCESSES") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.myProcesses || []
-  }
-
-  async getData(processId: string, stateId: string): Promise<Record<string, any>> {
-    const response = await this.sendMessage("RETRIEVE_DATA", { processId, stateId }, 20000)
-
-    if (response.type !== "DATA_RETRIEVED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.data
-  }
-
-  async createProfile(profileData: any, privateFields: string[], roles: any): Promise<any> {
-    const response = await this.sendMessage(
-      "CREATE_PROCESS",
-      {
-        processData: profileData,
-        privateFields,
-        roles,
-      },
-      30000,
-    )
-
-    if (response.type !== "PROCESS_CREATED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.processCreated
-  }
-
-  async createFolder(folderData: any, privateFields: string[], roles: any): Promise<any> {
-    const response = await this.sendMessage(
-      "CREATE_PROCESS",
-      {
-        processData: folderData,
-        privateFields,
-        roles,
-      },
-      30000,
-    )
-
-    if (response.type !== "PROCESS_CREATED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.processCreated
-  }
-
-  async updateProcess(
-    processId: string,
-    lastStateId: string,
-    newData: any,
-    privateFields: string[],
-    roles: any,
-  ): Promise<any> {
-    const response = await this.sendMessage(
-      "UPDATE_PROCESS",
-      {
-        processId,
-        newData,
-        privateFields,
-        roles,
-      },
-      30000,
-    )
-
-    if (response.type !== "PROCESS_UPDATED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.updatedProcess
-  }
-
-  async notifyProcessUpdate(processId: string, stateId: string): Promise<void> {
-    const response = await this.sendMessage("NOTIFY_UPDATE", { processId, stateId }, 15000)
-
-    if (response.type !== "UPDATE_NOTIFIED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-  }
-
-  async validateState(processId: string, stateId: string): Promise<any> {
-    const response = await this.sendMessage("VALIDATE_STATE", { processId, stateId }, 20000)
-
-    if (response.type !== "STATE_VALIDATED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.validatedProcess
-  }
-
-  // Méthodes utilitaires supplémentaires
-  async decodePublicData(encodedData: number[]): Promise<any> {
-    const response = await this.sendMessage("DECODE_PUBLIC_DATA", { encodedData }, 15000)
-
-    if (response.type !== "PUBLIC_DATA_DECODED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.decodedData
-  }
-
-  async hashValue(commitedIn: string, label: string, fileBlob: any): Promise<string> {
-    const response = await this.sendMessage("HASH_VALUE", { commitedIn, label, fileBlob }, 15000)
-
-    if (response.type !== "VALUE_HASHED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.hash
-  }
-
-  async getMerkleProof(processState: any, attributeName: string): Promise<any> {
-    const response = await this.sendMessage("GET_MERKLE_PROOF", { processState, attributeName }, 15000)
-
-    if (response.type !== "MERKLE_PROOF_RETRIEVED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.proof
-  }
-
-  async validateMerkleProof(merkleProof: string, documentHash: string): Promise<boolean> {
-    const response = await this.sendMessage("VALIDATE_MERKLE_PROOF", { merkleProof, documentHash }, 15000)
-
-    if (response.type !== "MERKLE_PROOF_VALIDATED") {
-      throw new Error(`Unexpected response type: ${response.type}`)
-    }
-
-    return response.isValid
-  }
-
-  // Méthodes spécifiques au mock
-  getMockStats() {
-    if (this.isMockMode) {
-      return this.mockService.getMockStats()
-    }
-    return null
-  }
-
-  getMockRecentActivity() {
-    if (this.isMockMode) {
-      return this.mockService.getMockRecentActivity()
-    }
-    return null
-  }
 }
diff --git a/lib/4nk/UserStore.ts b/lib/4nk/UserStore.ts
index 3efceb8..76136dd 100644
--- a/lib/4nk/UserStore.ts
+++ b/lib/4nk/UserStore.ts
@@ -1,59 +1,43 @@
-/**
- * UserStore - Singleton pour la gestion des tokens et identifiants utilisateur
- * Stockage en sessionStorage selon les spécifications 4NK
- */
-export class UserStore {
-  private static instance: UserStore | null = null
+export default class UserStore {
+  private static instance: UserStore;
 
-  private constructor() {}
+  private constructor() { }
 
-  static getInstance(): UserStore {
+  public static getInstance(): UserStore {
     if (!UserStore.instance) {
-      UserStore.instance = new UserStore()
+      UserStore.instance = new UserStore();
     }
-    return UserStore.instance
+    return UserStore.instance;
   }
 
-  connect(accessToken: string, refreshToken: string): void {
-    if (typeof window !== "undefined") {
-      sessionStorage.setItem("4nk_access_token", accessToken)
-      sessionStorage.setItem("4nk_refresh_token", refreshToken)
-    }
+  public connect(accessToken: string, refreshToken: string): void {
+    sessionStorage.setItem('accessToken', accessToken);
+    sessionStorage.setItem('refreshToken', refreshToken);
   }
 
-  isConnected(): boolean {
-    if (typeof window === "undefined") return false
-    const accessToken = sessionStorage.getItem("4nk_access_token")
-    const refreshToken = sessionStorage.getItem("4nk_refresh_token")
-    return !!(accessToken && refreshToken)
+  public isConnected(): boolean {
+    return sessionStorage.getItem('accessToken') !== null && sessionStorage.getItem('refreshToken') !== null;
   }
 
-  disconnect(): void {
-    if (typeof window !== "undefined") {
-      sessionStorage.removeItem("4nk_access_token")
-      sessionStorage.removeItem("4nk_refresh_token")
-      sessionStorage.removeItem("4nk_user_pairing_id")
-    }
+  public disconnect(): void {
+    sessionStorage.removeItem('accessToken');
+    sessionStorage.removeItem('refreshToken');
+    sessionStorage.removeItem('userPairingId');
   }
 
-  getAccessToken(): string | null {
-    if (typeof window === "undefined") return null
-    return sessionStorage.getItem("4nk_access_token")
+  public getAccessToken(): string | null {
+    return sessionStorage.getItem('accessToken');
   }
 
-  getRefreshToken(): string | null {
-    if (typeof window === "undefined") return null
-    return sessionStorage.getItem("4nk_refresh_token")
+  public getRefreshToken(): string | null {
+    return sessionStorage.getItem('refreshToken');
   }
 
-  pair(userPairingId: string): void {
-    if (typeof window !== "undefined") {
-      sessionStorage.setItem("4nk_user_pairing_id", userPairingId)
-    }
+  public pair(userPairingId: string): void {
+    sessionStorage.setItem('userPairingId', userPairingId);
   }
 
-  getUserPairingId(): string | null {
-    if (typeof window === "undefined") return null
-    return sessionStorage.getItem("4nk_user_pairing_id")
+  public getUserPairingId(): string | null {
+    return sessionStorage.getItem('userPairingId');
   }
 }