diff --git a/src/buy/components/Buy.tsx b/src/buy/components/Buy.tsx index 949d7e9eba..28f800ee22 100644 --- a/src/buy/components/Buy.tsx +++ b/src/buy/components/Buy.tsx @@ -45,7 +45,6 @@ export function Buy({ onSuccess, toToken, fromToken, - projectId, }: BuyReact) { return ( diff --git a/src/buy/components/BuyDropdown.test.tsx b/src/buy/components/BuyDropdown.test.tsx index d0e4b58e29..66c00eff80 100644 --- a/src/buy/components/BuyDropdown.test.tsx +++ b/src/buy/components/BuyDropdown.test.tsx @@ -1,6 +1,7 @@ import { openPopup } from '@/ui-react/internal/utils/openPopup'; import { act, fireEvent, render, screen } from '@testing-library/react'; import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest'; +import { useOnchainKit } from '../../core-react/useOnchainKit'; import { BuyDropdown } from './BuyDropdown'; import { useBuyContext } from './BuyProvider'; import { degenToken, ethToken, usdcToken } from '../../token/constants'; @@ -29,6 +30,10 @@ vi.mock('wagmi', async () => { }; }); +vi.mock('../../core-react/useOnchainKit', () => ({ + useOnchainKit: vi.fn(), +})); + const mockStartPopupMonitor = vi.fn(); const mockContextValue = { @@ -40,7 +45,6 @@ const mockContextValue = { fromETH: { token: ethToken }, fromUSDC: { token: usdcToken }, from: { token: { symbol: 'DAI' } }, - projectId: 'mock-project-id', startPopupMonitor: mockStartPopupMonitor, setIsDropdownOpen: vi.fn(), }; @@ -49,6 +53,9 @@ describe('BuyDropdown', () => { beforeEach(() => { vi.clearAllMocks(); (useBuyContext as Mock).mockReturnValue(mockContextValue); + (useOnchainKit as Mock).mockReturnValue({ + projectId: 'mock-project-id', + }); }); it('renders the dropdown with correct content', () => { diff --git a/src/buy/components/BuyDropdown.tsx b/src/buy/components/BuyDropdown.tsx index 7d4fd02288..b195148d74 100644 --- a/src/buy/components/BuyDropdown.tsx +++ b/src/buy/components/BuyDropdown.tsx @@ -1,3 +1,4 @@ +import { useOnchainKit } from '@/core-react/useOnchainKit'; import { openPopup } from '@/ui-react/internal/utils/openPopup'; import { useCallback, useMemo } from 'react'; import { useAccount } from 'wagmi'; @@ -11,8 +12,8 @@ import { useBuyContext } from './BuyProvider'; import { BuyTokenItem } from './BuyTokenItem'; export function BuyDropdown() { - const { to, fromETH, fromUSDC, from, projectId, startPopupMonitor } = - useBuyContext(); + const { projectId } = useOnchainKit(); + const { to, fromETH, fromUSDC, from, startPopupMonitor } = useBuyContext(); const { address } = useAccount(); const handleOnrampClick = useCallback( diff --git a/src/buy/components/BuyProvider.test.tsx b/src/buy/components/BuyProvider.test.tsx index a618d3b562..3480e5b34f 100644 --- a/src/buy/components/BuyProvider.test.tsx +++ b/src/buy/components/BuyProvider.test.tsx @@ -145,7 +145,6 @@ const wrapper = ({ children }: { children: React.ReactNode }) => ( config={{ maxSlippage: 5 }} experimental={{ useAggregator: true }} toToken={degenToken} - projectId="mock-project-id" fromToken={daiToken} > {children} @@ -178,7 +177,6 @@ const renderWithProviders = ({ onSuccess={onSuccess} toToken={degenToken} fromToken={daiToken} - projectId="mock-project-id" > @@ -829,7 +827,6 @@ describe('BuyProvider', () => { {children} diff --git a/src/buy/components/BuyProvider.tsx b/src/buy/components/BuyProvider.tsx index f1104f3c46..24eb675d06 100644 --- a/src/buy/components/BuyProvider.tsx +++ b/src/buy/components/BuyProvider.tsx @@ -53,7 +53,6 @@ export function BuyProvider({ onSuccess, toToken, fromToken, - projectId, }: BuyProviderReact) { const { config: { paymaster } = { paymaster: undefined }, @@ -89,6 +88,14 @@ export function BuyProvider({ // Refreshes balances and inputs post-swap const resetInputs = useResetBuyInputs({ fromETH, fromUSDC, from, to }); + + const { projectId } = useOnchainKit(); + if (!projectId) { + throw new Error( + 'Buy: Project ID is required, please set the projectId in the OnchainKitProvider', + ); + } + // For batched transactions, listens to and awaits calls from the Wallet server const awaitCallsStatus = useAwaitCalls({ accountConfig, @@ -462,7 +469,6 @@ export function BuyProvider({ setIsDropdownOpen, toToken, fromToken, - projectId, startPopupMonitor, }); diff --git a/src/buy/types.ts b/src/buy/types.ts index 0177223f39..c74c4cd0bc 100644 --- a/src/buy/types.ts +++ b/src/buy/types.ts @@ -21,7 +21,6 @@ export type BuyReact = { onSuccess?: (transactionReceipt?: TransactionReceipt) => void; // An optional callback function that exposes the transaction receipt fromToken?: Token; // An optional token to swap from toToken: Token; // The token to swap to - projectId: string; // A CDP project ID (found at https://portal.cdp.coinbase.com/) }; export type BuyContextType = { @@ -41,7 +40,6 @@ export type BuyContextType = { transactionHash: string; isDropdownOpen: boolean; setIsDropdownOpen: (open: boolean) => void; - projectId: string; startPopupMonitor: (popupWindow: Window) => void; }; @@ -59,7 +57,6 @@ export type BuyProviderReact = { onSuccess?: (transactionReceipt?: TransactionReceipt) => void; // An optional callback function that exposes the transaction receipt fromToken?: Token; toToken: Token; - projectId: string; }; export type BuyTokens = {