Skip to content

Commit 6275001

Browse files
corwintinescorwintines
committed
move providers
1 parent aed6a4b commit 6275001

File tree

2 files changed

+69
-66
lines changed

2 files changed

+69
-66
lines changed

‎src/pages/[locale]/start/index.tsx

Lines changed: 60 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
11
import { GetStaticProps } from "next"
2+
import dynamic from "next/dynamic"
3+
import { useRouter } from "next/router"
4+
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
25

36
import { BasePageProps, Lang } from "@/lib/types"
47

@@ -19,6 +22,13 @@ import loadNamespaces from "@/i18n/loadNamespaces"
1922
import HeroImage from "@/public/images/heroes/developers-hub-hero.jpg"
2023
import ManDogeImage from "@/public/images/start-with-ethereum/man-doge-playing.png"
2124

25+
// Dynamically import Wagmi/RainbowKit components
26+
const WalletProviders = dynamic(() => import("@/components/WalletProviders"), {
27+
ssr: false,
28+
})
29+
30+
const queryClient = new QueryClient()
31+
2232
export async function getStaticPaths() {
2333
return {
2434
paths: LOCALES_CODES.map((locale) => ({ params: { locale } })),
@@ -54,51 +64,59 @@ export const getStaticProps = (async ({ params }) => {
5464
}) satisfies GetStaticProps<BasePageProps>
5565

5666
const StartWithCryptoPage = () => {
67+
const router = useRouter()
68+
5769
return (
58-
<MainArticle className="flex w-full flex-col items-center overflow-x-hidden">
59-
<PageMetadata title={""} description={""} image="" />
60-
61-
<div className="mb-16 h-[240px] w-full md:h-[380px] lg:h-[398px]">
62-
<Image
63-
src={HeroImage}
64-
alt={"Start with crypto"}
65-
sizes="(max-width: 1504px) 100vw, 1504px"
66-
className="h-full w-full object-cover"
67-
priority
68-
/>
69-
</div>
70-
71-
<div className="mb-36 flex flex-col gap-12 overflow-x-hidden px-8">
72-
<div className="mx-auto flex max-w-[1000px] flex-col items-center gap-4 text-center">
73-
<h1>Get started with Ethereum</h1>
74-
<p>
75-
Ethereum is so much more than just trading tokens on an exchange.
76-
Step into the new world yourself and learn all the basics in just
77-
few steps.
78-
</p>
79-
</div>
80-
81-
<div id="start-with-ethereum-flow" className="flex flex-col gap-12">
82-
<StartWithEthereumFlow />
83-
</div>
84-
85-
<div className="flex w-full flex-col gap-12 rounded-2xl border border-accent-c/10 bg-gradient-to-t from-accent-c/10 from-20% to-accent-c/5 to-60% px-12 py-16 md:flex-row dark:from-accent-c/20 dark:to-accent-c/10">
86-
<div className="flex flex-1 flex-col gap-8">
87-
<h2 className="">Do you know anyone who needs help to onboard?</h2>
88-
<p>
89-
Billions can’t open bank accounts or freely use their money.
90-
Ethereum’s financial system is always open and unbiased.
91-
</p>
92-
<div className="flex w-full md:w-auto">
93-
<ShareModal />
94-
</div>
70+
<QueryClientProvider client={queryClient}>
71+
<WalletProviders locale={router.query.locale as string}>
72+
<MainArticle className="flex w-full flex-col items-center overflow-x-hidden">
73+
<PageMetadata title={""} description={""} image="" />
74+
75+
<div className="mb-16 h-[240px] w-full md:h-[380px] lg:h-[398px]">
76+
<Image
77+
src={HeroImage}
78+
alt={"Start with crypto"}
79+
sizes="(max-width: 1504px) 100vw, 1504px"
80+
className="h-full w-full object-cover"
81+
priority
82+
/>
9583
</div>
96-
<div className="flex max-w-[450px] flex-col items-center justify-center">
97-
<Image src={ManDogeImage} alt="Man Doge" />
84+
85+
<div className="mb-36 flex flex-col gap-12 overflow-x-hidden px-8">
86+
<div className="mx-auto flex max-w-[1000px] flex-col items-center gap-4 text-center">
87+
<h1>Get started with Ethereum</h1>
88+
<p>
89+
Ethereum is so much more than just trading tokens on an
90+
exchange. Step into the new world yourself and learn all the
91+
basics in just few steps.
92+
</p>
93+
</div>
94+
95+
<div id="start-with-ethereum-flow" className="flex flex-col gap-12">
96+
<StartWithEthereumFlow />
97+
</div>
98+
99+
<div className="flex w-full flex-col gap-12 rounded-2xl border border-accent-c/10 bg-gradient-to-t from-accent-c/10 from-20% to-accent-c/5 to-60% px-12 py-16 md:flex-row dark:from-accent-c/20 dark:to-accent-c/10">
100+
<div className="flex flex-1 flex-col gap-8">
101+
<h2 className="">
102+
Do you know anyone who needs help to onboard?
103+
</h2>
104+
<p>
105+
Billions can’t open bank accounts or freely use their money.
106+
Ethereum’s financial system is always open and unbiased.
107+
</p>
108+
<div className="flex w-full md:w-auto">
109+
<ShareModal />
110+
</div>
111+
</div>
112+
<div className="flex max-w-[450px] flex-col items-center justify-center">
113+
<Image src={ManDogeImage} alt="Man Doge" />
114+
</div>
115+
</div>
98116
</div>
99-
</div>
100-
</div>
101-
</MainArticle>
117+
</MainArticle>
118+
</WalletProviders>
119+
</QueryClientProvider>
102120
)
103121
}
104122

‎src/pages/_app.tsx

Lines changed: 9 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
import { useEffect } from "react"
2-
import dynamic from "next/dynamic"
32
import { useRouter } from "next/router"
43
import { NextIntlClientProvider } from "next-intl"
54
import { TooltipProvider } from "@radix-ui/react-tooltip"
65
import { init } from "@socialgouv/matomo-next"
7-
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
86

97
import { AppPropsWithLayout } from "@/lib/types"
108

@@ -17,13 +15,6 @@ import "@/styles/global.css"
1715
import { FeedbackWidgetProvider } from "@/contexts/FeedbackWidgetContext"
1816
import { BaseLayout } from "@/layouts/BaseLayout"
1917

20-
// Dynamically import Wagmi/RainbowKit components
21-
const WalletProviders = dynamic(() => import("@/components/WalletProviders"), {
22-
ssr: false,
23-
})
24-
25-
const queryClient = new QueryClient()
26-
2718
const App = ({ Component, pageProps }: AppPropsWithLayout) => {
2819
const router = useRouter()
2920

@@ -55,21 +46,15 @@ const App = ({ Component, pageProps }: AppPropsWithLayout) => {
5546
>
5647
<ThemeProvider>
5748
<TooltipProvider>
58-
<QueryClientProvider client={queryClient}>
59-
<WalletProviders locale={router.query.locale as string}>
60-
<FeedbackWidgetProvider>
61-
<BaseLayout
62-
// contentIsOutdated={!!pageProps.frontmatter?.isOutdated}
63-
// contentNotTranslated={pageProps.contentNotTranslated}
64-
lastDeployLocaleTimestamp={
65-
pageProps.lastDeployLocaleTimestamp
66-
}
67-
>
68-
{getLayout(<Component {...pageProps} />)}
69-
</BaseLayout>
70-
</FeedbackWidgetProvider>
71-
</WalletProviders>
72-
</QueryClientProvider>
49+
<FeedbackWidgetProvider>
50+
<BaseLayout
51+
// contentIsOutdated={!!pageProps.frontmatter?.isOutdated}
52+
// contentNotTranslated={pageProps.contentNotTranslated}
53+
lastDeployLocaleTimestamp={pageProps.lastDeployLocaleTimestamp}
54+
>
55+
{getLayout(<Component {...pageProps} />)}
56+
</BaseLayout>
57+
</FeedbackWidgetProvider>
7358
</TooltipProvider>
7459
</ThemeProvider>
7560
</NextIntlClientProvider>

0 commit comments

Comments
 (0)