From 1dd7a84efa0b5da9dfb115826addb586c9c254c2 Mon Sep 17 00:00:00 2001
From: Daniel Schlabach <31226559+dschlabach@users.noreply.github.com>
Date: Mon, 16 Dec 2024 16:42:45 -0500
Subject: [PATCH] refactor: move web utils to `ui/react/internal/utils` (#1716)

---
 src/checkout/components/CheckoutProvider.test.tsx             | 4 ++--
 src/checkout/components/CheckoutProvider.tsx                  | 4 ++--
 src/{internal => core}/utils/convertSnakeToCamelCase.test.ts  | 0
 src/{internal => core}/utils/convertSnakeToCamelCase.ts       | 0
 src/{internal => core}/utils/getApiKey.test.ts                | 2 +-
 src/{internal => core}/utils/getApiKey.ts                     | 2 +-
 src/fund/components/FundButton.test.tsx                       | 4 ++--
 src/fund/components/FundButton.tsx                            | 3 ++-
 src/fund/utils/fetchOnrampConfig.ts                           | 4 ++--
 src/fund/utils/fetchOnrampOptions.ts                          | 4 ++--
 src/fund/utils/fetchOnrampQuote.ts                            | 4 ++--
 src/fund/utils/fetchOnrampTransactionStatus.ts                | 4 ++--
 src/fund/utils/getFundingPopupSize.test.ts                    | 4 ++--
 src/fund/utils/getFundingPopupSize.ts                         | 2 +-
 src/internal/components/Toast.tsx                             | 2 +-
 src/{ => ui/react}/internal/utils/getToastPosition.test.ts    | 0
 src/{ => ui/react}/internal/utils/getToastPosition.ts         | 0
 src/{ => ui/react}/internal/utils/getWindowDimensions.test.ts | 0
 src/{ => ui/react}/internal/utils/getWindowDimensions.ts      | 0
 src/{ => ui/react}/internal/utils/openPopup.test.ts           | 0
 src/{ => ui/react}/internal/utils/openPopup.ts                | 0
 src/wallet/components/WalletDropdownFundLink.test.tsx         | 4 ++--
 src/wallet/components/WalletDropdownFundLink.tsx              | 2 +-
 23 files changed, 25 insertions(+), 24 deletions(-)
 rename src/{internal => core}/utils/convertSnakeToCamelCase.test.ts (100%)
 rename src/{internal => core}/utils/convertSnakeToCamelCase.ts (100%)
 rename src/{internal => core}/utils/getApiKey.test.ts (90%)
 rename src/{internal => core}/utils/getApiKey.ts (85%)
 rename src/{ => ui/react}/internal/utils/getToastPosition.test.ts (100%)
 rename src/{ => ui/react}/internal/utils/getToastPosition.ts (100%)
 rename src/{ => ui/react}/internal/utils/getWindowDimensions.test.ts (100%)
 rename src/{ => ui/react}/internal/utils/getWindowDimensions.ts (100%)
 rename src/{ => ui/react}/internal/utils/openPopup.test.ts (100%)
 rename src/{ => ui/react}/internal/utils/openPopup.ts (100%)

diff --git a/src/checkout/components/CheckoutProvider.test.tsx b/src/checkout/components/CheckoutProvider.test.tsx
index 36bbfb1506..f85bac5386 100644
--- a/src/checkout/components/CheckoutProvider.test.tsx
+++ b/src/checkout/components/CheckoutProvider.test.tsx
@@ -1,3 +1,4 @@
+import { openPopup } from '@/ui-react/internal/utils/openPopup';
 import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import {
   type Mock,
@@ -13,7 +14,6 @@ import { useWaitForTransactionReceipt } from 'wagmi';
 import { useCallsStatus } from 'wagmi/experimental';
 import { useWriteContracts } from 'wagmi/experimental';
 import { useOnchainKit } from '../../core-react/useOnchainKit';
-import { openPopup } from '../../internal/utils/openPopup';
 import { useIsWalletACoinbaseSmartWallet } from '../../wallet/hooks/useIsWalletACoinbaseSmartWallet';
 import { GENERIC_ERROR_MESSAGE } from '../constants';
 import { useCommerceContracts } from '../hooks/useCommerceContracts';
@@ -43,7 +43,7 @@ vi.mock('../../core-react/useOnchainKit', () => ({
   useOnchainKit: vi.fn(),
 }));
 
-vi.mock('../../internal/utils/openPopup', () => ({
+vi.mock('@/ui-react/internal/utils/openPopup', () => ({
   openPopup: vi.fn(),
 }));
 
diff --git a/src/checkout/components/CheckoutProvider.tsx b/src/checkout/components/CheckoutProvider.tsx
index 37624d0268..838433b957 100644
--- a/src/checkout/components/CheckoutProvider.tsx
+++ b/src/checkout/components/CheckoutProvider.tsx
@@ -1,3 +1,5 @@
+import { getWindowDimensions } from '@/ui-react/internal/utils/getWindowDimensions';
+import { openPopup } from '@/ui-react/internal/utils/openPopup';
 import {
   createContext,
   useCallback,
@@ -15,8 +17,6 @@ import { useWriteContracts } from 'wagmi/experimental';
 import { useCallsStatus } from 'wagmi/experimental';
 import { useValue } from '../../core-react/internal/hooks/useValue';
 import { useOnchainKit } from '../../core-react/useOnchainKit';
-import { getWindowDimensions } from '../../internal/utils/getWindowDimensions';
-import { openPopup } from '../../internal/utils/openPopup';
 import { isUserRejectedRequestError } from '../../transaction/utils/isUserRejectedRequestError';
 import { useIsWalletACoinbaseSmartWallet } from '../../wallet/hooks/useIsWalletACoinbaseSmartWallet';
 import {
diff --git a/src/internal/utils/convertSnakeToCamelCase.test.ts b/src/core/utils/convertSnakeToCamelCase.test.ts
similarity index 100%
rename from src/internal/utils/convertSnakeToCamelCase.test.ts
rename to src/core/utils/convertSnakeToCamelCase.test.ts
diff --git a/src/internal/utils/convertSnakeToCamelCase.ts b/src/core/utils/convertSnakeToCamelCase.ts
similarity index 100%
rename from src/internal/utils/convertSnakeToCamelCase.ts
rename to src/core/utils/convertSnakeToCamelCase.ts
diff --git a/src/internal/utils/getApiKey.test.ts b/src/core/utils/getApiKey.test.ts
similarity index 90%
rename from src/internal/utils/getApiKey.test.ts
rename to src/core/utils/getApiKey.test.ts
index 619e986cca..984cc31d4d 100644
--- a/src/internal/utils/getApiKey.test.ts
+++ b/src/core/utils/getApiKey.test.ts
@@ -1,5 +1,5 @@
+import { setOnchainKitConfig } from '@/core/OnchainKitConfig';
 import { describe, expect, it } from 'vitest';
-import { setOnchainKitConfig } from '../../core/OnchainKitConfig';
 import { getApiKey } from './getApiKey';
 
 describe('getApiKey', () => {
diff --git a/src/internal/utils/getApiKey.ts b/src/core/utils/getApiKey.ts
similarity index 85%
rename from src/internal/utils/getApiKey.ts
rename to src/core/utils/getApiKey.ts
index ff22ed29f9..45a7abaee8 100644
--- a/src/internal/utils/getApiKey.ts
+++ b/src/core/utils/getApiKey.ts
@@ -1,4 +1,4 @@
-import { ONCHAIN_KIT_CONFIG } from '../../core/OnchainKitConfig';
+import { ONCHAIN_KIT_CONFIG } from '@/core/OnchainKitConfig';
 
 /**
  * Get the API key for OnchainKit.
diff --git a/src/fund/components/FundButton.test.tsx b/src/fund/components/FundButton.test.tsx
index fa4a459361..af8e4631db 100644
--- a/src/fund/components/FundButton.test.tsx
+++ b/src/fund/components/FundButton.test.tsx
@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom';
+import { openPopup } from '@/ui-react/internal/utils/openPopup';
 import { fireEvent, render, screen } from '@testing-library/react';
 import { type Mock, afterEach, describe, expect, it, vi } from 'vitest';
-import { openPopup } from '../../internal/utils/openPopup';
 import { useGetFundingUrl } from '../hooks/useGetFundingUrl';
 import { getFundingPopupSize } from '../utils/getFundingPopupSize';
 import { FundButton } from './FundButton';
@@ -14,7 +14,7 @@ vi.mock('../utils/getFundingPopupSize', () => ({
   getFundingPopupSize: vi.fn(),
 }));
 
-vi.mock('../../internal/utils/openPopup', () => ({
+vi.mock('@/ui-react/internal/utils/openPopup', () => ({
   openPopup: vi.fn(),
 }));
 
diff --git a/src/fund/components/FundButton.tsx b/src/fund/components/FundButton.tsx
index 51b8f6063a..dc5307eea2 100644
--- a/src/fund/components/FundButton.tsx
+++ b/src/fund/components/FundButton.tsx
@@ -1,8 +1,9 @@
 import { useCallback } from 'react';
 import { useTheme } from '../../core-react/internal/hooks/useTheme';
 import { addSvg } from '../../internal/svg/addSvg';
-import { openPopup } from '../../internal/utils/openPopup';
 import { border, cn, color, pressable, text } from '../../styles/theme';
+
+import { openPopup } from '@/ui-react/internal/utils/openPopup';
 import { useGetFundingUrl } from '../hooks/useGetFundingUrl';
 import type { FundButtonReact } from '../types';
 import { getFundingPopupSize } from '../utils/getFundingPopupSize';
diff --git a/src/fund/utils/fetchOnrampConfig.ts b/src/fund/utils/fetchOnrampConfig.ts
index 230ae3ac31..f0f2f862f5 100644
--- a/src/fund/utils/fetchOnrampConfig.ts
+++ b/src/fund/utils/fetchOnrampConfig.ts
@@ -1,5 +1,5 @@
-import { convertSnakeToCamelCase } from '../../internal/utils/convertSnakeToCamelCase';
-import { getApiKey } from '../../internal/utils/getApiKey';
+import { convertSnakeToCamelCase } from '@/core/utils/convertSnakeToCamelCase';
+import { getApiKey } from '@/core/utils/getApiKey';
 import { ONRAMP_API_BASE_URL } from '../constants';
 import type { OnrampPaymentMethod } from '../types';
 
diff --git a/src/fund/utils/fetchOnrampOptions.ts b/src/fund/utils/fetchOnrampOptions.ts
index 0e53663267..508b4f651c 100644
--- a/src/fund/utils/fetchOnrampOptions.ts
+++ b/src/fund/utils/fetchOnrampOptions.ts
@@ -1,5 +1,5 @@
-import { convertSnakeToCamelCase } from '../../internal/utils/convertSnakeToCamelCase';
-import { getApiKey } from '../../internal/utils/getApiKey';
+import { convertSnakeToCamelCase } from '../../core/utils/convertSnakeToCamelCase';
+import { getApiKey } from '../../core/utils/getApiKey';
 import { ONRAMP_API_BASE_URL } from '../constants';
 import type { OnrampPaymentCurrency, OnrampPurchaseCurrency } from '../types';
 
diff --git a/src/fund/utils/fetchOnrampQuote.ts b/src/fund/utils/fetchOnrampQuote.ts
index 9d5d3f8e09..7e31cb4a40 100644
--- a/src/fund/utils/fetchOnrampQuote.ts
+++ b/src/fund/utils/fetchOnrampQuote.ts
@@ -1,5 +1,5 @@
-import { convertSnakeToCamelCase } from '../../internal/utils/convertSnakeToCamelCase';
-import { getApiKey } from '../../internal/utils/getApiKey';
+import { convertSnakeToCamelCase } from '../../core/utils/convertSnakeToCamelCase';
+import { getApiKey } from '../../core/utils/getApiKey';
 import { ONRAMP_API_BASE_URL } from '../constants';
 import type { OnrampAmount } from '../types';
 
diff --git a/src/fund/utils/fetchOnrampTransactionStatus.ts b/src/fund/utils/fetchOnrampTransactionStatus.ts
index 31e95d5dd5..5446a336c4 100644
--- a/src/fund/utils/fetchOnrampTransactionStatus.ts
+++ b/src/fund/utils/fetchOnrampTransactionStatus.ts
@@ -1,5 +1,5 @@
-import { convertSnakeToCamelCase } from '../../internal/utils/convertSnakeToCamelCase';
-import { getApiKey } from '../../internal/utils/getApiKey';
+import { convertSnakeToCamelCase } from '../../core/utils/convertSnakeToCamelCase';
+import { getApiKey } from '../../core/utils/getApiKey';
 import { ONRAMP_API_BASE_URL } from '../constants';
 import type { OnrampTransaction } from '../types';
 
diff --git a/src/fund/utils/getFundingPopupSize.test.ts b/src/fund/utils/getFundingPopupSize.test.ts
index 9121324fc4..52bf3ea897 100644
--- a/src/fund/utils/getFundingPopupSize.test.ts
+++ b/src/fund/utils/getFundingPopupSize.test.ts
@@ -1,9 +1,9 @@
 import { type Mock, afterEach, describe, expect, it, vi } from 'vitest';
-import { getWindowDimensions } from '../../internal/utils/getWindowDimensions';
+import { getWindowDimensions } from '../../ui/react/internal/utils/getWindowDimensions';
 import { ONRAMP_POPUP_HEIGHT, ONRAMP_POPUP_WIDTH } from '../constants';
 import { getFundingPopupSize } from './getFundingPopupSize';
 
-vi.mock('../../internal/utils/getWindowDimensions', () => ({
+vi.mock('../../ui/react/internal/utils/getWindowDimensions', () => ({
   getWindowDimensions: vi.fn(),
 }));
 
diff --git a/src/fund/utils/getFundingPopupSize.ts b/src/fund/utils/getFundingPopupSize.ts
index 02e90838ab..27d0123ec9 100644
--- a/src/fund/utils/getFundingPopupSize.ts
+++ b/src/fund/utils/getFundingPopupSize.ts
@@ -1,7 +1,7 @@
 import {
   getWindowDimensions,
   type popupSizes,
-} from '../../internal/utils/getWindowDimensions';
+} from '../../ui/react/internal/utils/getWindowDimensions';
 import { ONRAMP_POPUP_HEIGHT, ONRAMP_POPUP_WIDTH } from '../constants';
 import { ONRAMP_BUY_URL } from '../constants';
 
diff --git a/src/internal/components/Toast.tsx b/src/internal/components/Toast.tsx
index 9c95982fb9..633a8d1d48 100644
--- a/src/internal/components/Toast.tsx
+++ b/src/internal/components/Toast.tsx
@@ -1,7 +1,7 @@
 import { useEffect } from 'react';
 import { background, cn } from '../../styles/theme';
+import { getToastPosition } from '../../ui/react/internal/utils/getToastPosition';
 import { closeSvg } from '../svg/closeSvg';
-import { getToastPosition } from '../utils/getToastPosition';
 
 type ToastProps = {
   className?: string;
diff --git a/src/internal/utils/getToastPosition.test.ts b/src/ui/react/internal/utils/getToastPosition.test.ts
similarity index 100%
rename from src/internal/utils/getToastPosition.test.ts
rename to src/ui/react/internal/utils/getToastPosition.test.ts
diff --git a/src/internal/utils/getToastPosition.ts b/src/ui/react/internal/utils/getToastPosition.ts
similarity index 100%
rename from src/internal/utils/getToastPosition.ts
rename to src/ui/react/internal/utils/getToastPosition.ts
diff --git a/src/internal/utils/getWindowDimensions.test.ts b/src/ui/react/internal/utils/getWindowDimensions.test.ts
similarity index 100%
rename from src/internal/utils/getWindowDimensions.test.ts
rename to src/ui/react/internal/utils/getWindowDimensions.test.ts
diff --git a/src/internal/utils/getWindowDimensions.ts b/src/ui/react/internal/utils/getWindowDimensions.ts
similarity index 100%
rename from src/internal/utils/getWindowDimensions.ts
rename to src/ui/react/internal/utils/getWindowDimensions.ts
diff --git a/src/internal/utils/openPopup.test.ts b/src/ui/react/internal/utils/openPopup.test.ts
similarity index 100%
rename from src/internal/utils/openPopup.test.ts
rename to src/ui/react/internal/utils/openPopup.test.ts
diff --git a/src/internal/utils/openPopup.ts b/src/ui/react/internal/utils/openPopup.ts
similarity index 100%
rename from src/internal/utils/openPopup.ts
rename to src/ui/react/internal/utils/openPopup.ts
diff --git a/src/wallet/components/WalletDropdownFundLink.test.tsx b/src/wallet/components/WalletDropdownFundLink.test.tsx
index c43668d25c..5bf5ad474b 100644
--- a/src/wallet/components/WalletDropdownFundLink.test.tsx
+++ b/src/wallet/components/WalletDropdownFundLink.test.tsx
@@ -3,7 +3,7 @@ import { fireEvent, render, screen } from '@testing-library/react';
 import { type Mock, afterEach, describe, expect, it, vi } from 'vitest';
 import { useGetFundingUrl } from '../../fund/hooks/useGetFundingUrl';
 import { getFundingPopupSize } from '../../fund/utils/getFundingPopupSize';
-import { openPopup } from '../../internal/utils/openPopup';
+import { openPopup } from '../../ui/react/internal/utils/openPopup';
 import { WalletDropdownFundLink } from './WalletDropdownFundLink';
 
 vi.mock('../../fund/hooks/useGetFundingUrl', () => ({
@@ -14,7 +14,7 @@ vi.mock('../../fund/utils/getFundingPopupSize', () => ({
   getFundingPopupSize: vi.fn(),
 }));
 
-vi.mock('../../internal/utils/openPopup', () => ({
+vi.mock('../../ui/react/internal/utils/openPopup', () => ({
   openPopup: vi.fn(),
 }));
 
diff --git a/src/wallet/components/WalletDropdownFundLink.tsx b/src/wallet/components/WalletDropdownFundLink.tsx
index 19fbbb0812..3780792f5b 100644
--- a/src/wallet/components/WalletDropdownFundLink.tsx
+++ b/src/wallet/components/WalletDropdownFundLink.tsx
@@ -2,8 +2,8 @@ import { useCallback, useMemo } from 'react';
 import { useIcon } from '../../core-react/internal/hooks/useIcon';
 import { useGetFundingUrl } from '../../fund/hooks/useGetFundingUrl';
 import { getFundingPopupSize } from '../../fund/utils/getFundingPopupSize';
-import { openPopup } from '../../internal/utils/openPopup';
 import { cn, color, pressable, text as themeText } from '../../styles/theme';
+import { openPopup } from '../../ui/react/internal/utils/openPopup';
 import type { WalletDropdownFundLinkReact } from '../types';
 
 export function WalletDropdownFundLink({