chore: simplify hooks (#8516)

* chore: simplify hooks

* fixup!

Author: avivkeller

apps/site/components/Common/CodeBox.tsx

@@ -1,14 +1,9 @@
 'use client';
 
-import {
-  DocumentDuplicateIcon,
-  CodeBracketIcon,
-} from '@heroicons/react/24/outline';
 import BaseCodeBox from '@node-core/ui-components/Common/BaseCodeBox';
 import { useTranslations } from 'next-intl';
 
 import Link from '#site/components/Link';
-import { useCopyToClipboard } from '#site/hooks';
 
 import type { FC, PropsWithChildren } from 'react';
 
@@ -18,25 +13,13 @@ type CodeBoxProps = {
 };
 
 const CodeBox: FC<PropsWithChildren<CodeBoxProps>> = props => {
-  const [copied, copyToClipboard] = useCopyToClipboard();
   const t = useTranslations();
 
-  const ButtonIcon = copied ? DocumentDuplicateIcon : CodeBracketIcon;
-
   return (
     <BaseCodeBox
       as={Link}
-      onCopy={copyToClipboard}
-      buttonContent={
-        <>
-          <ButtonIcon className="size-4" />
-          {t(
-            copied
-              ? 'components.common.codebox.copied'
-              : 'components.common.codebox.copy'
-          )}
-        </>
-      }
+      copyButtonLabel={t('components.common.codebox.copy')}
+      copiedButtonLabel={t('components.common.codebox.copied')}
       {...props}
     />
   );

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

@@ -4,7 +4,7 @@ import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
 import { useContext, useEffect, useMemo } from 'react';
 
-import { useClientContext } from '#site/hooks';
+import { useClientContext } from '#site/hooks/client';
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { nextItem, OPERATING_SYSTEMS, parseCompat } from '#site/util/download';
 

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

@@ -4,7 +4,7 @@ import Select from '@node-core/ui-components/Common/Select';
 import { useTranslations } from 'next-intl';
 import { useEffect, useContext, useMemo } from 'react';
 
-import { useClientContext } from '#site/hooks';
+import { useClientContext } from '#site/hooks/client';
 import { ReleaseContext } from '#site/providers/releaseProvider';
 import { PLATFORMS, nextItem, parseCompat } from '#site/util/download';
 import { getUserPlatform } from '#site/util/userAgent';

apps/site/components/EOL/EOLReleaseTable/TableBody.tsx

@@ -8,8 +8,7 @@ import LinkWithArrow from '#site/components/Common/LinkWithArrow';
 import EOLModal from '#site/components/EOL/EOLModal';
 import VulnerabilityChips from '#site/components/EOL/VulnerabilityChips';
 
-import type { NodeRelease } from '#site/types/releases.js';
-import type { GroupedVulnerabilities } from '#site/types/vulnerabilities.js';
+import type { GroupedVulnerabilities, NodeRelease } from '#site/types';
 import type { FC } from 'react';
 
 type EOLReleaseTableBodyProps = {

apps/site/components/Releases/PreviousReleasesTable/TableBody.tsx

@@ -8,7 +8,7 @@ import FormattedTime from '#site/components/Common/FormattedTime';
 import LinkWithArrow from '#site/components/Common/LinkWithArrow';
 import Link from '#site/components/Link';
 
-import type { NodeRelease } from '#site/types/releases.js';
+import type { NodeRelease } from '#site/types';
 import type { FC } from 'react';
 
 import ReleaseModal from '../ReleaseModal';

apps/site/components/withBreadcrumbs.tsx

@@ -4,11 +4,8 @@ import Breadcrumbs from '@node-core/ui-components/Common/Breadcrumbs';
 import { useTranslations } from 'next-intl';
 
 import Link from '#site/components/Link';
-import {
-  useClientContext,
-  useMediaQuery,
-  useSiteNavigation,
-} from '#site/hooks';
+import { useClientContext, useMediaQuery } from '#site/hooks/client';
+import { useSiteNavigation } from '#site/hooks/generic';
 import { dashToCamelCase } from '#site/util/string';
 
 import type { NavigationKeys } from '#site/types';

apps/site/components/withMetaBar.tsx

@@ -7,8 +7,7 @@ import { useFormatter, useLocale, useTranslations } from 'next-intl';
 
 import Link from '#site/components/Link';
 import WithAvatarGroup from '#site/components/withAvatarGroup';
-import { useClientContext } from '#site/hooks/react-client';
-import useMediaQuery from '#site/hooks/react-client/useMediaQuery';
+import { useClientContext, useMediaQuery } from '#site/hooks/client';
 import { DEFAULT_DATE_FORMAT } from '#site/next.calendar.constants.mjs';
 import { TRANSLATION_URL } from '#site/next.constants.mjs';
 import { getGitHubBlobUrl } from '#site/util/github';

apps/site/components/withNavBar.tsx

@@ -15,7 +15,7 @@ import SearchButton from '#site/components/Common/Searchbox';
 import Link from '#site/components/Link';
 import WithBanner from '#site/components/withBanner';
 import WithNodejsLogo from '#site/components/withNodejsLogo';
-import { useSiteNavigation } from '#site/hooks';
+import { useSiteNavigation } from '#site/hooks/generic';
 import { useRouter, usePathname } from '#site/navigation.mjs';
 
 import type { SimpleLocaleConfig } from '@node-core/ui-components/types';

apps/site/components/withSidebar.tsx

@@ -5,8 +5,8 @@ import { usePathname } from 'next/navigation';
 import { useLocale, useTranslations } from 'next-intl';
 
 import Link from '#site/components/Link';
-import { useClientContext } from '#site/hooks';
-import { useSiteNavigation } from '#site/hooks/server';
+import { useClientContext } from '#site/hooks/client';
+import { useSiteNavigation } from '#site/hooks/generic';
 import { useRouter } from '#site/navigation.mjs';
 
 import type { NavigationKeys } from '#site/types';

apps/site/components/withSidebarCrossLinks.tsx

@@ -1,5 +1,6 @@
 import CrossLink from '#site/components/Common/CrossLink';
-import { useClientContext, useSiteNavigation } from '#site/hooks/server';
+import { useSiteNavigation } from '#site/hooks/generic';
+import { useClientContext } from '#site/hooks/server';
 
 import type { NavigationKeys } from '#site/types';
 import type { FC } from 'react';