Merge branch 'dev/7.4.x' into support/156162-174081-app-apiv3-routes-biome-1

apps/app/src/client/components/Hotkeys/Subscribers/EditPage.jsx

@@ -7,7 +7,7 @@ import { EditorMode, useEditorMode } from '~/states/ui/editor';
 
 const EditPage = (props) => {
   const isEditable = useIsEditable();
-  const { mutate: mutateEditorMode } = useEditorMode();
+  const { setEditorMode } = useEditorMode();
 
   // setup effect
   useEffect(() => {
@@ -20,11 +20,11 @@ const EditPage = (props) => {
       return;
     }
 
-    mutateEditorMode(EditorMode.Editor);
+    setEditorMode(EditorMode.Editor);
 
     // remove this
     props.onDeleteRender(this);
-  }, [isEditable, mutateEditorMode, props]);
+  }, [isEditable, props, setEditorMode]);
 
   return null;
 };

apps/app/src/client/components/PageEditor/DrawioModal/DrawioModal.tsx

@@ -4,6 +4,7 @@ import React, {
 
 import { Lang } from '@growi/core';
 import { useCodeMirrorEditorIsolated } from '@growi/editor/dist/client/stores/codemirror-editor';
+import { useDrawioModalForEditorStatus, useDrawioModalForEditorActions } from '@growi/editor/dist/states/modal/drawio-for-editor';
 import { LoadingSpinner } from '@growi/ui/dist/components';
 import {
   Modal,
@@ -13,7 +14,6 @@ import {
 import { replaceFocusedDrawioWithEditor, getMarkdownDrawioMxfile } from '~/client/components/PageEditor/markdown-drawio-util-for-editor';
 import { useRendererConfig } from '~/states/server-configurations';
 import { useDrawioModalActions, useDrawioModalStatus } from '~/states/ui/modal/drawio';
-import { useDrawioModalForEditorStatus, useDrawioModalForEditorActions } from '~/states/ui/modal/drawio-for-editor';
 import { useSWRxPersonalSettings } from '~/stores/personal-settings';
 import loggerFactory from '~/utils/logger';
 

apps/app/src/client/components/PageEditor/DrawioModal/dynamic.tsx

@@ -1,17 +1,24 @@
 import type { JSX } from 'react';
 
+import { useDrawioModalForEditorStatus } from '@growi/editor/dist/states/modal/drawio-for-editor';
+
 import { useLazyLoader } from '~/components/utils/use-lazy-loader';
 import { useDrawioModalStatus } from '~/states/ui/modal/drawio';
 
+
 type DrawioModalProps = Record<string, unknown>;
 
 export const DrawioModalLazyLoaded = (): JSX.Element => {
   const status = useDrawioModalStatus();
+  const statusForEditor = useDrawioModalForEditorStatus();
+
+  const isOpened = status?.isOpened ?? false;
+  const isOpenedInEditor = statusForEditor?.isOpened ?? false;
 
   const DrawioModal = useLazyLoader<DrawioModalProps>(
     'drawio-modal',
     () => import('./DrawioModal').then(mod => ({ default: mod.DrawioModal })),
-    status?.isOpened ?? false,
+    isOpened || isOpenedInEditor,
   );
 
   return DrawioModal ? <DrawioModal /> : <></>;

apps/app/src/client/components/PageEditor/HandsontableModal/HandsontableModal.tsx

@@ -2,7 +2,7 @@ import React, {
   useState, useCallback, useMemo, type JSX,
 } from 'react';
 
-import { MarkdownTable, useHandsontableModalForEditorStatus } from '@growi/editor';
+import { MarkdownTable, useHandsontableModalForEditorStatus, useHandsontableModalForEditorActions } from '@growi/editor';
 import { HotTable } from '@handsontable/react';
 import type Handsontable from 'handsontable';
 import { useTranslation } from 'next-i18next';
@@ -36,6 +36,7 @@ export const HandsontableModalSubstance = (): JSX.Element => {
   const handsontableModalData = useHandsontableModalStatus();
   const { close: closeHandsontableModal } = useHandsontableModalActions();
   const handsontableModalForEditorData = useHandsontableModalForEditorStatus();
+  const { close: closeHandsontableModalForEditor } = useHandsontableModalForEditorActions();
 
   const isOpened = handsontableModalData?.isOpened ?? false;
   const isOpendInEditor = handsontableModalForEditorData?.isOpened ?? false;
@@ -155,6 +156,7 @@ export const HandsontableModalSubstance = (): JSX.Element => {
 
   const cancel = () => {
     closeHandsontableModal();
+    closeHandsontableModalForEditor();
     setIsDataImportAreaExpanded(false);
     setIsWindowExpanded(false);
   };

apps/app/src/client/components/PagePathNavSticky/PagePathNavSticky.tsx

@@ -29,8 +29,6 @@ export const PagePathNavSticky = (props: PagePathNavLayoutProps): JSX.Element =>
 
   const isPrinting = usePrintMode();
 
-  const isPrinting = usePrintMode();
-
   const pageControlsX = usePageControlsX();
   const [sidebarWidth] = useCurrentProductNavWidth();
   const { sidebarMode } = useSidebarMode();

apps/app/src/components/Common/PagePathHierarchicalLink/PagePathHierarchicalLink.tsx

@@ -1,4 +1,4 @@
-import { type JSX, memo, useCallback } from 'react';
+import { type FC, type JSX, memo, useCallback } from 'react';
 import Link from 'next/link';
 import urljoin from 'url-join';
 
@@ -17,7 +17,7 @@ type PagePathHierarchicalLinkProps = {
   isInnerElem?: boolean;
 };
 
-export const PagePathHierarchicalLink = memo(
+export const PagePathHierarchicalLink: FC<PagePathHierarchicalLinkProps> = memo(
   (props: PagePathHierarchicalLinkProps): JSX.Element => {
     const {
       linkedPagePath,

apps/app/src/components/PageView/PageViewLayout.tsx

@@ -1,5 +1,6 @@
 import type { JSX, ReactNode } from 'react';
 
+// biome-ignore lint/style/noRestrictedImports: ignore
 import { usePrintMode } from '~/client/services/use-print-mode';
 
 import styles from './PageViewLayout.module.scss';

apps/app/src/features/search/client/components/SearchPage/SearchResultList.tsx

@@ -1,4 +1,8 @@
-import type { ForwardRefRenderFunction } from 'react';
+import type {
+  ForwardRefExoticComponent,
+  ForwardRefRenderFunction,
+  RefAttributes,
+} from 'react';
 import { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
 import {
   type IPageInfoForListing,
@@ -184,4 +188,6 @@ const SearchResultListSubstance: ForwardRefRenderFunction<
   );
 };
 
-export const SearchResultList = forwardRef(SearchResultListSubstance);
+export const SearchResultList: ForwardRefExoticComponent<
+  Props & RefAttributes<ISelectableAll>
+> = forwardRef<ISelectableAll, Props>(SearchResultListSubstance);

apps/app/src/states/ui/modal/drawio-for-editor.ts

@@ -1,28 +0,0 @@
-import { atom, useAtomValue, useSetAtom } from 'jotai';
-
-type DrawioModalForEditorState = {
-  isOpened: boolean;
-  editorKey?: string;
-};
-
-const drawioModalForEditorAtom = atom<DrawioModalForEditorState>({
-  isOpened: false,
-  editorKey: undefined,
-});
-
-export const useDrawioModalForEditorStatus = () => {
-  return useAtomValue(drawioModalForEditorAtom);
-};
-
-export const useDrawioModalForEditorActions = () => {
-  const setModalState = useSetAtom(drawioModalForEditorAtom);
-
-  return {
-    open: (editorKey: string) => {
-      setModalState({ isOpened: true, editorKey });
-    },
-    close: () => {
-      setModalState({ isOpened: false, editorKey: undefined });
-    },
-  };
-};