From df47c77eafff280527fdd61ffbbb8c54eb012e24 Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:03:04 -0400 Subject: [PATCH 1/6] enable `Swap` in development --- .../components/OnchainProviders.tsx | 3 ++- .../nextjs-app-router/components/demo/Swap.tsx | 5 ++++- playground/nextjs-app-router/lib/constants.ts | 12 ++++++++++++ 3 files changed, 18 insertions(+), 2 deletions(-) diff --git a/playground/nextjs-app-router/components/OnchainProviders.tsx b/playground/nextjs-app-router/components/OnchainProviders.tsx index bebe8dcc33..c5b66a0019 100644 --- a/playground/nextjs-app-router/components/OnchainProviders.tsx +++ b/playground/nextjs-app-router/components/OnchainProviders.tsx @@ -1,5 +1,6 @@ 'use client'; +import { ENVIRONMENT, ENVARS } from '@/lib/constants'; import { OnchainKitProvider } from '@coinbase/onchainkit'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import type { ReactNode } from 'react'; @@ -33,7 +34,7 @@ function OnchainProviders({ children }: { children: ReactNode }) { diff --git a/playground/nextjs-app-router/components/demo/Swap.tsx b/playground/nextjs-app-router/components/demo/Swap.tsx index f1be1244aa..7b36e9e74d 100644 --- a/playground/nextjs-app-router/components/demo/Swap.tsx +++ b/playground/nextjs-app-router/components/demo/Swap.tsx @@ -9,6 +9,7 @@ import type { Token } from '@coinbase/onchainkit/token'; import { useContext } from 'react'; import { useAccount } from 'wagmi'; import { AppContext } from '../AppProvider'; +import { ENVARS, ENVIRONMENT } from '@/lib/constants'; function SwapComponent() { const { address } = useAccount(); @@ -94,7 +95,9 @@ function SwapComponent() { token={usdcToken} type="to" /> - + ) : ( diff --git a/playground/nextjs-app-router/lib/constants.ts b/playground/nextjs-app-router/lib/constants.ts index 68f70f676e..5bc4ed6379 100644 --- a/playground/nextjs-app-router/lib/constants.ts +++ b/playground/nextjs-app-router/lib/constants.ts @@ -8,3 +8,15 @@ export const deployedContracts: Record = { click: '0x7d662A03CC7f493D447EB8b499cF4533f5B640E2', }, }; + +export const ENVIRONMENT = { + API_KEY: 'API_KEY', + ENVIRONMENT: 'ENVIRONMENT', +} as const; + +type EnvironmentKey = (typeof ENVIRONMENT)[keyof typeof ENVIRONMENT]; + +export const ENVARS: Record = { + [ENVIRONMENT.API_KEY]: process.env.NEXT_PUBLIC_OCK_API_KEY, + [ENVIRONMENT.ENVIRONMENT]: process.env.NEXT_PUBLIC_VERCEL_ENV, +}; From 36baf473c20d591465d8d3fd5dd449ee4fcf3c76 Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:03:41 -0400 Subject: [PATCH 2/6] sort imports --- playground/nextjs-app-router/components/OnchainProviders.tsx | 2 +- playground/nextjs-app-router/components/demo/Swap.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/playground/nextjs-app-router/components/OnchainProviders.tsx b/playground/nextjs-app-router/components/OnchainProviders.tsx index c5b66a0019..6cd64dd413 100644 --- a/playground/nextjs-app-router/components/OnchainProviders.tsx +++ b/playground/nextjs-app-router/components/OnchainProviders.tsx @@ -1,6 +1,6 @@ 'use client'; -import { ENVIRONMENT, ENVARS } from '@/lib/constants'; +import { ENVARS, ENVIRONMENT } from '@/lib/constants'; import { OnchainKitProvider } from '@coinbase/onchainkit'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import type { ReactNode } from 'react'; diff --git a/playground/nextjs-app-router/components/demo/Swap.tsx b/playground/nextjs-app-router/components/demo/Swap.tsx index 7b36e9e74d..8976b4eb02 100644 --- a/playground/nextjs-app-router/components/demo/Swap.tsx +++ b/playground/nextjs-app-router/components/demo/Swap.tsx @@ -1,3 +1,4 @@ +import { ENVARS, ENVIRONMENT } from '@/lib/constants'; import { Swap, SwapAmountInput, @@ -9,7 +10,6 @@ import type { Token } from '@coinbase/onchainkit/token'; import { useContext } from 'react'; import { useAccount } from 'wagmi'; import { AppContext } from '../AppProvider'; -import { ENVARS, ENVIRONMENT } from '@/lib/constants'; function SwapComponent() { const { address } = useAccount(); From fcdd05ffa42e93f517c22a7f72e756bcffab1b09 Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:07:42 -0400 Subject: [PATCH 3/6] try `VERCEL_ENV` --- playground/nextjs-app-router/lib/constants.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/playground/nextjs-app-router/lib/constants.ts b/playground/nextjs-app-router/lib/constants.ts index 5bc4ed6379..822087f2d2 100644 --- a/playground/nextjs-app-router/lib/constants.ts +++ b/playground/nextjs-app-router/lib/constants.ts @@ -18,5 +18,5 @@ type EnvironmentKey = (typeof ENVIRONMENT)[keyof typeof ENVIRONMENT]; export const ENVARS: Record = { [ENVIRONMENT.API_KEY]: process.env.NEXT_PUBLIC_OCK_API_KEY, - [ENVIRONMENT.ENVIRONMENT]: process.env.NEXT_PUBLIC_VERCEL_ENV, + [ENVIRONMENT.ENVIRONMENT]: process.env.VERCEL_ENV, }; From 19fa8d5c4b15cdfed0bc51d9f387a0a47d729915 Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:09:28 -0400 Subject: [PATCH 4/6] environment is `preview` --- playground/nextjs-app-router/components/demo/Swap.tsx | 4 +--- playground/nextjs-app-router/lib/constants.ts | 2 +- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/playground/nextjs-app-router/components/demo/Swap.tsx b/playground/nextjs-app-router/components/demo/Swap.tsx index 8976b4eb02..2ada276e7a 100644 --- a/playground/nextjs-app-router/components/demo/Swap.tsx +++ b/playground/nextjs-app-router/components/demo/Swap.tsx @@ -95,9 +95,7 @@ function SwapComponent() { token={usdcToken} type="to" /> - + ) : ( diff --git a/playground/nextjs-app-router/lib/constants.ts b/playground/nextjs-app-router/lib/constants.ts index 822087f2d2..5bc4ed6379 100644 --- a/playground/nextjs-app-router/lib/constants.ts +++ b/playground/nextjs-app-router/lib/constants.ts @@ -18,5 +18,5 @@ type EnvironmentKey = (typeof ENVIRONMENT)[keyof typeof ENVIRONMENT]; export const ENVARS: Record = { [ENVIRONMENT.API_KEY]: process.env.NEXT_PUBLIC_OCK_API_KEY, - [ENVIRONMENT.ENVIRONMENT]: process.env.VERCEL_ENV, + [ENVIRONMENT.ENVIRONMENT]: process.env.NEXT_PUBLIC_VERCEL_ENV, }; From 490a5a868dbfe3677c6684bd85038d51543bc7de Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:12:49 -0400 Subject: [PATCH 5/6] rename to `ENVIRONMENT_VARIABLES` --- .../nextjs-app-router/components/OnchainProviders.tsx | 4 ++-- playground/nextjs-app-router/components/demo/Swap.tsx | 8 ++++++-- playground/nextjs-app-router/lib/constants.ts | 9 +++++---- 3 files changed, 13 insertions(+), 8 deletions(-) diff --git a/playground/nextjs-app-router/components/OnchainProviders.tsx b/playground/nextjs-app-router/components/OnchainProviders.tsx index 6cd64dd413..3204c35e5d 100644 --- a/playground/nextjs-app-router/components/OnchainProviders.tsx +++ b/playground/nextjs-app-router/components/OnchainProviders.tsx @@ -1,6 +1,6 @@ 'use client'; -import { ENVARS, ENVIRONMENT } from '@/lib/constants'; +import { ENVIRONMENT, ENVIRONMENT_VARIABLES } from '@/lib/constants'; import { OnchainKitProvider } from '@coinbase/onchainkit'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import type { ReactNode } from 'react'; @@ -34,7 +34,7 @@ function OnchainProviders({ children }: { children: ReactNode }) { diff --git a/playground/nextjs-app-router/components/demo/Swap.tsx b/playground/nextjs-app-router/components/demo/Swap.tsx index 2ada276e7a..0e4d126525 100644 --- a/playground/nextjs-app-router/components/demo/Swap.tsx +++ b/playground/nextjs-app-router/components/demo/Swap.tsx @@ -1,4 +1,4 @@ -import { ENVARS, ENVIRONMENT } from '@/lib/constants'; +import { ENVIRONMENT, ENVIRONMENT_VARIABLES } from '@/lib/constants'; import { Swap, SwapAmountInput, @@ -95,7 +95,11 @@ function SwapComponent() { token={usdcToken} type="to" /> - + ) : ( diff --git a/playground/nextjs-app-router/lib/constants.ts b/playground/nextjs-app-router/lib/constants.ts index 5bc4ed6379..c3346cf6cb 100644 --- a/playground/nextjs-app-router/lib/constants.ts +++ b/playground/nextjs-app-router/lib/constants.ts @@ -16,7 +16,8 @@ export const ENVIRONMENT = { type EnvironmentKey = (typeof ENVIRONMENT)[keyof typeof ENVIRONMENT]; -export const ENVARS: Record = { - [ENVIRONMENT.API_KEY]: process.env.NEXT_PUBLIC_OCK_API_KEY, - [ENVIRONMENT.ENVIRONMENT]: process.env.NEXT_PUBLIC_VERCEL_ENV, -}; +export const ENVIRONMENT_VARIABLES: Record = + { + [ENVIRONMENT.API_KEY]: process.env.NEXT_PUBLIC_OCK_API_KEY, + [ENVIRONMENT.ENVIRONMENT]: process.env.NEXT_PUBLIC_VERCEL_ENV, + }; From b843b4f1775928d1f7dca69bc49c5dd70f1eea11 Mon Sep 17 00:00:00 2001 From: Alec Chen <93971719+0xAlec@users.noreply.github.com> Date: Thu, 22 Aug 2024 14:15:45 -0400 Subject: [PATCH 6/6] use `=== production` instead --- playground/nextjs-app-router/components/demo/Swap.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/playground/nextjs-app-router/components/demo/Swap.tsx b/playground/nextjs-app-router/components/demo/Swap.tsx index 0e4d126525..8cb6553683 100644 --- a/playground/nextjs-app-router/components/demo/Swap.tsx +++ b/playground/nextjs-app-router/components/demo/Swap.tsx @@ -97,7 +97,7 @@ function SwapComponent() { />