diff --git a/examples/keystore-management/src/app/page.tsx b/examples/keystore-management/src/app/page.tsx
index d4b743f..c9e49a2 100644
--- a/examples/keystore-management/src/app/page.tsx
+++ b/examples/keystore-management/src/app/page.tsx
@@ -2,6 +2,7 @@ import RLNMembershipRegistration from '../components/RLNMembershipRegistration';
import { WalletInfo } from '../components/WalletInfo';
import { RLNImplementationToggle } from '../components/RLNImplementationToggle';
import KeystoreManager from '../components/KeystoreManager';
+import { RLNInitButton } from '../components/RLNInitButton';
export default function Home() {
return (
@@ -14,7 +15,10 @@ export default function Home() {
{/* RLN Implementation Toggle */}
RLN Implementation
-
+
+
+
+
{/* Wallet Information Section */}
diff --git a/examples/keystore-management/src/components/RLNInitButton.tsx b/examples/keystore-management/src/components/RLNInitButton.tsx
new file mode 100644
index 0000000..4b0f3e9
--- /dev/null
+++ b/examples/keystore-management/src/components/RLNInitButton.tsx
@@ -0,0 +1,37 @@
+"use client";
+
+import React from 'react';
+import { useRLN } from '../contexts/rln';
+
+export function RLNInitButton() {
+ const { initializeRLN, isInitialized, isStarted, error } = useRLN();
+
+ const handleInitialize = async () => {
+ try {
+ await initializeRLN();
+ } catch (err) {
+ console.error('Error initializing RLN:', err);
+ }
+ };
+
+ return (
+
+
+ {error && (
+
+ {error}
+
+ )}
+
+ );
+}
\ No newline at end of file
diff --git a/examples/keystore-management/src/contexts/rln/RLNContext.tsx b/examples/keystore-management/src/contexts/rln/RLNContext.tsx
index 36ed21b..9dfefb0 100644
--- a/examples/keystore-management/src/contexts/rln/RLNContext.tsx
+++ b/examples/keystore-management/src/contexts/rln/RLNContext.tsx
@@ -1,6 +1,6 @@
"use client";
-import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
+import { createContext, useContext, useState, useEffect, ReactNode, useCallback } from 'react';
import { KeystoreEntity } from '@waku/rln';
import { createRLNImplementation, UnifiedRLNInstance } from './implementations';
import { useRLNImplementation } from './RLNImplementationContext';
@@ -8,7 +8,6 @@ import { ethers } from 'ethers';
import { useKeystore } from '../keystore';
import { ERC20_ABI, LINEA_SEPOLIA_CONFIG, ensureLineaSepoliaNetwork } from './utils/network';
-// Define the context type
interface RLNContextType {
rln: UnifiedRLNInstance | null;
isInitialized: boolean;
@@ -28,10 +27,8 @@ interface RLNContextType {
saveCredentialsToKeystore: (credentials: KeystoreEntity, password: string) => Promise;
}
-// Create the context
const RLNContext = createContext(undefined);
-// Create the provider component
export function RLNProvider({ children }: { children: ReactNode }) {
const { implementation } = useRLNImplementation();
const [rln, setRln] = useState(null);
@@ -96,7 +93,7 @@ export function RLNProvider({ children }: { children: ReactNode }) {
setError(null);
}, [implementation]);
- const initializeRLN = async () => {
+ const initializeRLN = useCallback(async () => {
console.log("InitializeRLN called. Connected:", isConnected, "Signer available:", !!signer);
try {
@@ -106,7 +103,6 @@ export function RLNProvider({ children }: { children: ReactNode }) {
console.log(`Creating RLN ${implementation} instance...`);
try {
- // Use our factory to create the appropriate implementation
const rlnInstance = await createRLNImplementation(implementation);
console.log("RLN instance created successfully:", !!rlnInstance);
@@ -122,7 +118,6 @@ export function RLNProvider({ children }: { children: ReactNode }) {
console.log("RLN instance already exists, skipping creation");
}
- // Start RLN if wallet is connected
if (isConnected && signer && rln && !isStarted) {
console.log("Starting RLN with signer...");
try {
@@ -156,7 +151,7 @@ export function RLNProvider({ children }: { children: ReactNode }) {
console.error('Error in initializeRLN:', err);
setError(err instanceof Error ? err.message : 'Failed to initialize RLN');
}
- };
+ }, [isConnected, signer, implementation, rln, isStarted]);
const getCurrentRateLimit = async (): Promise => {
try {
@@ -331,16 +326,6 @@ export function RLNProvider({ children }: { children: ReactNode }) {
}
};
- // Initialize RLN when wallet connects
- useEffect(() => {
- console.log("Wallet connection state changed:", { isConnected, hasSigner: !!signer });
-
- if (isConnected && signer) {
- console.log("Wallet connected, attempting to initialize RLN");
- initializeRLN();
- }
- }, [isConnected, signer]);
-
return (
void;
}
-// Create the context
const RLNImplementationContext = createContext(undefined);
-// Create the provider component
export function RLNImplementationProvider({ children }: { children: ReactNode }) {
const [implementation, setImplementation] = useState('standard');
@@ -25,7 +21,6 @@ export function RLNImplementationProvider({ children }: { children: ReactNode })
);
}
-// Create a hook to use the context
export function useRLNImplementation() {
const context = useContext(RLNImplementationContext);
if (context === undefined) {
diff --git a/examples/keystore-management/src/contexts/rln/implementations/factory.tsx b/examples/keystore-management/src/contexts/rln/implementations/factory.tsx
index 8c63f56..9423c59 100644
--- a/examples/keystore-management/src/contexts/rln/implementations/factory.tsx
+++ b/examples/keystore-management/src/contexts/rln/implementations/factory.tsx
@@ -3,7 +3,6 @@
import { createRLN, MembershipInfo, RLNLightInstance } from '@waku/rln';
import { ethers } from 'ethers';
-// Define a unified interface that both implementations must support
export interface UnifiedRLNInstance {
contract: {
address: string;
@@ -22,17 +21,13 @@ export interface UnifiedRLNInstance {
registerMembership: (idCommitment: string, rateLimit?: number) => Promise;
};
start: (options: { signer: ethers.Signer }) => Promise;
- // Both implementations use registerMembership but with different parameters
registerMembership: (options: { signature: string }) => Promise>;
}
-// Define a factory function that creates the appropriate RLN implementation
-export async function createRLNImplementation(type: 'standard' | 'light'): Promise {
+export async function createRLNImplementation(type: 'standard' | 'light' = 'light'): Promise {
if (type === 'standard') {
- // Create and return the standard RLN implementation
return await createRLN() as unknown as UnifiedRLNInstance;
} else {
- // Create and return the light RLN implementation
return new RLNLightInstance() as unknown as UnifiedRLNInstance;
}
}
\ No newline at end of file
diff --git a/examples/keystore-management/src/contexts/rln/implementations/standard.tsx b/examples/keystore-management/src/contexts/rln/implementations/standard.tsx
index a405c2b..b065f94 100644
--- a/examples/keystore-management/src/contexts/rln/implementations/standard.tsx
+++ b/examples/keystore-management/src/contexts/rln/implementations/standard.tsx
@@ -1,6 +1,6 @@
"use client";
-import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
+import { createContext, useContext, useState, ReactNode } from 'react';
import { createRLN, DecryptedCredentials, LINEA_CONTRACT, RLNInstance } from '@waku/rln';
import { useWallet } from '../../wallet';
import { ethers } from 'ethers';
@@ -187,15 +187,6 @@ export function RLNProvider({ children }: { children: ReactNode }) {
}
};
- // Initialize RLN when wallet connects
- useEffect(() => {
- console.log("Wallet connection state changed:", { isConnected, hasSigner: !!signer });
- if (isConnected && signer) {
- console.log("Wallet connected, attempting to initialize RLN");
- initializeRLN();
- }
- }, [isConnected, signer]);
-
return (