chore(eslint): update to v10

Author: avivkeller

apps/site/components/Common/Supporters/index.tsx

@@ -11,12 +11,12 @@ type SupportersListProps = {
 
 const SupportersList: FC<SupportersListProps> = ({ supporters }) => (
   <div className="flex max-w-full flex-wrap items-center justify-center gap-1">
-    {supporters.map(({ name, image, profile }, i) => (
+    {supporters.map(({ name, image, profile }) => (
       <Avatar
         nickname={name}
         fallback={getAcronymFromString(name)}
         image={image}
-        key={`${name}-${i}`}
+        key={name}
         url={profile}
       />
     ))}

apps/site/components/Downloads/Release/BlogPostLink.tsx

@@ -1,14 +1,14 @@
 'use client';
 
-import { useContext } from 'react';
+import { use } from 'react';
 
 import Link from '#site/components/Link';
 import { ReleaseContext } from '#site/providers/releaseProvider';
 
 import type { FC, PropsWithChildren } from 'react';
 
 const BlogPostLink: FC<PropsWithChildren> = ({ children }) => {
-  const { release } = useContext(ReleaseContext);
+  const { release } = use(ReleaseContext);
   const version = release.versionWithPrefix;
 
   return <Link href={`/blog/release/${version}`}>{children}</Link>;

apps/site/components/Downloads/Release/ChangelogLink.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useContext } from 'react';
+import { use } from 'react';
 
 import LinkWithArrow from '#site/components/Common/LinkWithArrow';
 import { BASE_CHANGELOG_URL } from '#site/next.constants.mjs';
@@ -9,7 +9,7 @@ import { ReleaseContext } from '#site/providers/releaseProvider';
 import type { FC, PropsWithChildren } from 'react';
 
 const ChangelogLink: FC<PropsWithChildren> = ({ children }) => {
-  const { release } = useContext(ReleaseContext);
+  const { release } = use(ReleaseContext);
 
   return (
     <LinkWithArrow href={`${BASE_CHANGELOG_URL}${release.version}`}>

apps/site/components/Downloads/Release/DownloadLink.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useContext } from 'react';
+import { use } from 'react';
 
 import DownloadLinkBase from '#site/components/Downloads/DownloadLink';
 import { ReleaseContext } from '#site/providers/releaseProvider';
@@ -14,7 +14,7 @@ const DownloadLink: FC<PropsWithChildren<DownloadLinkProps>> = ({
   kind = 'installer',
   children,
 }) => {
-  const { release } = useContext(ReleaseContext);
+  const { release } = use(ReleaseContext);
 
   return (
     <DownloadLinkBase release={release} kind={kind}>

apps/site/components/Downloads/Release/InstallationMethodDropdown.tsx

@@ -2,7 +2,7 @@
 
 import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
-import { useContext, useEffect, useMemo } from 'react';
+import { use, useEffect, useMemo } from 'react';
 
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { nextItem, INSTALL_METHODS, parseCompat } from '#site/util/download';
@@ -11,14 +11,13 @@ import type { InstallationMethod } from '#site/types/release';
 import type { FC } from 'react';
 
 const InstallationMethodDropdown: FC = () => {
-  const release = useContext(ReleaseContext);
+  const release = use(ReleaseContext);
   const t = useTranslations();
 
   // We parse the compatibility of the dropdown items
   const parsedInstallMethods = useMemo(
     () => parseCompat(INSTALL_METHODS, release),
     // We only want to react on the change of the OS and Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.os, release.version]
   );
 
@@ -36,7 +35,6 @@ const InstallationMethodDropdown: FC = () => {
       },
     ],
     // We only want to react on the change of the parsedPlatforms
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [parsedInstallMethods]
   );
 
@@ -55,7 +53,6 @@ const InstallationMethodDropdown: FC = () => {
       // when the OS has finished loading for a given installation method
       release.setInstallMethod(installationMethod as InstallationMethod);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [parsedInstallMethods, release.installMethod, release.os]);
 
   // We set the Platform to the next available platform when the current
@@ -69,7 +66,6 @@ const InstallationMethodDropdown: FC = () => {
       }
     },
     // We only want to react on the change of the OS and Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.os, release.version]
   );
 

apps/site/components/Downloads/Release/OperatingSystemDropdown.tsx

@@ -2,9 +2,9 @@
 
 import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
-import { useContext, useEffect, useMemo } from 'react';
+import { use, useEffect, useMemo } from 'react';
 
-import { useClientContext } from '#site/hooks/client';
+import useClientContext from '#site/hooks/useClientContext';
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { nextItem, OPERATING_SYSTEMS, parseCompat } from '#site/util/download';
 
@@ -15,7 +15,7 @@ type OperatingSystemDropdownProps = { exclude?: Array<OperatingSystem> };
 
 const OperatingSystemDropdown: FC<OperatingSystemDropdownProps> = () => {
   const { os } = useClientContext();
-  const release = useContext(ReleaseContext);
+  const release = use(ReleaseContext);
   const t = useTranslations();
 
   useEffect(() => {
@@ -25,14 +25,12 @@ const OperatingSystemDropdown: FC<OperatingSystemDropdownProps> = () => {
     // Reacts on Client Context change of OS
     // Only this Hook is allowed to bypass the `setOS` from above
     // As this Hook is what defined the initial OS state
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [os]);
 
   // We parse the compatibility of the dropdown items
   const parsedOperatingSystems = useMemo(
     () => parseCompat(OPERATING_SYSTEMS, release),
     // We only want to react on the change of the Install Method and Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.installMethod, release.version]
   );
 
@@ -45,7 +43,6 @@ const OperatingSystemDropdown: FC<OperatingSystemDropdownProps> = () => {
       }
     },
     // We only want to react on the change of the Version, Install Method and OS
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.installMethod, release.version, release.os]
   );
 

apps/site/components/Downloads/Release/PackageManagerDropdown.tsx

@@ -2,7 +2,7 @@
 
 import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
-import { useContext, useEffect, useMemo } from 'react';
+import { use, useEffect, useMemo } from 'react';
 
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { nextItem, PACKAGE_MANAGERS, parseCompat } from '#site/util/download';
@@ -11,14 +11,13 @@ import type { PackageManager } from '#site/types/release';
 import type { FC } from 'react';
 
 const PackageManagerDropdown: FC = () => {
-  const release = useContext(ReleaseContext);
+  const release = use(ReleaseContext);
   const t = useTranslations();
 
   // We parse the compatibility of the dropdown items
   const parsedPackageManagers = useMemo(
     () => parseCompat(PACKAGE_MANAGERS, release),
     // We only want to react on the change of the Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.version]
   );
 
@@ -30,7 +29,6 @@ const PackageManagerDropdown: FC = () => {
         nextItem(release.packageManager, parsedPackageManagers)
       ),
     // We only want to react on the change of the Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.version, release.packageManager]
   );
 

apps/site/components/Downloads/Release/PlatformDropdown.tsx

@@ -2,9 +2,9 @@
 
 import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
-import { useEffect, useContext, useMemo } from 'react';
+import { useEffect, use, useMemo } from 'react';
 
-import { useClientContext } from '#site/hooks/client';
+import useClientContext from '#site/hooks/useClientContext';
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { PLATFORMS, nextItem, parseCompat } from '#site/util/download';
 import { getUserPlatform } from '#site/util/userAgent';
@@ -15,7 +15,7 @@ import type { FC } from 'react';
 const PlatformDropdown: FC = () => {
   const { architecture, bitness } = useClientContext();
 
-  const release = useContext(ReleaseContext);
+  const release = use(ReleaseContext);
   const t = useTranslations();
 
   useEffect(
@@ -27,7 +27,6 @@ const PlatformDropdown: FC = () => {
       }
     },
     // Only react on the change of the Client Context Architecture and Bitness
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [architecture, bitness]
   );
 
@@ -40,7 +39,6 @@ const PlatformDropdown: FC = () => {
         ? parseCompat(PLATFORMS[release.os], release)
         : [],
     // We only want to react on the change of the OS, Platform, and Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.os, release.version]
   );
 
@@ -53,7 +51,6 @@ const PlatformDropdown: FC = () => {
       }
     },
     // We only want to react on the change of the OS and Version
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [release.os, release.version, release.platform]
   );
 

apps/site/components/Downloads/Release/PrebuiltDownloadButtons.tsx

@@ -3,7 +3,7 @@
 import { CloudArrowDownIcon } from '@heroicons/react/24/outline';
 import Skeleton from '@node-core/ui-components/Common/Skeleton';
 import { useTranslations } from 'next-intl';
-import { useContext } from 'react';
+import { use } from 'react';
 
 import Button from '#site/components/Common/Button';
 import { ReleaseContext } from '#site/providers/releaseProvider';
@@ -20,7 +20,7 @@ const getExtension = (input: string) => String(input.split('.').slice(-1));
 
 const PrebuiltDownloadButtons: FC = () => {
   const t = useTranslations();
-  const { release, os, platform } = useContext(ReleaseContext);
+  const { release, os, platform } = use(ReleaseContext);
 
   const installerUrl = platform
     ? getNodeDownloadUrl({

apps/site/components/Downloads/Release/ReleaseCodeBox.tsx

@@ -4,7 +4,7 @@ import { highlightToHtml } from '@node-core/rehype-shiki/minimal';
 import AlertBox from '@node-core/ui-components/Common/AlertBox';
 import Skeleton from '@node-core/ui-components/Common/Skeleton';
 import { useTranslations } from 'next-intl';
-import { useContext, useMemo } from 'react';
+import { use, useMemo } from 'react';
 
 import CodeBox from '#site/components/Common/CodeBox';
 import LinkWithArrow from '#site/components/Common/LinkWithArrow';
@@ -114,8 +114,8 @@ const usePlatformInfo = (installMethod: string) => {
  * ReleaseCodeBox component displays installation instructions based on platform and context
  */
 const ReleaseCodeBox: FC = () => {
-  const { snippets } = useContext(ReleasesContext);
-  const context = useContext(ReleaseContext);
+  const { snippets } = use(ReleasesContext);
+  const context = use(ReleaseContext);
   const t = useTranslations();
 
   // Process platform information
@@ -164,6 +164,7 @@ const ReleaseCodeBox: FC = () => {
       {/* Code display with skeleton loading */}
       <Skeleton loading={isLoading}>
         <CodeBox language={displayLanguage} className="min-h-[19rem]">
+          {/* eslint-disable-next-line @eslint-react/dom/no-dangerously-set-innerhtml */}
           <code dangerouslySetInnerHTML={{ __html: parsedSnippets }} />
         </CodeBox>
       </Skeleton>