refactor: remove unnecessary providers

Blazity · Nov 13, 2023 · dbc385a · dbc385a
1 parent 2298d0a
commit dbc385a
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 34 deletions.
diff --git a/src/app/[lang]/article/[slug]/page.tsx b/src/app/[lang]/article/[slug]/page.tsx
@@ -1,6 +1,3 @@
-import { notFound } from "next/navigation"
-import { Metadata } from "next/types"
-import { NextIntlClientProvider } from "next-intl"
 import { HeroArticleCard } from "@/components/ArticleCard/HeroArticleCard"
 import { RecommendedArticles } from "@/components/RecommendedArticles/RecommendedArticles"
 import { RichText } from "@/components/RichText/RichText"
@@ -9,6 +6,8 @@ import { env } from "@/env.mjs"
 import { Locale } from "@/i18n/i18n"
 import { getArticleBySlug, getArticleMetadataBySlug } from "@/lib/client"
 import { getMatadataObj } from "@/utils/getMetadataObj"
+import { notFound } from "next/navigation"
+import { Metadata } from "next/types"
 
 type ArticlePageProps = { params: { slug: string; lang: Locale } }
 
@@ -56,9 +55,7 @@ export default async function Web({ params: { slug, lang } }: ArticlePageProps)
  <div className="mb-5 border-t py-5">
  <ShareOnSocial articleUrl={articleUrl} articleTitle={title} />
  </div>
- <NextIntlClientProvider locale={lang}>
- <RecommendedArticles id={article.id} />
- </NextIntlClientProvider>
+ <RecommendedArticles id={article.id} />
  </>
  )
 }
diff --git a/src/app/[lang]/layout.tsx b/src/app/[lang]/layout.tsx
@@ -1,13 +1,12 @@
-import { notFound } from "next/navigation"
-import { NextIntlClientProvider } from "next-intl"
-import { unstable_setRequestLocale } from "next-intl/server"
 import { Footer } from "@/components/Footer/Footer"
 import { Navigation } from "@/components/Navigation/Navigation"
 import { env } from "@/env.mjs"
 import { i18n, type Locale } from "@/i18n/i18n"
-import "@/styles/tailwind.css"
 import { setTranslations } from "@/i18n/setTranslations"
 import { getNavigation } from "@/lib/client"
+import "@/styles/tailwind.css"
+import { unstable_setRequestLocale } from "next-intl/server"
+import { notFound } from "next/navigation"
 import { GoogleAnalytics } from "../GoogleAnalytics"
 import Providers from "../Providers"
 
@@ -45,7 +44,7 @@ export default async function Layout({ children, params }: { children: React.Rea
  const { navigation, footer, logo } = await getNavigation(locale)
 
  return (
- <html lang={locale} style={{ scrollbarGutter: "stable" }}>
+ <html lang={locale}>
  <GoogleAnalytics />
  <Providers translations={translations} locale={locale}>
  <body className="flex min-h-screen flex-col items-center">

diff --git a/src/components/CategoryArticles/CategoryArticles.tsx b/src/components/CategoryArticles/CategoryArticles.tsx
@@ -1,9 +1,8 @@
 import { notFound } from "next/navigation"
-import { NextIntlClientProvider } from "next-intl"
 import { useLocale } from "@/i18n/i18n"
+import { getTranslations } from "@/i18n/setTranslations"
 import { listArticlesByCategory } from "@/lib/client"
 import { CategoryArticlesInfiniteDynamic } from "./CategoryArticlesInfiniteDynamic"
-import { getTranslations } from "@/i18n/setTranslations"
 
 export const CATEGORY_ARTICLES_PER_PAGE = 4
 
@@ -29,9 +28,7 @@ export async function CategoryArticles({ category }: CategoryArticlesProps) {
  <p className="text-xl font-bold">&quot;{category}&quot;</p>
  </div>
  <div className="mx-auto w-full">
- <NextIntlClientProvider locale={locale}>
- <CategoryArticlesInfiniteDynamic category={category} initialArticles={articles} />
- </NextIntlClientProvider>
+ <CategoryArticlesInfiniteDynamic category={category} initialArticles={articles} />
  </div>
  </section>
  )

diff --git a/src/components/Footer/Footer.tsx b/src/components/Footer/Footer.tsx
@@ -1,6 +1,5 @@
 import Image from "next/image"
 import Link from "next/link"
-import { NextIntlClientProvider } from "next-intl"
 import { useLocale } from "@/i18n/i18n"
 import FacebookIcon from "../../../public/icons/facebook.svg"
 import InstagramIcon from "../../../public/icons/instagram.svg"
@@ -67,9 +66,7 @@ export async function Footer({ footer, logoUrl }: FooterProps) {
  </nav>
  <div className="flex flex-col justify-between gap-10 md:max-w-[30%] lg:items-end lg:gap-3">
  <div className="w-fit lg:w-auto">
- <NextIntlClientProvider locale={locale}>
- <DynamicLangSelect />
- </NextIntlClientProvider>
+ <DynamicLangSelect />
  </div>
  {logoUrl && (
  <Link

diff --git a/src/components/RecentArticles/RecentArticles.tsx b/src/components/RecentArticles/RecentArticles.tsx
@@ -1,4 +1,3 @@
-import { NextIntlClientProvider } from "next-intl"
 import { useLocale } from "@/i18n/i18n"
 import { getRecentArticlesWithMain } from "@/lib/client"
 import { RecentArticlesInfiniteDynamic } from "./RecentArticlesInfiniteDynamic"
@@ -26,9 +25,7 @@ export async function RecentArticles({ title }: RecentArticlesProps) {
  tagsPosition="over"
  />
  </div>
- <NextIntlClientProvider locale={locale}>
- <RecentArticlesInfiniteDynamic initialArticles={initialArticles} />
- </NextIntlClientProvider>
+ <RecentArticlesInfiniteDynamic initialArticles={initialArticles} />
  </section>
  )
 }
diff --git a/src/components/RichText/RichText.tsx b/src/components/RichText/RichText.tsx
@@ -1,10 +1,8 @@
 /* eslint-disable jsx-a11y/heading-has-content */
+import { cn } from "@/utils/cn"
 import { RichText as HygraphRichText } from "@graphcms/rich-text-react-renderer"
 import { EmbedReferences, RichTextContent } from "@graphcms/rich-text-types"
 import Image from "next/image"
-import { NextIntlClientProvider } from "next-intl"
-import { useLocale } from "@/i18n/i18n"
-import { cn } from "@/utils/cn"
 import { CodeSnippetDynamic } from "../CodeSnippet/CodeSnippetDynamic"
 import { QuizDynamic } from "../Quiz/QuizDynamic"
 
@@ -17,8 +15,6 @@ export function RichText({
  references?: EmbedReferences
  pClassName?: string
 }) {
- const locale = useLocale()
-
  return (
  <HygraphRichText
  references={references}
@@ -50,11 +46,7 @@ export function RichText({
  ),
  embed: {
  Quiz: (props) => {
- return (
- <NextIntlClientProvider locale={locale}>
- <QuizDynamic id={props.id} />
- </NextIntlClientProvider>
- )
+ return props.id ? <QuizDynamic id={props.id} /> : <></>
  },
  },
  }}