encryption-service

Framework: react

🧩 Step 1: Create Encryption Initialization Component

First, create a provider-style component that initializes the encryption service once when the application loads.

📁 File: src/providers/EncryptionServiceProvider.tsx

tsx

"use client";

import React from "react";
import { CONFIG } from "@/config";
import { initEncryptionService } from "universe-code/react";

/**
 * Initializes the encryption service with a secret key.
 * This component does not render UI.
 */
const EncryptionServiceProvider = () => {
  initEncryptionService(CONFIG.secretKey); //your encryption key
  return null;
};

export default EncryptionServiceProvider;

🔍 What Does This Component Do?

Calls initEncryptionService() once
Registers the encryption secret key
Makes encryption available globally
Does not render any UI (logic-only component)
Must run on the client side ("use client")

⚠️ Important

The encryption key is set here
Without this component, encryption will not work
The same key is required for both encryption and decryption

🏗️ Step 2: Call the Provider in layout.tsx

Add the provider to the Root Layout so encryption is available throughout the app.

📁 File: src/app/layout.tsx

tsx

import EncryptionServiceProvider from "@/providers/EncryptionServiceProvider";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        {children}

        {/* Initialize encryption globally */}
        <EncryptionServiceProvider />
      </body>
    </html>
  );
}

✅ Why Use layout.tsx?

layout.tsx runs only once
Ensures encryption is ready before any component uses it
Prevents multiple initializations
Makes encryption available app-wide

🔑 Step 3: Use Encryption Anywhere in the App

Once initialized, encryption can be used in any component, hook, or service.

📥 Import the Encryption Service

import { encryptionService } from "universe-code/react";

🔑 Available Functions

1️⃣ Encrypt Data (High Security)

Use this for user data, credentials, sensitive information.

const data = { userId: 123, email: 'user@example.com' };
const encrypted = await encryptionService.encryption(data);

// Returns: { iv: "...", payload: "..." }

✅ Uses 100,000 iterations (more secure)

2️⃣ Decrypt Data (Matching encryption())

const encrypted = { iv: "...", payload: "..." };
const decrypted = await encryptionService.decryption(encrypted);

// Returns: { userId: 123, email: 'user@example.com' }

⚠️ Rule: encryption() → decryption()

3️⃣ Encrypt Data (Fast Mode)

Best for API responses or less sensitive data.

const data = { status: 'success', token: 'xyz789' };
const encrypted = await encryptionService.encryption1(data);

// Returns: { iv: "...", payload: "..." }

✅ Uses 50,000 iterations (faster)

4️⃣ Decrypt Data (Matching `encryption1()`)

const encrypted = { iv: "...", payload: "..." };
const decrypted = await encryptionService.decryption1(encrypted);

// Returns: { status: 'success', token: 'xyz789' }

⚠️ Rule: encryption1() → decryption1()

5️⃣ Decrypt API Response (`iv###payload` format)

Use this when API returns data in "iv###payload" format.

const apiResponse = "dGVzdGl2###ZW5jcnlwdGVkUGF5bG9hZA==";
const decrypted = await encryptionService.decrptApiResponse(apiResponse);

// Returns: decrypted object or null if format is invalid

📌 Returns

✅ Decrypted object (if format is valid)
❌ null (if format is invalid)

🧠 Which Method Should I Use?

Method	Use Case
`encryption()`	General data encryption (user data, sensitive info)
`decryption()`	Decrypt data encrypted with `encryption()`
`encryption1()`	API responses, faster encryption
`decryption1()`	Decrypt data encrypted with `encryption1()`
`decrptApiResponse()`	Decrypt API responses in `"iv###payload"` format

⭐ Key Points (Must Read)

encryption() uses 100,000 iterations (more secure)
encryption1() uses 50,000 iterations (faster)
Always use matching encrypt/decrypt pair
decrptApiResponse() only works with "iv###payload" format
Requires async/await or Promise handling