chore(i18n): remove legacy key + rename

TRANSLATION.md

@@ -44,7 +44,7 @@ Fill the language object with the following fields:
 | `hrefLang`   | The language code in [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) format         | `fr`         |
 | `enabled`    | If the language is enabled or not                                                                      | `true`       |
 
-Please also add the new locale file to the locales folder `/i18n/locales` and import it in the `/i18n/locales/index.mjs` file.
+Please also add the new locale file to the locales folder `/i18n/locales`.
 
 ## Adding new Translation Keys
 
@@ -54,7 +54,7 @@ If you're making a new Component and adding Translation Keys for your Component,
 - The translation keys should have the prefix as the canonical path of your Component. If your Component is `components/Common/MyComponent` the prefix key should be `components.common.myComponent`
   - The Translation Key suffix should be easy to understand and semantic. For example, if the key is about "the text of a button that when interacted it copies content to the clipboard", the suffix should probably be `copyButton.title`. The final translation key would be `components.common.myComponent.copyButton.title`
   - Translation Keys should be in Camel Case only.
-  - The values of each Translation Key should follow the [ICU Message Syntax](https://formatjs.io/docs/core-concepts/icu-syntax/)
+  - The values of each Translation Key should follow the [ICU Message Syntax](https://next-intl-docs.vercel.app/docs/usage/messages#rendering-icu-messages)
 - All new Translation keys should be added at the bottom of the `i18n/locales/en.json` file. Since this makes it easier for Translators to notice that there are new Translation keys to be translated.
 
 #### Notes about Translation Keys
@@ -77,7 +77,7 @@ It's important to mention that we use nested translation keys within the Locale
 
 ### Translations and Unit Testing
 
-Translation Keys should not be translated during Unit Testing. If your Component uses, for example `usTranslations`, you should provide the `<NextIntlProvider>` surrounding your `testing-library` render logic, or you can create a wrapper for your test. Note that you should not import the English messages to your Unit Test as:
+Translation Keys should not be translated during Unit Testing. If your Component uses, for example `useTranslations`, you should provide the `<NextIntlProvider>` surrounding your `testing-library` render logic, or you can create a wrapper for your test. Note that you should not import the English messages to your Unit Test as:
 
 - Unit Testing should test a Component functionality.
 - Unit Tests should not rely on text, titles, or string bags, as these texts will change arbitrarily and make the test suite fail.

components/Common/ThemeToggle/index.tsx

@@ -11,7 +11,7 @@ type ThemeToggleProps = {
 const ThemeToggle: FC<ThemeToggleProps> = ({ onClick = () => {} }) => {
   const t = useTranslations();
 
-  const ariaLabel = t('components.header.buttons.toggleTheme');
+  const ariaLabel = t('components.common.themeToggle.label');
 
   return (
     <button

components/Containers/Footer/index.tsx

@@ -7,7 +7,7 @@ import LinkedIn from '@/components/Icons/Social/LinkedIn';
 import Mastodon from '@/components/Icons/Social/Mastodon';
 import Slack from '@/components/Icons/Social/Slack';
 import Twitter from '@/components/Icons/Social/Twitter';
-import { siteConfig } from '@/next.json.mjs';
+import { siteNavigation } from '@/next.json.mjs';
 
 import styles from './index.module.css';
 
@@ -22,12 +22,12 @@ const footerSocialIcons: Record<string, React.FC<SVGProps<SVGSVGElement>>> = {
 const Footer: FC = () => {
   const t = useTranslations();
 
-  const openJSlink = siteConfig.footerLinks.at(-1)!;
+  const openJSlink = siteNavigation.footerLinks.at(-1)!;
 
   return (
     <footer className={styles.footer}>
       <div className={styles.sectionPrimary}>
-        {siteConfig.footerLinks.slice(0, -1).map(item => (
+        {siteNavigation.footerLinks.slice(0, -1).map(item => (
           <NavItem type="footer" href={item.link} key={item.link}>
             {t(item.text)}
           </NavItem>
@@ -40,7 +40,7 @@ const Footer: FC = () => {
         </NavItem>
 
         <div className={styles.social}>
-          {siteConfig.socialLinks.map(link => {
+          {siteNavigation.socialLinks.map(link => {
             const SocialIcon = footerSocialIcons[link.icon];
 
             return (

i18n/locales/en.json

@@ -1,28 +1,26 @@
 {
   "components": {
-    "footer": {
-      "links": {
-        "trademarkPolicy": "Trademark Policy",
-        "privacyPolicy": "Privacy Policy",
-        "codeOfConduct": "Code of Conduct",
-        "security": "Security Policy",
-        "openJS": "OpenJS Foundation"
-      }
-    },
-    "header": {
-      "links": {
-        "about": "About",
-        "download": "Download",
-        "docs": "Docs",
-        "guides": "Guides",
-        "learn": "Learn",
-        "security": "Security",
-        "certification": "Certification",
-        "blog": "Blog"
+    "containers": {
+      "footer": {
+        "links": {
+          "trademarkPolicy": "Trademark Policy",
+          "privacyPolicy": "Privacy Policy",
+          "codeOfConduct": "Code of Conduct",
+          "security": "Security Policy",
+          "openJS": "OpenJS Foundation"
+        }
       },
-      "buttons": {
-        "toggleLanguage": "Toggle Language",
-        "toggleTheme": "Toggle dark/light mode"
+      "navBar": {
+        "links": {
+          "about": "About",
+          "download": "Download",
+          "docs": "Docs",
+          "guides": "Guides",
+          "learn": "Learn",
+          "security": "Security",
+          "certification": "Certification",
+          "blog": "Blog"
+        }
       }
     },
     "navigation": {
@@ -170,6 +168,9 @@
       },
       "languageDropdown": {
         "label": "Choose Language"
+      },
+      "themeToggle": {
+        "label": "Toggle Dark Mode"
       }
     },
     "mdx": {
@@ -188,15 +189,6 @@
       "viewAs": "View as",
       "tableOfContents": "Table of Contents"
     },
-    "home": {
-      "homeDownloadButton": {
-        "download": "{version} {isLts, select, true {LTS} other {Current}}",
-        "tagline": "{isLts, select, true {Recommended For Most Users} other {Latest Features}}",
-        "changelog": "Changelog",
-        "otherDownloads": "Other Downloads",
-        "apiDocs": "API Docs"
-      }
-    },
     "downloads": {
       "changelogModal": {
         "startContributing": "Start Contributing"
@@ -289,11 +281,5 @@
         "communityWarning": "Package managers and their installation scripts are not maintained by the Node.js project."
       }
     }
-  },
-  "pages": {
-    "404": {
-      "title": "404: Page could not be found",
-      "description": "ENOENT: no such file or directory"
-    }
   }
 }

navigation.json

@@ -2,29 +2,78 @@
   "topNavigation": {
     "learn": {
       "link": "/learn",
-      "label": "components.header.links.learn"
+      "label": "components.containers.navBar.links.learn"
     },
     "about": {
       "link": "/about",
-      "label": "components.header.links.about"
+      "label": "components.containers.navBar.links.about"
     },
     "download": {
       "link": "/download",
-      "label": "components.header.links.download"
+      "label": "components.containers.navBar.links.download"
     },
     "blog": {
       "link": "/blog",
-      "label": "components.header.links.blog"
+      "label": "components.containers.navBar.links.blog"
     },
     "docs": {
       "link": "https://nodejs.org/docs/latest/api/",
-      "label": "components.header.links.docs"
+      "label": "components.containers.navBar.links.docs"
     },
     "certification": {
       "link": "https://openjsf.org/certification",
-      "label": "components.header.links.certification"
+      "label": "components.containers.navBar.links.certification"
     }
   },
+  "footerLinks": [
+    {
+      "link": "https://trademark-policy.openjsf.org/",
+      "text": "components.containers.footer.links.trademarkPolicy"
+    },
+    {
+      "link": "https://privacy-policy.openjsf.org/",
+      "text": "components.containers.footer.links.privacyPolicy"
+    },
+    {
+      "link": "https://github.com/openjs-foundation/cross-project-council/blob/main/CODE_OF_CONDUCT.md",
+      "text": "components.containers.footer.links.codeOfConduct"
+    },
+    {
+      "link": "https://github.com/nodejs/node/blob/HEAD/SECURITY.md#security",
+      "text": "components.containers.footer.links.security"
+    },
+    {
+      "link": "https://openjsf.org/",
+      "text": "components.containers.footer.links.openJS"
+    }
+  ],
+  "socialLinks": [
+    {
+      "icon": "github",
+      "link": "https://github.com/nodejs/node",
+      "alt": "GitHub"
+    },
+    {
+      "icon": "mastodon",
+      "link": "https://social.lfx.dev/@nodejs",
+      "alt": "Mastodon"
+    },
+    {
+      "icon": "twitter",
+      "link": "https://twitter.com/nodejs",
+      "alt": "Twitter"
+    },
+    {
+      "icon": "slack",
+      "link": "https://openjs-foundation.slack.com/join/shared_invite/zt-238w9sb83-Qk9NcsrEMomq94Y~3gW8EQ#/shared-invite/email",
+      "alt": "Slack"
+    },
+    {
+      "icon": "linkedin",
+      "link": "https://www.linkedin.com/company/node-js",
+      "alt": "LinkedIn"
+    }
+  ],
   "sideNavigation": {
     "about": {
       "label": "components.navigation.about.links.about",

site.json

@@ -2,8 +2,7 @@
   "title": "Node.js",
   "description": "Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.",
   "favicon": "/static/images/favicons/favicon.png",
-  "lightAccentColor": "#FFFFFF",
-  "darkAccentColor": "#0D121C",
+  "accentColor": "#333",
   "twitter": {
     "username": "@nodejs",
     "card": "summary",
@@ -35,54 +34,5 @@
       "link": "https://nodejs.org/en/blog/vulnerability/february-2024-security-releases/"
     }
   },
-  "websiteBadges": {},
-  "footerLinks": [
-    {
-      "link": "https://trademark-policy.openjsf.org/",
-      "text": "components.footer.links.trademarkPolicy"
-    },
-    {
-      "link": "https://privacy-policy.openjsf.org/",
-      "text": "components.footer.links.privacyPolicy"
-    },
-    {
-      "link": "https://github.com/openjs-foundation/cross-project-council/blob/main/CODE_OF_CONDUCT.md",
-      "text": "components.footer.links.codeOfConduct"
-    },
-    {
-      "link": "https://github.com/nodejs/node/blob/HEAD/SECURITY.md#security",
-      "text": "components.footer.links.security"
-    },
-    {
-      "link": "https://openjsf.org/",
-      "text": "components.footer.links.openJS"
-    }
-  ],
-  "socialLinks": [
-    {
-      "icon": "github",
-      "link": "https://github.com/nodejs/node",
-      "alt": "GitHub"
-    },
-    {
-      "icon": "mastodon",
-      "link": "https://social.lfx.dev/@nodejs",
-      "alt": "Mastodon"
-    },
-    {
-      "icon": "twitter",
-      "link": "https://twitter.com/nodejs",
-      "alt": "Twitter"
-    },
-    {
-      "icon": "slack",
-      "link": "https://openjs-foundation.slack.com/join/shared_invite/zt-238w9sb83-Qk9NcsrEMomq94Y~3gW8EQ#/shared-invite/email",
-      "alt": "Slack"
-    },
-    {
-      "icon": "linkedin",
-      "link": "https://www.linkedin.com/company/node-js",
-      "alt": "LinkedIn"
-    }
-  ]
+  "websiteBadges": {}
 }

types/config.ts

@@ -13,17 +13,6 @@ export interface OGConfig {
   imgHeight: string;
 }
 
-export interface FooterConfig {
-  text: string;
-  link: string;
-}
-
-export interface SocialConfig {
-  icon: string;
-  link: string;
-  alt?: string;
-}
-
 export interface SiteConfig {
   title: string;
   description: string;
@@ -36,6 +25,4 @@ export interface SiteConfig {
   rssFeeds: Array<RSSFeed>;
   websiteBanners: Record<string, WebsiteBanner>;
   websiteBadges: Record<string, WebsiteBadge>;
-  footerLinks: Array<FooterConfig>;
-  socialLinks: Array<SocialConfig>;
 }

types/navigation.ts

@@ -1,3 +1,14 @@
+export interface FooterConfig {
+  text: string;
+  link: string;
+}
+
+export interface SocialConfig {
+  icon: string;
+  link: string;
+  alt?: string;
+}
+
 export type NavigationKeys =
   | 'about'
   | 'download'
@@ -15,5 +26,7 @@ export interface NavigationEntry {
 
 export interface SiteNavigation {
   topNavigation: Record<NavigationKeys, NavigationEntry>;
+  footerLinks: Array<FooterConfig>;
+  socialLinks: Array<SocialConfig>;
   sideNavigation: Record<NavigationKeys, NavigationEntry>;
 }