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

* refactor: import jest as global

* fix react

packages/docusaurus-theme-common/src/components/Collapsible/index.tsx

@@ -11,11 +11,11 @@ import React, {
   useEffect,
   useRef,
   useCallback,
+  useLayoutEffect,
   type RefObject,
   type Dispatch,
   type SetStateAction,
   type ReactNode,
-  useLayoutEffect,
 } from 'react';
 
 const DefaultAnimationEasing = 'ease-in-out';

packages/docusaurus-theme-common/src/components/Details/index.tsx

@@ -6,10 +6,10 @@
  */
 
 import React, {
-  type ComponentProps,
-  type ReactElement,
   useRef,
   useState,
+  type ComponentProps,
+  type ReactElement,
 } from 'react';
 import useIsBrowser from '@docusaurus/useIsBrowser';
 import clsx from 'clsx';

packages/docusaurus-theme-common/src/utils/announcementBarUtils.tsx

@@ -10,9 +10,8 @@ import React, {
   useEffect,
   useCallback,
   useMemo,
-  type ReactNode,
   useContext,
-  createContext,
+  type ReactNode,
 } from 'react';
 import useIsBrowser from '@docusaurus/useIsBrowser';
 import {createStorageSlot} from './storageUtils';
@@ -96,7 +95,9 @@ const useAnnouncementBarContextValue = (): AnnouncementBarAPI => {
   );
 };
 
-const AnnouncementBarContext = createContext<AnnouncementBarAPI | null>(null);
+const AnnouncementBarContext = React.createContext<AnnouncementBarAPI | null>(
+  null,
+);
 
 export function AnnouncementBarProvider({
   children,

packages/docusaurus-theme-common/src/utils/colorModeUtils.tsx

@@ -11,6 +11,7 @@ import React, {
   useEffect,
   useContext,
   useMemo,
+  useRef,
   type ReactNode,
 } from 'react';
 import {ReactContextError} from './reactUtils';
@@ -96,7 +97,7 @@ function useColorModeContextValue(): ColorModeContextValue {
   // be reset to dark when exiting print mode, disregarding user settings. When
   // the listener fires only because of a print/screen switch, we don't change
   // color mode. See https://github.com/facebook/docusaurus/pull/6490
-  const previousMediaIsPrint = React.useRef(false);
+  const previousMediaIsPrint = useRef(false);
 
   useEffect(() => {
     if (disableSwitch && !respectPrefersColorScheme) {

packages/docusaurus-theme-common/src/utils/docsPreferredVersion/DocsPreferredVersionProvider.tsx

@@ -6,12 +6,11 @@
  */
 
 import React, {
-  createContext,
-  type ReactNode,
   useContext,
   useEffect,
   useMemo,
   useState,
+  type ReactNode,
 } from 'react';
 import {useThemeConfig, type DocsVersionPersistence} from '../useThemeConfig';
 import {isDocsPluginEnabled} from '../docsUtils';
@@ -131,7 +130,9 @@ function useContextValue() {
 
 type DocsPreferredVersionContextValue = ReturnType<typeof useContextValue>;
 
-const Context = createContext<DocsPreferredVersionContextValue | null>(null);
+const Context = React.createContext<DocsPreferredVersionContextValue | null>(
+  null,
+);
 
 export function DocsPreferredVersionContextProvider({
   children,

packages/docusaurus-theme-common/src/utils/docsUtils.tsx

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, {createContext, type ReactNode, useContext} from 'react';
+import React, {type ReactNode, useContext} from 'react';
 import {
   useActivePlugin,
   useAllDocsData,
@@ -29,7 +29,7 @@ export const isDocsPluginEnabled: boolean = !!useAllDocsData;
 // Inspired by https://github.com/jamiebuilds/unstated-next/blob/master/src/unstated-next.tsx
 const EmptyContextValue: unique symbol = Symbol('EmptyContext');
 
-const DocsVersionContext = createContext<
+const DocsVersionContext = React.createContext<
   PropVersionMetadata | typeof EmptyContextValue
 >(EmptyContextValue);
 
@@ -69,7 +69,7 @@ export function useDocById(id: string | undefined): PropVersionDoc | undefined {
   return doc;
 }
 
-const DocsSidebarContext = createContext<
+const DocsSidebarContext = React.createContext<
   PropSidebar | null | typeof EmptyContextValue
 >(EmptyContextValue);
 

packages/docusaurus-theme-common/src/utils/mobileSecondaryMenu.tsx

@@ -7,12 +7,11 @@
 
 import React, {
   useState,
-  type ReactNode,
   useContext,
-  createContext,
   useEffect,
-  type ComponentType,
   useMemo,
+  type ReactNode,
+  type ComponentType,
 } from 'react';
 import {ReactContextError} from './reactUtils';
 
@@ -46,7 +45,7 @@ function useContextValue() {
 
 type ContextValue = ReturnType<typeof useContextValue>;
 
-const Context = createContext<ContextValue | null>(null);
+const Context = React.createContext<ContextValue | null>(null);
 
 export function MobileSecondaryMenuProvider({
   children,

packages/docusaurus-theme-common/src/utils/scrollUtils.tsx

@@ -6,14 +6,13 @@
  */
 
 import React, {
-  createContext,
-  type ReactNode,
   useCallback,
   useContext,
   useEffect,
   useLayoutEffect,
   useMemo,
   useRef,
+  type ReactNode,
 } from 'react';
 import {useDynamicCallback, ReactContextError} from './reactUtils';
 import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment';
@@ -57,7 +56,7 @@ function useScrollControllerContextValue(): ScrollController {
   );
 }
 
-const ScrollMonitorContext = createContext<ScrollController | undefined>(
+const ScrollMonitorContext = React.createContext<ScrollController | undefined>(
   undefined,
 );
 

packages/docusaurus-theme-common/src/utils/tabGroupChoiceUtils.tsx

@@ -9,7 +9,6 @@ import React, {
   useState,
   useCallback,
   useEffect,
-  createContext,
   useMemo,
   useContext,
   type ReactNode,
@@ -24,7 +23,7 @@ type TabGroupChoiceContextValue = {
   readonly setTabGroupChoices: (groupId: string, newChoice: string) => void;
 };
 
-const TabGroupChoiceContext = createContext<
+const TabGroupChoiceContext = React.createContext<
   TabGroupChoiceContextValue | undefined
 >(undefined);