Merge pull request #15181 from ethereum/staging

Deploy v10.0.0

Author: corwintines

.github/CODEOWNERS

@@ -8,5 +8,5 @@
 *       @wackerow @corwintines @pettinarip @minimalsm
 
 # Owners of specific files
-/src/data/consensus-bounty-hunters.json @djrtwo @asanso @fredriksvantes
+/src/data/consensus-bounty-hunters.json @asanso @fredriksvantes
 /src/data/wallets/new-to-crypto.ts @konopkja @minimalsm

.github/ISSUE_TEMPLATE/suggest_resource.yaml

@@ -0,0 +1,63 @@
+name: Suggest a resource
+description: Suggest a new resource to list on ethereum.org/resources
+title: Suggest a resource
+labels: ["resource 📚"]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before suggesting a resource, make sure you've read [our listing policy](https://www.ethereum.org/en/contributing/adding-resources/).
+  - type: markdown
+    attributes:
+      value: Only continue with the issue if your resource meets the criteria listed there.
+  - type: markdown
+    attributes:
+      value: If it does, complete the following information which we need to accurately list the resource.
+  - type: markdown
+    id: resource_info
+    attributes:
+      value: "## Resource info"
+  - type: input
+    id: resource_name
+    attributes:
+      label: Name
+      description: Please provide the official name of the resource
+    validations:
+      required: true
+  - type: input
+    id: resource_url
+    attributes:
+      label: Resource URL
+      description: Please provide a URL to the resource
+    validations:
+      required: true
+  - type: textarea
+    id: resource_description
+    attributes:
+      label: Description
+      description: Please provide a short 1-2 sentence description of the resource
+    validations:
+      required: true
+  - type: textarea
+    id: resource_logo
+    attributes:
+      label: Logo
+      description: |
+        Please provide an SVG or transparent PNG
+        Tip: You can attach images by clicking this area to highlight it and then dragging files in.
+  - type: input
+    id: resource_category
+    attributes:
+      label: Category
+      description: Please specify a best fit to categorize the resource (e.g., DeFi, NFT, Scaling, etc.)
+  - type: checkboxes
+    id: resource_work_on
+    attributes:
+      label: Would you like to work on this issue?
+      options:
+        - label: "Yes"
+          required: false
+        - label: "No"
+          required: false
+    validations:
+      required: true

app/[locale]/[...slug]/page.tsx

@@ -0,0 +1,133 @@
+import pick from "lodash.pick"
+import { notFound } from "next/navigation"
+import { getMessages, setRequestLocale } from "next-intl/server"
+
+import I18nProvider from "@/components/I18nProvider"
+import mdComponents from "@/components/MdComponents"
+
+import { dataLoader } from "@/lib/utils/data/dataLoader"
+import { dateToString } from "@/lib/utils/date"
+import { getPostSlugs } from "@/lib/utils/md"
+import { getRequiredNamespacesForPage } from "@/lib/utils/translations"
+
+import { LOCALES_CODES } from "@/lib/constants"
+
+import { componentsMapping, layoutMapping } from "@/layouts"
+import { fetchGFIs } from "@/lib/api/fetchGFIs"
+import { getPageData } from "@/lib/md/data"
+import { getMdMetadata } from "@/lib/md/metadata"
+
+const loadData = dataLoader([["gfissues", fetchGFIs]])
+
+function getLayoutFromSlug(slug: string) {
+  if (slug.includes("developers/docs")) {
+    return "docs"
+  }
+
+  if (slug.includes("developers/tutorials")) {
+    return "tutorial"
+  }
+
+  return "static"
+}
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{ locale: string; slug: string[] }>
+}) {
+  const { locale, slug: slugArray } = await params
+
+  // Check if this specific path is in our valid paths
+  const validPaths = await generateStaticParams()
+  const isValidPath = validPaths.some(
+    (path) =>
+      path.locale === locale && path.slug.join("/") === slugArray.join("/")
+  )
+
+  if (!isValidPath) {
+    notFound()
+  }
+
+  // Enable static rendering
+  setRequestLocale(locale)
+
+  const [gfissues] = await loadData()
+
+  const slug = slugArray.join("/")
+
+  const {
+    content,
+    frontmatter,
+    tocItems,
+    lastEditLocaleTimestamp,
+    isTranslated,
+    contributors,
+  } = await getPageData({
+    locale,
+    slug,
+    // TODO: Address component typing error here (flip `FC` types to prop object types)
+    // @ts-expect-error Incompatible component function signatures
+    components: { ...mdComponents, ...componentsMapping },
+    scope: {
+      gfissues,
+    },
+  })
+
+  // Determine the actual layout after we have the frontmatter
+  const layout = frontmatter.template || getLayoutFromSlug(slug)
+  const Layout = layoutMapping[layout]
+
+  // If the page has a published date, format it
+  if ("published" in frontmatter) {
+    frontmatter.published = dateToString(frontmatter.published)
+  }
+
+  // Get i18n messages
+  const allMessages = await getMessages({ locale })
+  const requiredNamespaces = getRequiredNamespacesForPage(slug, layout)
+  const messages = pick(allMessages, requiredNamespaces)
+
+  return (
+    <I18nProvider locale={locale} messages={messages}>
+      <Layout
+        slug={slug}
+        frontmatter={frontmatter}
+        tocItems={tocItems}
+        lastEditLocaleTimestamp={lastEditLocaleTimestamp}
+        contentNotTranslated={!isTranslated}
+        contributors={contributors}
+        // TODO: Remove this once we have a real timeToRead value
+        timeToRead={2}
+      >
+        {content}
+      </Layout>
+    </I18nProvider>
+  )
+}
+
+export async function generateStaticParams() {
+  const slugs = await getPostSlugs("/")
+
+  return LOCALES_CODES.flatMap((locale) =>
+    slugs.map((slug) => ({
+      slug: slug.split("/").slice(1),
+      locale,
+    }))
+  )
+}
+
+export const dynamicParams = false
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ locale: string; slug: string[] }>
+}) {
+  const { locale, slug } = await params
+
+  return await getMdMetadata({
+    locale,
+    slug,
+  })
+}

app/[locale]/error.tsx

@@ -0,0 +1,32 @@
+"use client"
+
+import { useEffect } from "react"
+
+import MainArticle from "@/components/MainArticle"
+import Translation from "@/components/Translation"
+import { Button } from "@/components/ui/buttons/Button"
+
+export default function Error({
+  error,
+  reset,
+}: {
+  error: Error
+  reset: () => void
+}) {
+  useEffect(() => {
+    // TODO: log the error to an error reporting service
+    console.error(error)
+  }, [error])
+
+  return (
+    <div className="mx-auto mb-0 mt-16 flex w-full flex-col items-center">
+      <MainArticle className="my-8 w-full space-y-8 px-8 py-4">
+        <h1>
+          <Translation id="we-couldnt-find-that-page" />
+        </h1>
+        <p>Something went wrong.</p>
+        <Button onClick={() => reset()}>Try again</Button>
+      </MainArticle>
+    </div>
+  )
+}

app/[locale]/layout.tsx

@@ -0,0 +1,51 @@
+import pick from "lodash.pick"
+import { notFound } from "next/navigation"
+import { getMessages, setRequestLocale } from "next-intl/server"
+
+import { Lang } from "@/lib/types"
+
+import { getLastDeployDate } from "@/lib/utils/getLastDeployDate"
+import { getLocaleTimestamp } from "@/lib/utils/time"
+
+import Providers from "./providers"
+
+import "@/styles/global.css"
+
+import { routing } from "@/i18n/routing"
+import { BaseLayout } from "@/layouts/BaseLayout"
+
+export default async function LocaleLayout({
+  children,
+  params: { locale },
+}: {
+  children: React.ReactNode
+  params: { locale: string }
+}) {
+  if (!routing.locales.includes(locale)) {
+    notFound()
+  }
+
+  // Enable static rendering
+  setRequestLocale(locale)
+
+  const allMessages = await getMessages({ locale })
+  const messages = pick(allMessages, "common")
+
+  const lastDeployDate = getLastDeployDate()
+  const lastDeployLocaleTimestamp = getLocaleTimestamp(
+    locale as Lang,
+    lastDeployDate
+  )
+
+  return (
+    <html lang={locale} suppressHydrationWarning>
+      <body>
+        <Providers locale={locale} messages={messages}>
+          <BaseLayout lastDeployLocaleTimestamp={lastDeployLocaleTimestamp}>
+            {children}
+          </BaseLayout>
+        </Providers>
+      </body>
+    </html>
+  )
+}

app/[locale]/not-found.tsx

@@ -0,0 +1,5 @@
+import NotFoundPage from "@/components/NotFoundPage"
+
+export default function NotFound() {
+  return <NotFoundPage />
+}

app/[locale]/providers.tsx

@@ -0,0 +1,29 @@
+"use client"
+
+import { type AbstractIntlMessages } from "next-intl"
+
+import I18nProvider from "@/components/I18nProvider"
+import ThemeProvider from "@/components/ThemeProvider"
+import { TooltipProvider } from "@/components/ui/tooltip"
+
+import { FeedbackWidgetProvider } from "@/contexts/FeedbackWidgetContext"
+
+export default function Providers({
+  children,
+  locale,
+  messages,
+}: {
+  children: React.ReactNode
+  locale: string
+  messages: AbstractIntlMessages
+}) {
+  return (
+    <I18nProvider locale={locale} messages={messages}>
+      <ThemeProvider>
+        <FeedbackWidgetProvider>
+          <TooltipProvider>{children}</TooltipProvider>
+        </FeedbackWidgetProvider>
+      </ThemeProvider>
+    </I18nProvider>
+  )
+}

app/layout.tsx

@@ -0,0 +1,13 @@
+import { ReactNode } from "react"
+
+import "@/styles/global.css"
+
+type Props = {
+  children: ReactNode
+}
+
+// Since we have a root `not-found.tsx` page, a layout file
+// is required, even if it's just passing children through.
+export default function RootLayout({ children }: Props) {
+  return children
+}

app/not-found.tsx

@@ -0,0 +1,15 @@
+"use client"
+
+import Error from "next/error"
+
+import { DEFAULT_LOCALE } from "@/lib/constants"
+
+export default function GlobalNotFound() {
+  return (
+    <html lang={DEFAULT_LOCALE}>
+      <body>
+        <Error statusCode={404} />
+      </body>
+    </html>
+  )
+}

app/page.tsx

@@ -0,0 +1,7 @@
+import { redirect } from "next/navigation"
+
+import { routing } from "@/i18n/routing"
+
+export default function Page() {
+  redirect(routing.defaultLocale)
+}

docs/applying-storybook.md

@@ -229,4 +229,4 @@ parameters: {
 }
 ```
 
-> 🚨 NOTE: This will be notated ahead of time by the team which stories should not receive snapshots.
+> 🚨 NOTE: This will be noted ahead of time by the team which stories should not receive snapshots.

docs/best-practices.md

@@ -8,7 +8,7 @@ How to prepare your content for translation depends on whether you're working on
 
 **- MDX pages (`public/content/page/`)**
 
-Markdown will be translated as whole pages of content, so no specific action is required. Simply create a new folder within `public/content/` with the name of the page, then place index markdown file (ie. `index.md`) within the new folder.
+Markdown will be translated as whole pages of content, so no specific action is required. Simply create a new folder within `public/content/` with the name of the page, then place an index markdown file (ie. `index.md`) within the new folder.
 
 **- React component page**
 

docs/header-ids.md

@@ -36,7 +36,7 @@ See a live example on ethereum.org: [https://ethereum.org/en/developers/docs/blo
 
 ### English content
 
-These should be created for header on every new English markdown document.
+These should be created for header in every new English markdown document.
 
 ### Translated content
 

docs/translation-program.md

@@ -2,6 +2,6 @@
 
 _The Translation Program is an initiative to translate ethereum.org into different languages and make the website accessible to people from all over the world._
 
-If you are looking to get involved as a translator, you can [join our project in Crowdin](https://crowdin.com/project/ethereum-org/) and start translating the website to your language immediately.
+If you are looking to get involved as a translator, you can [join our project in Crowdin](https://crowdin.com/project/ethereum-org/) and start translating the website into your language immediately.
 
 To get more information about the program, learn how to use Crowdin, check on the progress or find some useful tools for translators, please visit the [Translation Program page](https://ethereum.org/en/contributing/translation-program/).