chore: deprecate code (#2312)

Author: abcrane123

packages/onchainkit/src/buy/components/BuyButton.tsx

@@ -77,7 +77,9 @@ export function BuyButton() {
   }, [statusName, isDropdownOpen]);
 
   if (!isDisabled && !address) {
-    return <ConnectWallet text="Buy" className="h-12 w-24 min-w-24" />;
+    return (
+      <ConnectWallet disconnectedLabel="Buy" className="h-12 w-24 min-w-24" />
+    );
   }
 
   return (

packages/onchainkit/src/core/types.ts

@@ -63,11 +63,6 @@ export type IsBaseOptions = {
   isMainnetOnly?: boolean;
 };
 
-/**
- * @deprecated Use IsBaseOptions instead
- */
-export type isBaseOptions = IsBaseOptions;
-
 /**
  * Note: exported as public Type
  */
@@ -78,11 +73,6 @@ export type IsEthereumOptions = {
   isMainnetOnly?: boolean;
 };
 
-/**
- * @deprecated Use IsEthereumOptions instead
- */
-export type isEthereumOptions = IsEthereumOptions;
-
 export type Mode = 'auto' | 'light' | 'dark';
 
 /**

packages/onchainkit/src/earn/components/DepositButton.tsx

@@ -67,7 +67,7 @@ export function DepositButton({ className }: DepositButtonReact) {
     return (
       <ConnectWallet
         className={cn('w-full', className)}
-        text="Connect to deposit"
+        disconnectedLabel="Connect to deposit"
       />
     );
   }

packages/onchainkit/src/earn/components/WithdrawButton.tsx

@@ -65,7 +65,7 @@ export function WithdrawButton({ className }: WithdrawButtonReact) {
     return (
       <ConnectWallet
         className={cn('w-full', className)}
-        text="Connect to withdraw"
+        disconnectedLabel="Connect to withdraw"
       />
     );
   }

packages/onchainkit/src/index.ts

@@ -14,8 +14,6 @@ export type {
   IsEthereumOptions,
   OnchainKitConfig,
   OnchainKitContextType,
-  isBaseOptions,
-  isEthereumOptions,
 } from './core/types';
 
 export type { OnchainKitProviderReact } from './types';

packages/onchainkit/src/nft/components/NFTCardDefault.test.tsx

@@ -26,10 +26,6 @@ describe('NFTCardDefault', () => {
       <NFTCardDefault contractAddress="0x123" tokenId="1" />,
     );
 
-    expect(getByTestId('nft-media')).toBeInTheDocument();
-    expect(getByTestId('nft-title')).toBeInTheDocument();
-    expect(getByTestId('nft-owner')).toBeInTheDocument();
-    expect(getByTestId('nft-last-sold-price')).toBeInTheDocument();
-    expect(getByTestId('nft-network')).toBeInTheDocument();
+    expect(getByTestId('nft-card')).toBeInTheDocument();
   });
 });

packages/onchainkit/src/nft/components/NFTCardDefault.tsx

@@ -1,13 +1,6 @@
 'use client';
 import type { NFTCardDefaultReact } from '@/nft/types';
 import { NFTCard } from './NFTCard';
-import {
-  NFTLastSoldPrice,
-  NFTMedia,
-  NFTNetwork,
-  NFTOwner,
-  NFTTitle,
-} from './view';
 
 /**
  * @deprecated Use the `NFTCard` component instead with no 'children' props.
@@ -28,12 +21,6 @@ export function NFTCardDefault({
       onStatus={onStatus}
       onSuccess={onSuccess}
       onError={onError}
-    >
-      <NFTMedia />
-      <NFTTitle />
-      <NFTOwner />
-      <NFTLastSoldPrice />
-      <NFTNetwork />
-    </NFTCard>
+    />
   );
 }

packages/onchainkit/src/transaction/components/Transaction.test.tsx

@@ -77,7 +77,7 @@ describe('Transaction', () => {
         capabilities={{}}
         chainId={123}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={vi.fn()}
         onSuccess={vi.fn()}
       >
@@ -93,7 +93,7 @@ describe('Transaction', () => {
         capabilities={{}}
         chainId={123}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={vi.fn()}
         onSuccess={vi.fn()}
       >
@@ -114,7 +114,7 @@ describe('Transaction', () => {
         capabilities={{}}
         chainId={123}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={onError}
         onStatus={onStatus}
         onSuccess={onSuccess}
@@ -131,7 +131,7 @@ describe('Transaction', () => {
       <Transaction
         capabilities={{}}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={vi.fn()}
         onSuccess={vi.fn()}
       >
@@ -147,7 +147,7 @@ describe('Transaction', () => {
         capabilities={{}}
         chainId={base.id}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={vi.fn()}
         onSuccess={vi.fn()}
       >
@@ -163,7 +163,7 @@ describe('Transaction', () => {
         capabilities={{}}
         chainId={base.id}
         className="test-class"
-        contracts={[]}
+        calls={[]}
         onError={vi.fn()}
         onSuccess={vi.fn()}
       />,

packages/onchainkit/src/transaction/components/Transaction.tsx

@@ -13,7 +13,6 @@ export function Transaction({
   chainId,
   className,
   children,
-  contracts,
   disabled = false,
   isSponsored,
   onError,
@@ -43,7 +42,6 @@ export function Transaction({
       calls={calls}
       capabilities={capabilities}
       chainId={accountChainId}
-      contracts={contracts}
       isSponsored={isSponsored}
       onError={onError}
       onStatus={onStatus}

packages/onchainkit/src/transaction/components/TransactionDefault.test.tsx

@@ -55,7 +55,6 @@ describe('TransactionDefault Component', () => {
 
   const defaultProps: TransactionDefaultReact = {
     calls: [],
-    contracts: [],
     disabled: false,
     onError: mockOnError,
     onStatus: mockOnStatus,

packages/onchainkit/src/transaction/components/TransactionDefault.tsx

@@ -9,7 +9,6 @@ export function TransactionDefault({
   capabilities,
   chainId,
   className,
-  contracts,
   disabled,
   onError,
   onStatus,
@@ -22,7 +21,6 @@ export function TransactionDefault({
       chainId={chainId}
       className={className}
       disabled={disabled}
-      contracts={contracts}
       onError={onError}
       onStatus={onStatus}
       onSuccess={onSuccess}

packages/onchainkit/src/transaction/components/TransactionProvider.test.tsx

@@ -767,7 +767,7 @@ describe('TransactionProvider', () => {
         </TransactionProvider>,
       );
     }).toThrowError(
-      'Transaction: calls or contracts must be provided as a prop to the Transaction component.',
+      'Transaction: calls must be provided as a prop to the Transaction component.',
     );
     restore();
   });
@@ -786,34 +786,6 @@ describe('TransactionProvider', () => {
     consoleError.mockRestore();
   });
 
-  it('should throw an error when both contracts and calls are provided', async () => {
-    const restore = silenceError();
-    expect(() => {
-      render(
-        <TransactionProvider
-          chainId={base.id}
-          contracts={[
-            {
-              to: '0x1234567890123456789012345678901234567890' as `0x${string}`,
-              data: '0x' as `0x${string}`,
-            },
-          ]}
-          calls={[
-            {
-              to: '0x1234567890123456789012345678901234567890' as `0x${string}`,
-              data: '0x' as `0x${string}`,
-            },
-          ]}
-        >
-          <div>Test</div>
-        </TransactionProvider>,
-      );
-    }).toThrowError(
-      'Transaction: Only one of contracts or calls can be provided as a prop to the Transaction component.',
-    );
-    restore();
-  });
-
   it('should handle sponsored contract calls', async () => {
     const contracts = [
       { to: '0alissa' as `0x${string}`, data: '0x' as `0x${string}` },

packages/onchainkit/src/transaction/components/TransactionProvider.tsx

@@ -55,7 +55,6 @@ export function TransactionProvider({
   capabilities: transactionCapabilities,
   chainId,
   children,
-  contracts,
   isSponsored,
   onError,
   onStatus,
@@ -79,7 +78,6 @@ export function TransactionProvider({
     number | undefined
   >();
   const [transactionHashList, setTransactionHashList] = useState<Address[]>([]);
-  const transactions = calls || contracts;
 
   // Retrieve wallet capabilities
   const walletCapabilities = useCapabilitiesSafe({
@@ -89,16 +87,9 @@ export function TransactionProvider({
   const { switchChainAsync } = useSwitchChain();
 
   // Validate `calls` and `contracts` props
-  if (!contracts && !calls) {
+  if (!calls) {
     throw new Error(
-      'Transaction: calls or contracts must be provided as a prop to the Transaction component.',
-    );
-  }
-
-  // Validate `calls` and `contracts` props
-  if (calls && contracts) {
-    throw new Error(
-      'Transaction: Only one of contracts or calls can be provided as a prop to the Transaction component.',
+      'Transaction: calls must be provided as a prop to the Transaction component.',
     );
   }
 
@@ -241,7 +232,6 @@ export function TransactionProvider({
     }
   }, [receipt, resetAfter, resetSendCalls, resetSendCall]);
 
-  // When all transactions are successful, get the receipts
   const getTransactionLegacyReceipts = useCallback(async () => {
     const receipts = [];
     for (const hash of transactionHashList) {
@@ -270,17 +260,18 @@ export function TransactionProvider({
     });
   }, [chainId, config, transactionHashList]);
 
+  // When all transactions are successful, get the receipts
   useEffect(() => {
     if (
-      !transactions ||
+      !calls ||
       transactionHashList.length !== transactionCount ||
       transactionCount < 2
     ) {
       return;
     }
     getTransactionLegacyReceipts();
   }, [
-    transactions,
+    calls,
     transactionCount,
     transactionHashList,
     getTransactionLegacyReceipts,
@@ -304,9 +295,9 @@ export function TransactionProvider({
       handleAnalytics(TransactionEvent.TransactionInitiated, {
         address: account.address,
       });
-      const resolvedTransactions = await (typeof transactions === 'function'
-        ? transactions()
-        : Promise.resolve(transactions));
+      const resolvedTransactions = await (typeof calls === 'function'
+        ? calls()
+        : Promise.resolve(calls));
       setTransactionCount(resolvedTransactions?.length);
       return resolvedTransactions;
     } catch (err) {
@@ -326,7 +317,7 @@ export function TransactionProvider({
       });
       return undefined;
     }
-  }, [transactions, handleAnalytics, account.address, errorCode]);
+  }, [calls, handleAnalytics, account.address, errorCode]);
 
   const handleSubmit = useCallback(async () => {
     setErrorMessage('');
@@ -364,7 +355,7 @@ export function TransactionProvider({
     setIsToastVisible,
     setLifecycleStatus,
     setTransactionId,
-    transactions,
+    transactions: calls,
     transactionId,
     transactionHash: singleTransactionHash || batchedTransactionHash,
     transactionCount,

packages/onchainkit/src/transaction/types.ts

@@ -165,10 +165,6 @@ export type TransactionProviderReact = {
   chainId: number;
   /** The child components to be rendered within the provider component */
   children: ReactNode;
-  /**
-   * @deprecated Use `calls` instead.
-   */
-  contracts?: Calls | Contracts | Array<Call | ContractFunctionParameters>;
   /** Whether the transactions are sponsored (default: false) */
   isSponsored?: boolean;
   /** An optional callback function that handles errors within the provider */
@@ -197,10 +193,6 @@ export type TransactionReact = {
   children?: ReactNode;
   /** An optional CSS class name for styling the component */
   className?: string;
-  /**
-   * @deprecated Use `calls` instead.
-   */
-  contracts?: Calls | Contracts | Array<Call | ContractFunctionParameters>;
   /** Whether the transactions are sponsored (default: false) */
   isSponsored?: boolean;
   /** An optional callback function that handles transaction errors */

packages/onchainkit/src/wallet/components/ConnectButton.test.tsx

@@ -1,16 +1,11 @@
 import { render, screen } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 import { ConnectButton } from './ConnectButton';
-import { ConnectWalletText } from './ConnectWalletText';
 
 describe('ConnectButton', () => {
   it('should render connect button', () => {
     render(
-      <ConnectButton
-        connectWalletText="Connect Wallet"
-        onClick={vi.fn()}
-        text="text"
-      />,
+      <ConnectButton connectWalletText="Connect Wallet" onClick={vi.fn()} />,
     );
     const button = screen.getByTestId('ockConnectButton');
     expect(button).toBeInTheDocument();
@@ -20,11 +15,8 @@ describe('ConnectButton', () => {
   it('should render connect button with custom text', () => {
     render(
       <ConnectButton
-        connectWalletText={
-          <ConnectWalletText>Connect Dope Wallet</ConnectWalletText>
-        }
+        connectWalletText="Connect Dope Wallet"
         onClick={vi.fn()}
-        text="text"
       />,
     );
     const button = screen.getByTestId('ockConnectButton');
@@ -38,7 +30,6 @@ describe('ConnectButton', () => {
         className="custom-class"
         connectWalletText="Connect Dope Wallet"
         onClick={vi.fn()}
-        text="text"
       />,
     );
     const button = screen.getByTestId('ockConnectButton');