Merge branch 'fix/153963' into fix/157769-Wider-clipboard-area

apps/app/src/client/components/PagePathNavSticky/PagePathNavSticky.module.scss

@@ -1,6 +1,8 @@
 @use '@growi/core-styles/scss/bootstrap/init' as bs;
 
 .grw-page-path-nav-sticky :global {
+  // width: 100%;
+
   .sticky-inner-wrapper {
     z-index: bs.$zindex-sticky;
   }

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

@@ -67,7 +67,8 @@ const PagePresentationModal = (): JSX.Element => {
   if (!isOpen) {
     return <></>;
   }
-
+  console.log(isEnabledMarp, 'Marp');
+  console.log(rendererOptions, 'renderOption');
   return (
     <Modal
       isOpen={isOpen}

apps/app/src/components/Common/PagePathNav/PagePathNav.module.scss

@@ -4,7 +4,8 @@
 
 .grw-page-path-nav-layout :global {
   .grw-page-path-nav-copydropdown {
-    display: none;
+    visibility: hidden; /* 通常時は非表示（スペースは維持） */
+    // display: none;
     @include bs.media-breakpoint-down(md) {
       display: block;
     }
@@ -15,7 +16,9 @@
   &:global {
     &:hover {
       .grw-page-path-nav-copydropdown {
-        display: block;
+        visibility: visible; /* ホバー時に表示 */
+        // opacity: 1;
+        // display: block;
       }
     }
   }

apps/app/src/components/Common/PagePathNav/PagePathNavLayout.tsx

@@ -1,4 +1,5 @@
-import type { ReactNode } from 'react';
+// import type { ReactNode } from 'react';
+import React, { useState } from 'react';
 
 import dynamic from 'next/dynamic';
 
@@ -19,8 +20,8 @@ export type PagePathNavLayoutProps = {
 }
 
 type Props = PagePathNavLayoutProps & {
-  formerLink?: ReactNode,
-  latterLink?: ReactNode,
+  formerLink?: React.ReactNode,
+  latterLink?: React.ReactNode,
 }
 
 const CopyDropdown = dynamic(() => import('~/client/components/Common/CopyDropdown').then(mod => mod.CopyDropdown), { ssr: false });
@@ -40,6 +41,19 @@ export const PagePathNavLayout = (props: Props): JSX.Element => {
 
   const copyDropdownId = `copydropdown-${pageId}`;
 
+  const [, setIsHovered] = useState(false);
+  const [hideTimeout, setHideTimeout] = useState<NodeJS.Timeout | null>(null);
+
+  const handleMouseEnter = () => {
+    if (hideTimeout) clearTimeout(hideTimeout); // 非表示タイマーをリセット
+    setIsHovered(true); // ボタンを表示
+  };
+
+  const handleMouseLeave = () => {
+    const timeout = setTimeout(() => setIsHovered(false), 3000); // 3秒後にボタンを非表示
+    setHideTimeout(timeout);
+  };
+
   return (
     <div
       className={`${className} ${moduleClass}`}
@@ -55,7 +69,11 @@ export const PagePathNavLayout = (props: Props): JSX.Element => {
             { isWipPage && (
               <span className="badge text-bg-secondary ms-1 me-1">WIP</span>
             )}
-            <span className=" grw-page-path-nav-copydropdown">
+            <span
+              className=" grw-page-path-nav-copydropdown"
+              onMouseEnter={handleMouseEnter}
+              onMouseLeave={handleMouseLeave}
+            >
               <CopyDropdown pageId={pageId} pagePath={pagePath} dropdownToggleId={copyDropdownId} dropdownToggleClassName="p-2">
                 <span className="material-symbols-outlined">content_paste</span>
               </CopyDropdown>

apps/app/src/components/Common/PagePathNavTitle/PagePathNavTitle.module.scss

@@ -4,3 +4,7 @@
   min-height: 75px;
   padding-right: 70px;
 }
+
+.grw-page-path-nav-title:hover {
+  background-color: rgba(0, 0, 0, 0.05); /* ホバー範囲を視覚的に確認したい場合の背景 */
+}

apps/app/src/pages/[[...path]].page.tsx

@@ -237,7 +237,7 @@ const Page: NextPageWithLayout<Props> = (props: Props) => {
   useDefaultIndentSize(props.adminPreferredIndentSize);
   useIsIndentSizeForced(props.isIndentSizeForced);
   useDisableLinkSharing(props.disableLinkSharing);
-  useRendererConfig(props.rendererConfig);
+  // useRendererConfig(props.rendererConfig);
   useIsEnabledMarp(props.rendererConfig.isEnabledMarp);
   // useRendererSettings(props.rendererSettingsStr != null ? JSON.parse(props.rendererSettingsStr) : undefined);
   // useGrowiRendererConfig(props.growiRendererConfigStr != null ? JSON.parse(props.growiRendererConfigStr) : undefined);

apps/app/src/stores-universal/context.tsx

@@ -147,6 +147,7 @@ export const useIsEnabledStaleNotification = (initialData?: boolean): SWRRespons
 };
 
 export const useRendererConfig = (initialData?: RendererConfig): SWRResponse<RendererConfig, any> => {
+  console.log(initialData, 'undifined or null');
   return useContextSWR('growiRendererConfig', initialData);
 };
 

apps/app/src/stores/renderer.tsx

@@ -171,6 +171,11 @@ export const useCustomSidebarOptions = (config?: SWRConfiguration): SWRResponse<
 export const usePresentationViewOptions = (): SWRResponse<RendererOptions, Error> => {
   const { data: currentPagePath } = useCurrentPagePath();
   const { data: rendererConfig } = useRendererConfig();
+  console.log(rendererConfig, 'rendererconfig');
+  if (!rendererConfig) {
+    console.log('RendererConfig is missing.');
+  }
+
 
   const isAllDataValid = currentPagePath != null && rendererConfig != null;