Merge branch 'dev' into fix_tutorials_page

Author: JoeChenJ

.all-contributorsrc

@@ -12670,6 +12670,33 @@
       "contributions": [
         "content"
       ]
+    },
+    {
+      "login": "itzVarsha",
+      "name": "Varshitha",
+      "avatar_url": "https://avatars.githubusercontent.com/u/138134029?v=4",
+      "profile": "https://github.com/itzVarsha",
+      "contributions": [
+        "maintenance"
+      ]
+    },
+    {
+      "login": "alexandriaroberts",
+      "name": "Alexandria Roberts",
+      "avatar_url": "https://avatars.githubusercontent.com/u/31341867?v=4",
+      "profile": "https://alexandriaroberts.dev/",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "colinlyguo",
+      "name": "colin",
+      "avatar_url": "https://avatars.githubusercontent.com/u/102356659?v=4",
+      "profile": "https://github.com/colinlyguo",
+      "contributions": [
+        "content"
+      ]
     }
   ],
   "contributorsPerLine": 7,

.env.example

@@ -29,7 +29,7 @@ IS_PREVIEW_DEPLOY=false
 # Build pages only for the specified langs. Leave it empty to build all the langs
 # e.g. `en,fr` will only build English and French pages
 # Note: always include `en` as it is the default lang of the site
-BUILD_LOCALES=
+NEXT_PUBLIC_BUILD_LOCALES=
 
 # If resource constraints are being hit during builds, change LIMIT_CPUS to a
 # fixed number of CPUs (e.g. 2) to limit the demand during build time

.eslintrc.json

@@ -23,8 +23,6 @@
           // Packages. `react` related packages come first.
           // Also, put `react-icons` in sorting order not with `react`
           ["^react(?!-.)$", "^\\w", "^@\\w"],
-          // The Chakra theme directory if imported to story file or other places
-          ["^@/@chakra-ui"],
           // From the `types` directory.
           ["^@/lib/types", "^@/lib/interfaces"],
           // From the `components` directory.
@@ -65,17 +63,6 @@
         "varsIgnorePattern": "^_$"
       }
     ],
-    "unused-imports/no-unused-imports-ts": "warn",
-    "no-restricted-imports": [
-      "warn",
-      {
-        "paths": [
-          {
-            "name": "react-i18next",
-            "message": "Please use next-i18next instead of react-i18next."
-          }
-        ]
-      }
-    ]
+    "unused-imports/no-unused-imports-ts": "warn"
   }
 }

.github/ISSUE_TEMPLATE/suggest_quiz.yaml

@@ -1,5 +1,5 @@
 name: Suggest quiz
-description: Add, update, delete questions for a quiz on ethereum.osg
+description: Add, update, delete questions for a quiz on ethereum.org
 title: Add/Update/Delete quiz question
 labels: ["feature ✨", "quiz 📚"]
 body:

.github/labeler.yml

@@ -16,7 +16,6 @@
 "config ⚙️":
   - i18n.config.json
   - next.config.js
-  - next-i18next.config,js
   - next-sitemap.config.js
   - tsconfig.json
   - .nvmrc

.github/workflows/chromatic.yml

@@ -15,7 +15,6 @@ on:
       - "src/components/**/*"
       - "src/pages/**/*"
       - "src/layouts/**/*"
-      - "src/@chakra-ui/**/*"
       - ".storybook/**/*"
       - "tailwind.config.ts"
       - "src/styles/**/*"

.storybook/ChakraDecorator.tsx

@@ -1,5 +1,4 @@
 import TsconfigPathsPlugin from "tsconfig-paths-webpack-plugin"
-import { propNames } from "@chakra-ui/react"
 import type { StorybookConfig } from "@storybook/nextjs"
 
 /**
@@ -17,8 +16,8 @@ import type { StorybookConfig } from "@storybook/nextjs"
 const config: StorybookConfig = {
   stories: [
     "../src/components/**/*.stories.{ts,tsx}",
-    "../src/@chakra-ui/stories/*.stories.tsx",
     "../src/layouts/stories/*.stories.tsx",
+    "../src/styles/*.stories.tsx",
   ],
   addons: [
     "@storybook/addon-links",
@@ -29,9 +28,9 @@ const config: StorybookConfig = {
       },
     },
     "@storybook/addon-interactions",
-    "storybook-react-i18next",
     "@storybook/addon-themes",
     "@chromatic-com/storybook",
+    "storybook-next-intl",
   ],
   staticDirs: ["../public"],
   framework: {
@@ -41,11 +40,6 @@ const config: StorybookConfig = {
   docs: {
     autodocs: "tag",
   },
-  refs: {
-    "@chakra-ui/react": {
-      disable: true,
-    },
-  },
   webpackFinal: async (config) => {
     config.module = config.module || {}
     config.module.rules = config.module.rules || []
@@ -79,23 +73,6 @@ const config: StorybookConfig = {
   typescript: {
     reactDocgenTypescriptOptions: {
       shouldExtractLiteralValuesFromEnum: true,
-      /**
-       * For handling bloated controls table of Chakra Props
-       *
-       * https://github.com/chakra-ui/chakra-ui/issues/2009#issuecomment-852793946
-       */
-      propFilter: (prop) => {
-        const excludedPropNames = propNames.concat([
-          "as",
-          "apply",
-          "sx",
-          "__css",
-        ])
-        const isStyledSystemProp = excludedPropNames.includes(prop.name)
-        const isHTMLElementProp =
-          prop.parent?.fileName.includes("node_modules") ?? false
-        return !(isStyledSystemProp || isHTMLElementProp)
-      },
     },
 
     reactDocgen: "react-docgen-typescript",

.storybook/main.ts

@@ -1,6 +1,6 @@
 import pickBy from "lodash/pickBy"
 
-import { baseLocales } from "./i18next"
+import { baseLocales } from "./next-intl"
 import { breakpointSet } from "./preview"
 
 export const viewportModes = breakpointSet.reduce<{

.storybook/modes.ts

@@ -1,7 +1,3 @@
-import i18n, { Resource } from "i18next"
-// eslint-disable-next-line no-restricted-imports
-import { initReactI18next } from "react-i18next"
-
 export const baseLocales = {
   en: { title: "English", left: "En" },
   zh: { title: "中国人", left: "Zh" },
@@ -32,7 +28,7 @@ const supportedLngs = Object.keys(baseLocales)
 /**
  * Taking the ns array and generating those files for each language available.
  */
-const resources: Resource = ns.reduce((acc, n) => {
+const messagesByLocale = ns.reduce((acc, n) => {
   supportedLngs.forEach((lng) => {
     if (!acc[lng]) acc[lng] = {}
 
@@ -57,16 +53,18 @@ const resources: Resource = ns.reduce((acc, n) => {
 
   return acc
 }, {})
-console.log("🚀 ~ constresources:Resource=ns.reduce ~ resources:", resources)
+console.log(
+  "🚀 ~ constresources:Resource=ns.reduce ~ resources:",
+  messagesByLocale
+)
 
-i18n.use(initReactI18next).init({
-  debug: true,
-  fallbackLng: "en",
-  interpolation: { escapeValue: false },
-  react: { useSuspense: false },
-  supportedLngs,
-  resources,
-  defaultNS: "common",
-})
+const nextIntl = {
+  defaultLocale: "en",
+  messagesByLocale,
+  getMessageFallback: ({ key }: { key: string }) => {
+    const keyOnly = key.split(".").pop()
+    return keyOnly || key
+  },
+}
 
-export default i18n
+export default nextIntl