refactor: import jest as global; unify import style of some modules (#6898)

* refactor: import jest as global

* fix react

website/src/components/APITable/index.tsx

@@ -6,14 +6,12 @@
  */
 
 import React, {
-  Children,
   type ComponentProps,
   type ReactElement,
   type ReactNode,
   isValidElement,
   useRef,
   useEffect,
-  forwardRef,
 } from 'react';
 import {useHistory} from '@docusaurus/router';
 import styles from './styles.module.css';
@@ -27,41 +25,41 @@ interface Props {
 function getText(node: ReactElement): string {
   let curNode: ReactNode = node;
   while (isValidElement(curNode)) {
-    [curNode] = Children.toArray(curNode.props.children);
+    [curNode] = React.Children.toArray(curNode.props.children);
   }
   return curNode as string;
 }
 
-const APITableRow = forwardRef(
-  (
-    {
-      name,
-      children,
-    }: {name: string | undefined; children: ReactElement<ComponentProps<'tr'>>},
-    ref: React.ForwardedRef<HTMLTableRowElement>,
-  ) => {
-    const entryName = getText(children);
-    const id = name ? `${name}-${entryName}` : entryName;
-    const anchor = `#${id}`;
-    const history = useHistory();
-    return (
-      <tr
-        id={id}
-        tabIndex={0}
-        ref={history.location.hash === anchor ? ref : undefined}
-        onClick={() => {
+function APITableRow(
+  {
+    name,
+    children,
+  }: {name: string | undefined; children: ReactElement<ComponentProps<'tr'>>},
+  ref: React.ForwardedRef<HTMLTableRowElement>,
+) {
+  const entryName = getText(children);
+  const id = name ? `${name}-${entryName}` : entryName;
+  const anchor = `#${id}`;
+  const history = useHistory();
+  return (
+    <tr
+      id={id}
+      tabIndex={0}
+      ref={history.location.hash === anchor ? ref : undefined}
+      onClick={() => {
+        history.push(anchor);
+      }}
+      onKeyDown={(e: React.KeyboardEvent) => {
+        if (e.key === 'Enter') {
           history.push(anchor);
-        }}
-        onKeyDown={(e: React.KeyboardEvent) => {
-          if (e.key === 'Enter') {
-            history.push(anchor);
-          }
-        }}>
-        {children.props.children}
-      </tr>
-    );
-  },
-);
+        }
+      }}>
+      {children.props.children}
+    </tr>
+  );
+}
+
+const APITableRowComp = React.forwardRef(APITableRow);
 
 /*
  * Note: this is not a quite robust component since it makes a lot of
@@ -69,19 +67,19 @@ const APITableRow = forwardRef(
  * should be generally correct in the MDX context.
  */
 export default function APITable({children, name}: Props): JSX.Element {
-  const [thead, tbody] = Children.toArray(
+  const [thead, tbody] = React.Children.toArray(
     children.props.children,
   ) as ReactElement[];
   const highlightedRow = useRef<HTMLTableRowElement>(null);
   useEffect(() => {
     highlightedRow.current?.focus();
   }, [highlightedRow]);
-  const rows = Children.map(
+  const rows = React.Children.map(
     tbody.props.children,
     (row: ReactElement<ComponentProps<'tr'>>) => (
-      <APITableRow name={name} ref={highlightedRow}>
+      <APITableRowComp name={name} ref={highlightedRow}>
         {row}
-      </APITableRow>
+      </APITableRowComp>
     ),
   );
 

website/src/data/__tests__/user.test.ts

@@ -6,12 +6,10 @@
  */
 
 import {TagList, sortedUsers, type User} from '../users';
-// eslint-disable-next-line import/no-extraneous-dependencies
 import {Joi} from '@docusaurus/utils-validation';
 
 import fs from 'fs-extra';
 import path from 'path';
-// eslint-disable-next-line import/no-extraneous-dependencies
 import imageSize from 'image-size';
 
 declare global {

website/src/pages/showcase/_components/ShowcaseCard/index.tsx

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, {memo} from 'react';
+import React from 'react';
 import clsx from 'clsx';
 import Image from '@theme/IdealImage';
 import Link from '@docusaurus/Link';
@@ -95,4 +95,4 @@ function ShowcaseCard({user}: {user: User}) {
   );
 }
 
-export default memo(ShowcaseCard);
+export default React.memo(ShowcaseCard);

website/src/pages/showcase/_components/ShowcaseTagSelect/index.tsx

@@ -6,12 +6,12 @@
  */
 
 import React, {
-  type ComponentProps,
-  type ReactNode,
-  type ReactElement,
   useCallback,
   useState,
   useEffect,
+  type ComponentProps,
+  type ReactNode,
+  type ReactElement,
 } from 'react';
 import {useHistory, useLocation} from '@docusaurus/router';
 import {toggleListItem} from '@site/src/utils/jsUtils';