chore: moved components to correct places and standardises array types

.eslintrc.json

@@ -50,6 +50,7 @@
       "parser": "@typescript-eslint/parser",
       "rules": {
         "@typescript-eslint/consistent-type-imports": "error",
+        "@typescript-eslint/array-type": ["error", { "default": "generic" }],
         "no-relative-import-paths/no-relative-import-paths": [
           "warn",
           { "allowSameFolder": true, "prefix": "@" }

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

@@ -12,7 +12,7 @@ import { dynamicRouter } from '@/next.dynamic.mjs';
 import { availableLocaleCodes, defaultLocale } from '@/next.locales.mjs';
 import { MatterProvider } from '@/providers/matterProvider';
 
-type DynamicStaticPaths = { path: string[]; locale: string };
+type DynamicStaticPaths = { path: Array<string>; locale: string };
 type DynamicParams = { params: DynamicStaticPaths };
 
 // This is the default Viewport Metadata
@@ -38,7 +38,7 @@ export const generateMetadata = async ({ params }: DynamicParams) => {
 // This provides all the possible paths that can be generated statically
 // + provides all the paths that we support on the Node.js Website
 export const generateStaticParams = async () => {
-  const paths: DynamicStaticPaths[] = [];
+  const paths: Array<DynamicStaticPaths> = [];
 
   // We don't need to compute all possible paths on regular builds
   // as we benefit from Next.js's ISR (Incremental Static Regeneration)

app/sitemap.ts

@@ -15,7 +15,7 @@ const baseUrlAndPath = `${BASE_URL}${BASE_PATH}`;
 // Next.js Sitemap Generation doesn't support `alternate` refs yet
 // @see https://github.com/vercel/next.js/discussions/55646
 const sitemap = async (): Promise<MetadataRoute.Sitemap> => {
-  const paths: string[] = [];
+  const paths: Array<string> = [];
 
   for (const locale of availableLocaleCodes) {
     const routes = await dynamicRouter.getRoutesByLanguage(locale);

components/Common/AvatarGroup/index.tsx

@@ -9,7 +9,7 @@ import { getAcronymFromString } from '@/util/stringUtils';
 import styles from './index.module.css';
 
 type AvatarGroupProps = {
-  avatars: ComponentProps<typeof Avatar>[];
+  avatars: Array<ComponentProps<typeof Avatar>>;
   limit?: number;
   isExpandable?: boolean;
 };

components/Common/BlogPostCard/index.tsx

@@ -17,7 +17,7 @@ type BlogPostCardProps = {
   title: ComponentProps<typeof Preview>['title'];
   type: Required<ComponentProps<typeof Preview>>['type'];
   description: string;
-  authors: Author[];
+  authors: Array<Author>;
   date: Date;
 };
 

components/Common/Breadcrumbs/index.tsx

@@ -13,7 +13,7 @@ type BreadcrumbLink = {
 };
 
 type BreadcrumbsProps = {
-  links: BreadcrumbLink[];
+  links: Array<BreadcrumbLink>;
   maxLength?: number;
   hideHome?: boolean;
 };

components/Common/LanguageDropDown/index.tsx

@@ -13,7 +13,7 @@ type SimpleLocaleConfig = Pick<LocaleConfig, 'name' | 'code'>;
 type LanguageDropDownProps = {
   onChange?: (newLocale: SimpleLocaleConfig) => void;
   currentLanguage: string;
-  availableLanguages: SimpleLocaleConfig[];
+  availableLanguages: Array<SimpleLocaleConfig>;
 };
 
 const LanguageDropdown: FC<LanguageDropDownProps> = ({

components/Common/Pagination/index.tsx

@@ -12,7 +12,7 @@ type Page = { url: string };
 type PaginationProps = {
   // One-based number of the current page
   currentPage: number;
-  pages: Page[];
+  pages: Array<Page>;
   // The number of page buttons on each side of the current page button
   // @default 1
   currentPageSiblingsCount?: number;

components/Common/Pagination/useGetPageElements.tsx

@@ -9,16 +9,17 @@ const parsePages = (
   pages: ComponentProps<typeof Pagination>['pages'],
   currentPage: number,
   totalPages: number
-): PaginationListItemProps[] =>
+): Array<PaginationListItemProps> =>
   pages.map(({ url }, index) => ({
     url,
     pageNumber: index + 1,
     currentPage,
     totalPages,
   }));
 
-const createPaginationListItems = (parsedPages: PaginationListItemProps[]) =>
-  parsedPages.map(page => <PaginationListItem key={page.url} {...page} />);
+const createPaginationListItems = (
+  parsedPages: Array<PaginationListItemProps>
+) => parsedPages.map(page => <PaginationListItem key={page.url} {...page} />);
 
 // The minimum amount of elements are first page, current page, and last page
 const MINIMUM_AMOUNT_OF_ELEMENTS = 3;

components/Common/ProgressionSidebar/ProgressionSidebarGroup/index.tsx

@@ -7,7 +7,7 @@ import styles from './index.module.css';
 
 type ProgressionSidebarGroupProps = {
   groupName: FormattedMessage;
-  items: ComponentProps<typeof ProgressionSidebarItem>[];
+  items: Array<ComponentProps<typeof ProgressionSidebarItem>>;
 };
 
 const ProgressionSidebarGroup: FC<ProgressionSidebarGroupProps> = ({

components/Common/ProgressionSidebar/index.tsx

@@ -6,7 +6,7 @@ import WithSidebarSelect from '@/components/withSidebarSelect';
 import styles from './index.module.css';
 
 type ProgressionSidebarProps = {
-  groups: ComponentProps<typeof ProgressionSidebarGroup>[];
+  groups: Array<ComponentProps<typeof ProgressionSidebarGroup>>;
 };
 
 const ProgressionSidebar: FC<ProgressionSidebarProps> = ({ groups }) => (

components/Common/Select/index.tsx

@@ -18,17 +18,17 @@ type SelectValue = {
 
 type SelectGroup = {
   label?: FormattedMessage;
-  items: SelectValue[];
+  items: Array<SelectValue>;
 };
 
-const isStringArray = (values: unknown[]): values is string[] =>
+const isStringArray = (values: Array<unknown>): values is Array<string> =>
   Boolean(values[0] && typeof values[0] === 'string');
 
-const isValuesArray = (values: unknown[]): values is SelectValue[] =>
+const isValuesArray = (values: Array<unknown>): values is Array<SelectValue> =>
   Boolean(values[0] && typeof values[0] === 'object' && 'value' in values[0]);
 
 type SelectProps = {
-  values: SelectGroup[] | SelectValue[] | string[];
+  values: Array<SelectGroup> | Array<SelectValue> | Array<string>;
   defaultValue?: string;
   placeholder?: string;
   label?: string;

components/Common/Tabs/index.tsx

@@ -10,7 +10,7 @@ type Tab = {
 };
 
 type TabsProps = {
-  tabs: Tab[];
+  tabs: Array<Tab>;
   addons?: ReactNode;
   headerClassName?: string;
 } & TabsPrimitive.TabsProps;

components/Containers/Footer/index.tsx

@@ -1,7 +1,7 @@
 import { useTranslations } from 'next-intl';
 import type { FC, SVGProps } from 'react';
 
-import NavItem from '@/components/Common/NavItem';
+import NavItem from '@/components/Containers/NavBar/NavItem';
 import GitHub from '@/components/Icons/Social/GitHub';
 import LinkedIn from '@/components/Icons/Social/LinkedIn';
 import Mastodon from '@/components/Icons/Social/Mastodon';

components/Common/MetaBar/index.stories.tsx → components/Containers/MetaBar/index.stories.tsx

@@ -2,7 +2,7 @@ import { CodeBracketIcon } from '@heroicons/react/24/outline';
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
 import AvatarGroup from '@/components/Common/AvatarGroup';
-import MetaBar from '@/components/Common/MetaBar';
+import MetaBar from '@/components/Containers/MetaBar';
 import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 

components/Common/MetaBar/index.tsx → components/Containers/MetaBar/index.tsx

@@ -10,7 +10,7 @@ import styles from './index.module.css';
 type MetaBarProps = {
   items: Record<string, React.ReactNode>;
   headings?: {
-    items: Heading[];
+    items: Array<Heading>;
     minDepth?: number;
   };
 };

components/Common/NavItem/index.stories.tsx → components/Containers/NavBar/NavItem/index.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
-import NavItem from '@/components/Common/NavItem';
+import NavItem from '@/components/Containers/NavBar/NavItem';
 
 type Story = StoryObj<typeof NavItem>;
 type Meta = MetaObj<typeof NavItem>;

components/Containers/NavBar/index.tsx

@@ -7,8 +7,8 @@ import { useState } from 'react';
 import type { FC, ComponentProps } from 'react';
 
 import LanguageDropdown from '@/components/Common/LanguageDropDown';
-import NavItem from '@/components/Common/NavItem';
 import ThemeToggle from '@/components/Common/ThemeToggle';
+import NavItem from '@/components/Containers/NavBar/NavItem';
 import NodejsDark from '@/components/Icons/Logos/NodejsDark';
 import NodejsLight from '@/components/Icons/Logos/NodejsLight';
 import GitHub from '@/components/Icons/Social/GitHub';
@@ -23,7 +23,7 @@ const navInteractionIcons = {
 };
 
 type NavbarProps = {
-  navItems: { text: FormattedMessage; link: string }[];
+  navItems: Array<{ text: FormattedMessage; link: string }>;
   languages: ComponentProps<typeof LanguageDropdown>;
   onThemeTogglerClick: () => void;
 };

components/Common/Sidebar/SidebarGroup/index.tsx → components/Containers/Sidebar/SidebarGroup/index.tsx

@@ -1,13 +1,13 @@
 import type { ComponentProps, FC } from 'react';
 
-import SidebarItem from '@/components/Common/Sidebar/SidebarItem';
+import SidebarItem from '@/components/Containers/Sidebar/SidebarItem';
 import type { FormattedMessage } from '@/types';
 
 import styles from './index.module.css';
 
 type SidebarGroupProps = {
   groupName: FormattedMessage;
-  items: ComponentProps<typeof SidebarItem>[];
+  items: Array<ComponentProps<typeof SidebarItem>>;
 };
 
 const SidebarGroup: FC<SidebarGroupProps> = ({ groupName, items }) => (

components/Common/Sidebar/index.stories.tsx → components/Containers/Sidebar/index.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
-import Sidebar from '@/components/Common/Sidebar';
+import Sidebar from '@/components/Containers/Sidebar';
 
 type Story = StoryObj<typeof Sidebar>;
 type Meta = MetaObj<typeof Sidebar>;

components/Common/Sidebar/index.tsx → components/Containers/Sidebar/index.tsx

@@ -1,12 +1,12 @@
 import type { ComponentProps, FC } from 'react';
 
-import SidebarGroup from '@/components/Common/Sidebar/SidebarGroup';
+import SidebarGroup from '@/components/Containers/Sidebar/SidebarGroup';
 import WithSidebarSelect from '@/components/withSidebarSelect';
 
 import styles from './index.module.css';
 
 type SidebarProps = {
-  groups: ComponentProps<typeof SidebarGroup>[];
+  groups: Array<ComponentProps<typeof SidebarGroup>>;
 };
 
 const SideBar: FC<SidebarProps> = ({ groups }) => (

components/SideNavigation.tsx

@@ -6,7 +6,7 @@ import { useSiteNavigation } from '@/hooks/server';
 import type { NavigationKeys } from '@/types';
 
 type SideNavigationProps = {
-  navigationKeys: NavigationKeys[];
+  navigationKeys: Array<NavigationKeys>;
   context?: Record<string, RichTranslationValues>;
 };
 

components/withMetaBar.tsx

@@ -1,7 +1,7 @@
 import { useFormatter } from 'next-intl';
 import type { FC } from 'react';
 
-import MetaBar from '@/components/Common/MetaBar';
+import MetaBar from '@/components/Containers/MetaBar';
 import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 import { useClientContext } from '@/hooks/server';

components/withNodeRelease.tsx

@@ -4,7 +4,7 @@ import getReleaseData from '@/next-data/releaseData';
 import type { NodeRelease, NodeReleaseStatus } from '@/types';
 
 type WithNodeReleaseProps = {
-  status: NodeReleaseStatus[] | NodeReleaseStatus;
+  status: Array<NodeReleaseStatus> | NodeReleaseStatus;
   children: FC<{ release: NodeRelease }>;
 };
 

components/withSidebar.tsx

@@ -1,12 +1,12 @@
 import type { RichTranslationValues } from 'next-intl';
 import type { FC } from 'react';
 
-import Sidebar from '@/components/Common/Sidebar';
+import Sidebar from '@/components/Containers/Sidebar';
 import { useSiteNavigation } from '@/hooks/server';
 import type { NavigationKeys } from '@/types';
 
 type WithSidebarProps = {
-  navKeys: NavigationKeys[];
+  navKeys: Array<NavigationKeys>;
   context?: Record<string, RichTranslationValues>;
 };
 

components/withSidebarSelect.tsx

@@ -14,7 +14,7 @@ type SelectItem = {
 };
 
 type WithSidebarSelectProps = {
-  groups: { groupName: FormattedMessage; items: SelectItem[] }[];
+  groups: Array<{ groupName: FormattedMessage; items: Array<SelectItem> }>;
 };
 
 const WithSidebarSelect: FC<WithSidebarSelectProps> = ({ groups }) => {

hooks/react-generic/useSiteNavigation.ts

@@ -12,7 +12,7 @@ type Context = Record<string, RichTranslationValues>;
 type Navigation = Record<string, NavigationEntry>;
 
 interface MappedNavigationEntry {
-  items: [string, MappedNavigationEntry][];
+  items: Array<[string, MappedNavigationEntry]>;
   label: FormattedMessage;
   link: string;
 }
@@ -51,7 +51,10 @@ const useSiteNavigation = () => {
     );
   };
 
-  const getSideNavigation = (keys: NavigationKeys[], context: Context = {}) => {
+  const getSideNavigation = (
+    keys: Array<NavigationKeys>,
+    context: Context = {}
+  ) => {
     const navigationEntries: Navigation = keys.reduce(
       (acc, key) => ({ ...acc, [key]: siteNavigation.sideNavigation[key] }),
       {}

next-data/releaseData.ts

@@ -6,7 +6,7 @@ import {
 } from '@/next.constants.mjs';
 import type { NodeRelease } from '@/types';
 
-const getReleaseData = (): Promise<NodeRelease[]> => {
+const getReleaseData = (): Promise<Array<NodeRelease>> => {
   // When we're using Static Exports the Next.js Server is not running (during build-time)
   // hence the self-ingestion APIs will not be available. In this case we want to load
   // the data directly within the current thread, which will anyways be loaded only once

providers/matterProvider.tsx

@@ -10,7 +10,7 @@ import type { LegacyFrontMatter } from '@/types';
 type MatterContext = {
   frontmatter: LegacyFrontMatter;
   pathname: string;
-  headings: Heading[];
+  headings: Array<Heading>;
   readingTime: ReadTimeResults;
   filename: string;
 };

types/blog.ts

@@ -7,19 +7,19 @@ export interface BlogPost {
 }
 
 export interface BlogData {
-  posts: BlogPost[];
-  pagination: number[];
-  categories: string[];
+  posts: Array<BlogPost>;
+  pagination: Array<number>;
+  categories: Array<string>;
 }
 
 export interface BlogDataRSC {
-  posts: BlogPost[];
+  posts: Array<BlogPost>;
   pagination: {
     next: number | null;
     prev: number | null;
   };
   meta: {
-    categories: string[];
-    pagination: number[];
+    categories: Array<string>;
+    pagination: Array<number>;
   };
 }

types/i18n.ts

@@ -13,4 +13,4 @@ export interface LocaleConfig {
 export type FormattedMessage =
   | string
   | ReactElement<HTMLElement, string | JSXElementConstructor<HTMLElement>>
-  | readonly ReactNode[];
+  | ReadonlyArray<ReactNode>;

types/server.ts

@@ -5,7 +5,7 @@ import type { LegacyFrontMatter } from './frontmatter';
 
 export interface ClientSharedServerContext {
   frontmatter: LegacyFrontMatter;
-  headings: Heading[];
+  headings: Array<Heading>;
   pathname: string;
   filename: string;
   readingTime: ReadTimeResults;