@openzeppelin/ui-builder-adapter-evm 1.2.0 → 1.4.0

package/src/utils/__tests__/artifacts.test.ts

@@ -1,81 +0,0 @@
-/**
- * Unit tests for EVM contract artifacts utility functions
- */
-import { describe, expect, it } from 'vitest';
-
-import { validateAndConvertEvmArtifacts } from '../artifacts';
-
-describe('validateAndConvertEvmArtifacts', () => {
-  it('should convert string address to artifacts object', () => {
-    const address = '0x1234567890123456789012345678901234567890';
-
-    const result = validateAndConvertEvmArtifacts(address);
-
-    expect(result).toEqual({
-      contractAddress: address,
-    });
-  });
-
-  it('should return valid artifacts object as-is', () => {
-    const artifacts = {
-      contractAddress: '0x1234567890123456789012345678901234567890',
-      contractDefinition: '[{"type":"function","name":"test"}]',
-    };
-
-    const result = validateAndConvertEvmArtifacts(artifacts);
-
-    expect(result).toBe(artifacts);
-  });
-
-  it('should return artifacts with proxy detection options', () => {
-    const artifacts = {
-      contractAddress: '0x1234567890123456789012345678901234567890',
-      __proxyDetectionOptions: {
-        skipProxyDetection: true,
-      },
-    };
-
-    const result = validateAndConvertEvmArtifacts(artifacts);
-
-    expect(result).toBe(artifacts);
-  });
-
-  it('should throw error for invalid artifacts object', () => {
-    const invalidArtifacts = {
-      someOtherProperty: 'value',
-    };
-
-    expect(() => validateAndConvertEvmArtifacts(invalidArtifacts)).toThrow(
-      'Invalid contract artifacts provided. Expected an object with contractAddress property.'
-    );
-  });
-
-  it('should throw error for artifacts with non-string contractAddress', () => {
-    const invalidArtifacts = {
-      contractAddress: 123,
-    };
-
-    expect(() => validateAndConvertEvmArtifacts(invalidArtifacts)).toThrow(
-      'Invalid contract artifacts provided. Expected an object with contractAddress property.'
-    );
-  });
-
-  it('should accept artifacts with extra properties', () => {
-    const artifacts = {
-      contractAddress: '0x1234567890123456789012345678901234567890',
-      extraProperty: 'should be ignored',
-    };
-
-    const result = validateAndConvertEvmArtifacts(artifacts);
-
-    expect(result).toEqual(artifacts);
-  });
-
-  it('should handle empty string address', () => {
-    const result = validateAndConvertEvmArtifacts('');
-
-    expect(result).toEqual({
-      contractAddress: '',
-    });
-  });
-});

package/src/utils/artifacts.ts

@@ -1,30 +0,0 @@
-/**
- * Utility functions for EVM contract artifacts validation and conversion
- */
-import type { EvmContractArtifacts } from '../types/artifacts';
-import { isEvmContractArtifacts } from '../types/artifacts';
-
-/**
- * Validates and converts generic source input to EvmContractArtifacts
- *
- * @param source - Generic contract source (string address or artifacts object)
- * @returns Validated EvmContractArtifacts
- * @throws Error if the source is invalid
- */
-export function validateAndConvertEvmArtifacts(
-  source: string | Record<string, unknown>
-): EvmContractArtifacts {
-  if (typeof source === 'string') {
-    // If source is a string, assume it's a contract address
-    return { contractAddress: source };
-  }
-
-  // Validate that the object has the required structure
-  if (!isEvmContractArtifacts(source)) {
-    throw new Error(
-      'Invalid contract artifacts provided. Expected an object with contractAddress property.'
-    );
-  }
-
-  return source;
-}

package/src/utils/formatting.ts

@@ -1,25 +0,0 @@
-/**
- * Format a method name for display (e.g., from camelCase to Title Case).
- */
-export function formatMethodName(name: string): string {
-  if (!name) return '';
-  return name
-    .replace(/([A-Z])/g, ' $1')
-    .replace(/^./, (str) => str.toUpperCase())
-    .trim();
-}
-
-/**
- * Format an input name for display (e.g., from camelCase or snake_case to Title Case).
- * Provides a default name based on type if the original name is empty.
- */
-export function formatInputName(name: string, type: string): string {
-  if (!name || name === '') {
-    return `Parameter (${type})`; // Use type if name is missing
-  }
-  return name
-    .replace(/([A-Z])/g, ' $1') // Add space before capitals
-    .replace(/_/g, ' ') // Replace underscores with spaces
-    .replace(/^./, (str) => str.toUpperCase()) // Capitalize first letter
-    .trim();
-}

package/src/utils/gas.ts

@@ -1,17 +0,0 @@
-import { formatGwei, parseGwei } from 'viem';
-
-/**
- * Convert wei values to gwei for display using viem
- */
-export const weiToGwei = (wei?: number): number | undefined => {
-  if (!wei) return undefined;
-  return parseFloat(formatGwei(BigInt(wei)));
-};
-
-/**
- * Convert gwei values to wei using viem
- */
-export const gweiToWei = (gwei?: number): number | undefined => {
-  if (!gwei) return undefined;
-  return Number(parseGwei(gwei.toString()));
-};

package/src/utils/index.ts

@@ -1,6 +0,0 @@
-// Barrel file for utils module
-export * from './artifacts';
-export * from './json';
-export * from './formatting';
-export * from './validation';
-export * from './gas';

package/src/utils/json.ts

@@ -1,19 +0,0 @@
-/**
- * Custom JSON stringifier that handles BigInt values by converting them to strings.
- * @param value The value to stringify.
- * @param space Adds indentation, white space, and line break characters to the return-value JSON text for readability.
- * @returns A JSON string representing the given value.
- */
-export function stringifyWithBigInt(value: unknown, space?: number | string): string {
-  const replacer = (_key: string, val: unknown) => {
-    // Check if the value is a BigInt
-    if (typeof val === 'bigint') {
-      // Convert BigInt to string
-      return val.toString();
-    }
-    // Return the value unchanged for other types
-    return val;
-  };
-
-  return JSON.stringify(value, replacer, space);
-}

package/src/utils/validation.ts

@@ -1,10 +0,0 @@
-import { isAddress } from 'viem';
-
-/**
- * Validates if a string is a valid EVM address.
- * @param address The address string to validate.
- * @returns True if the address is valid, false otherwise.
- */
-export function isValidEvmAddress(address: string): boolean {
-  return isAddress(address);
-}

package/src/validation/eoa.ts

@@ -1,33 +0,0 @@
-import { EoaExecutionConfig } from '@openzeppelin/ui-types';
-import { logger } from '@openzeppelin/ui-utils';
-
-import { isValidEvmAddress } from '../utils';
-import { EvmWalletConnectionStatus } from '../wallet/types';
-
-const SYSTEM_LOG_TAG = 'EoaValidator';
-
-export async function validateEoaConfig(
-  config: EoaExecutionConfig,
-  walletStatus: EvmWalletConnectionStatus
-): Promise<true | string> {
-  if (!config.allowAny) {
-    if (!config.specificAddress) {
-      return "EOA execution selected, but no specific address was provided when 'allowAny' is false.";
-    }
-    if (!isValidEvmAddress(config.specificAddress)) {
-      return `Invalid specific EOA address format: ${config.specificAddress}`;
-    }
-    if (walletStatus.isConnected && walletStatus.address) {
-      if (walletStatus.address.toLowerCase() !== config.specificAddress.toLowerCase()) {
-        return `Connected wallet address (${walletStatus.address}) does not match the required specific EOA address (${config.specificAddress}). Please connect the correct wallet.`;
-      }
-    } else if (walletStatus.isConnected && !walletStatus.address) {
-      logger.warn(
-        SYSTEM_LOG_TAG,
-        'Wallet is connected but address is unavailable for EOA validation.'
-      );
-      return 'Connected wallet address is not available for validation against specific EOA.';
-    }
-  }
-  return true;
-}

package/src/validation/index.ts

@@ -1,2 +0,0 @@
-export * from './eoa';
-export * from './relayer';

package/src/validation/relayer.ts

@@ -1,13 +0,0 @@
-import { RelayerExecutionConfig } from '@openzeppelin/ui-types';
-
-export async function validateRelayerConfig(
-  config: RelayerExecutionConfig
-): Promise<true | string> {
-  if (!config.serviceUrl) {
-    return 'Relayer execution selected, but no service URL was provided.';
-  }
-  if (!config.relayer?.relayerId) {
-    return 'Relayer execution selected, but no relayer was chosen from the list.';
-  }
-  return true;
-}

package/src/wallet/__tests__/utils.test.ts

@@ -1,149 +0,0 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-
-import { logger } from '@openzeppelin/ui-utils';
-
-import { resolveAndInitializeKitConfig } from '../utils';
-
-// Mock the logger to prevent console output during tests and allow spying
-vi.mock('@openzeppelin/ui-utils', () => ({
-  logger: {
-    debug: vi.fn(),
-    info: vi.fn(),
-    warn: vi.fn(),
-    error: vi.fn(),
-  },
-}));
-
-describe('resolveAndInitializeKitConfig', () => {
-  const mockLoadConfigModule = vi.fn();
-
-  beforeEach(() => {
-    // Reset mocks before each test
-    mockLoadConfigModule.mockReset();
-    vi.clearAllMocks();
-  });
-
-  it('should return null if no kitName, programmaticConfig, or loadConfigModule is provided', async () => {
-    const result = await resolveAndInitializeKitConfig(undefined, undefined, undefined);
-    expect(result).toBeNull();
-    expect(logger.debug).toHaveBeenCalledWith(
-      'resolveAndInitializeKitConfig',
-      'Resolving native config for kit: none',
-      { hasProgrammaticKitConfig: false, hasLoadConfigModule: false }
-    );
-    expect(logger.debug).toHaveBeenCalledWith(
-      'resolveAndInitializeKitConfig',
-      'No native or programmatic kitConfig provided for none. Returning null.'
-    );
-  });
-
-  it('should return programmaticKitConfig if kitName is provided but loadConfigModule is not', async () => {
-    const programmaticConfig = { settingA: 'valueA' };
-    const result = await resolveAndInitializeKitConfig('rainbowkit', programmaticConfig, undefined);
-    expect(result).toEqual(programmaticConfig);
-    expect(mockLoadConfigModule).not.toHaveBeenCalled();
-  });
-
-  it('should return null if kitName is provided, loadConfigModule is not, and no programmaticKitConfig', async () => {
-    const result = await resolveAndInitializeKitConfig('rainbowkit', undefined, undefined);
-    expect(result).toBeNull();
-  });
-
-  it('should not call loadConfigModule if kitName is "custom"', async () => {
-    const programmaticConfig = { settingB: 'valueB' };
-    const result = await resolveAndInitializeKitConfig(
-      'custom',
-      programmaticConfig,
-      mockLoadConfigModule
-    );
-    expect(result).toEqual(programmaticConfig);
-    expect(mockLoadConfigModule).not.toHaveBeenCalled();
-  });
-
-  it('should not call loadConfigModule if kitName is "none"', async () => {
-    const result = await resolveAndInitializeKitConfig('none', undefined, mockLoadConfigModule);
-    expect(result).toBeNull();
-    expect(mockLoadConfigModule).not.toHaveBeenCalled();
-  });
-
-  describe('with kitName and loadConfigModule provided', () => {
-    const kitName = 'rainbowkit';
-    const conventionalPath = `./config/wallet/${kitName}.config.ts`;
-
-    it('should return userNativeConfig if loadConfigModule succeeds and no programmaticConfig', async () => {
-      const nativeConfig = { nativeSetting: 'nativeValue' };
-      mockLoadConfigModule.mockResolvedValue(nativeConfig);
-      const result = await resolveAndInitializeKitConfig(kitName, undefined, mockLoadConfigModule);
-      expect(result).toEqual(nativeConfig);
-      expect(mockLoadConfigModule).toHaveBeenCalledWith(conventionalPath);
-    });
-
-    it('should merge userNativeConfig and programmaticKitConfig, with programmatic taking precedence', async () => {
-      const nativeConfig = { common: 'native', nativeOnly: 'present' };
-      const programmaticConfig = { common: 'programmatic', progOnly: 'here' };
-      mockLoadConfigModule.mockResolvedValue(nativeConfig);
-      const result = await resolveAndInitializeKitConfig(
-        kitName,
-        programmaticConfig,
-        mockLoadConfigModule
-      );
-      expect(result).toEqual({
-        common: 'programmatic',
-        nativeOnly: 'present',
-        progOnly: 'here',
-      });
-      expect(mockLoadConfigModule).toHaveBeenCalledWith(conventionalPath);
-    });
-
-    it('should return programmaticKitConfig if loadConfigModule returns null', async () => {
-      const programmaticConfig = { settingC: 'valueC' };
-      mockLoadConfigModule.mockResolvedValue(null);
-      const result = await resolveAndInitializeKitConfig(
-        kitName,
-        programmaticConfig,
-        mockLoadConfigModule
-      );
-      expect(result).toEqual(programmaticConfig);
-      expect(mockLoadConfigModule).toHaveBeenCalledWith(conventionalPath);
-    });
-
-    it('should return null if loadConfigModule returns null and no programmaticConfig', async () => {
-      mockLoadConfigModule.mockResolvedValue(null);
-      const result = await resolveAndInitializeKitConfig(kitName, undefined, mockLoadConfigModule);
-      expect(result).toBeNull();
-    });
-
-    it('should return programmaticKitConfig if loadConfigModule throws an error', async () => {
-      const programmaticConfig = { settingD: 'valueD' };
-      mockLoadConfigModule.mockImplementation(async () => {
-        throw new Error('File system error');
-      });
-
-      await expect(
-        resolveAndInitializeKitConfig(kitName, programmaticConfig, mockLoadConfigModule)
-      ).resolves.toEqual(programmaticConfig);
-
-      expect(mockLoadConfigModule).toHaveBeenCalledWith(conventionalPath);
-    });
-
-    it('should return null if loadConfigModule throws and no programmaticConfig', async () => {
-      mockLoadConfigModule.mockImplementation(async () => {
-        throw new Error('Another error');
-      });
-
-      await expect(
-        resolveAndInitializeKitConfig(kitName, undefined, mockLoadConfigModule)
-      ).resolves.toBeNull();
-
-      expect(mockLoadConfigModule).toHaveBeenCalledWith(conventionalPath);
-    });
-  });
-
-  it('should correctly use kitName in conventional path for loading', async () => {
-    const kitName = 'anotherkit';
-    const expectedPath = `./config/wallet/${kitName}.config.ts`;
-    mockLoadConfigModule.mockResolvedValue({ some: 'data' });
-    await resolveAndInitializeKitConfig(kitName, undefined, mockLoadConfigModule);
-    expect(mockLoadConfigModule).toHaveBeenCalledWith(expectedPath);
-  });
-});

package/src/wallet/components/account/AccountDisplay.tsx

@@ -1,52 +0,0 @@
-import { LogOut } from 'lucide-react';
-import React from 'react';
-
-import { Button } from '@openzeppelin/ui-components';
-import { useDerivedAccountStatus, useDerivedDisconnect } from '@openzeppelin/ui-react';
-import type { BaseComponentProps } from '@openzeppelin/ui-types';
-import { cn, truncateMiddle } from '@openzeppelin/ui-utils';
-
-import { SafeWagmiComponent } from '../../utils/SafeWagmiComponent';
-
-/**
- * A component that displays the connected account address and chain ID.
- * Also includes a disconnect button.
- */
-export const CustomAccountDisplay: React.FC<BaseComponentProps> = ({ className }) => {
-  // Use the SafeWagmiComponent with null fallback
-  return (
-    <SafeWagmiComponent fallback={null}>
-      <AccountDisplayContent className={className} />
-    </SafeWagmiComponent>
-  );
-};
-
-// Inner component that uses derived hooks
-const AccountDisplayContent: React.FC<{ className?: string }> = ({ className }) => {
-  const { isConnected, address, chainId } = useDerivedAccountStatus();
-  const { disconnect } = useDerivedDisconnect();
-
-  if (!isConnected || !address || !disconnect) {
-    return null;
-  }
-
-  return (
-    <div className={cn('flex items-center gap-2', className)}>
-      <div className="flex flex-col">
-        <span className="text-xs font-medium">{truncateMiddle(address, 4, 4)}</span>
-        <span className="text-[9px] text-muted-foreground -mt-0.5">
-          {chainId ? `Chain ID: ${chainId}` : 'Chain ID: N/A'}
-        </span>
-      </div>
-      <Button
-        onClick={() => disconnect()}
-        variant="ghost"
-        size="icon"
-        className="size-6 p-0"
-        title="Disconnect wallet"
-      >
-        <LogOut className="size-3.5" />
-      </Button>
-    </div>
-  );
-};

package/src/wallet/components/connect/ConnectButton.tsx

@@ -1,125 +0,0 @@
-import { Loader2, Wallet } from 'lucide-react';
-import React, { useEffect, useState } from 'react';
-
-import { Button } from '@openzeppelin/ui-components';
-import { useDerivedAccountStatus, useDerivedConnectStatus } from '@openzeppelin/ui-react';
-import type { BaseComponentProps } from '@openzeppelin/ui-types';
-import { cn } from '@openzeppelin/ui-utils';
-
-import { SafeWagmiComponent } from '../../utils/SafeWagmiComponent';
-import { ConnectorDialog } from './ConnectorDialog';
-
-/**
- * A button that allows users to connect their wallet.
- * Opens a dialog to select from available connectors.
- * @param hideWhenConnected - Whether to hide the button when wallet is connected (default: true)
- */
-export interface ConnectButtonProps extends BaseComponentProps {
-  hideWhenConnected?: boolean;
-}
-
-export const CustomConnectButton: React.FC<ConnectButtonProps> = ({
-  className,
-  hideWhenConnected = true,
-}) => {
-  const [dialogOpen, setDialogOpen] = useState(false);
-
-  const unavailableButton = (
-    <div className={cn('flex items-center', className)}>
-      <Button disabled={true} variant="outline" size="sm" className="h-8 px-2 text-xs">
-        <Wallet className="size-3.5 mr-1" />
-        Wallet Unavailable
-      </Button>
-    </div>
-  );
-
-  return (
-    <SafeWagmiComponent fallback={unavailableButton}>
-      <ConnectButtonContent
-        className={className}
-        dialogOpen={dialogOpen}
-        setDialogOpen={setDialogOpen}
-        hideWhenConnected={hideWhenConnected}
-      />
-    </SafeWagmiComponent>
-  );
-};
-
-const ConnectButtonContent: React.FC<{
-  className?: string;
-  dialogOpen: boolean;
-  setDialogOpen: (open: boolean) => void;
-  hideWhenConnected: boolean;
-}> = ({ className, dialogOpen, setDialogOpen, hideWhenConnected }) => {
-  const { isConnected } = useDerivedAccountStatus();
-  const { isConnecting: isHookConnecting, error: connectError } = useDerivedConnectStatus();
-
-  // Local state to indicate the button has been clicked and dialog is open, awaiting user selection
-  const [isManuallyInitiated, setIsManuallyInitiated] = useState(false);
-
-  useEffect(() => {
-    if (isConnected && hideWhenConnected) {
-      setDialogOpen(false);
-      setIsManuallyInitiated(false); // Reset if dialog closes due to connection
-    }
-  }, [isConnected, hideWhenConnected, setDialogOpen]);
-
-  // If dialog is closed, reset manual initiation state
-  useEffect(() => {
-    if (!dialogOpen) {
-      setIsManuallyInitiated(false);
-    }
-  }, [dialogOpen]);
-
-  // If wagmi hook reports it's connecting, we no longer need our manual pending state
-  useEffect(() => {
-    if (isHookConnecting) {
-      setIsManuallyInitiated(false);
-    }
-  }, [isHookConnecting]);
-
-  const handleConnectClick = () => {
-    if (!isConnected) {
-      setIsManuallyInitiated(true); // User clicked, show pending on button
-      setDialogOpen(true);
-    }
-  };
-
-  if (isConnected && hideWhenConnected) {
-    return null;
-  }
-
-  // Button shows loading if either hook reports connecting OR if user just clicked to open dialog
-  const showButtonLoading = isHookConnecting || isManuallyInitiated;
-
-  return (
-    <div className={cn('flex items-center', className)}>
-      <Button
-        onClick={handleConnectClick}
-        disabled={showButtonLoading || isConnected}
-        variant="outline"
-        size="sm"
-        className="h-8 px-2 text-xs"
-        title={isConnected ? 'Connected' : connectError?.message || 'Connect Wallet'}
-      >
-        {showButtonLoading ? (
-          <Loader2 className="size-3.5 animate-spin mr-1" />
-        ) : (
-          <Wallet className="size-3.5 mr-1" />
-        )}
-        {showButtonLoading ? 'Connecting...' : 'Connect Wallet'}
-      </Button>
-
-      <ConnectorDialog
-        open={dialogOpen}
-        onOpenChange={(open) => {
-          setDialogOpen(open);
-          // If dialog is closed manually by user before selection, reset manual initiation
-          if (!open) {
-            setIsManuallyInitiated(false);
-          }
-        }}
-      />
-    </div>
-  );
-};