omit expandContainer

packages/app/src/components/Layout/BasicLayout.tsx

@@ -4,6 +4,9 @@ import dynamic from 'next/dynamic';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 
+import { useIsContainerFluid } from '~/stores/context';
+import { useSWRxCurrentPage } from '~/stores/page';
+
 import { GrowiNavbar } from '../Navbar/GrowiNavbar';
 import Sidebar from '../Sidebar';
 
@@ -28,15 +31,20 @@ const Fab = dynamic(() => import('../Fab').then(mod => mod.Fab), { ssr: false })
 
 type Props = {
   className?: string,
-  expandContainer?: boolean,
   children?: ReactNode
 }
 
-export const BasicLayout = ({
-  children, className, expandContainer,
-}: Props): JSX.Element => {
+export const BasicLayout = ({ children, className }: Props): JSX.Element => {
+  const { data: currentPage } = useSWRxCurrentPage();
+  const { data: dataIsContainerFluid } = useIsContainerFluid();
+
+  const isContainerFluidEachPage = currentPage == null || !('expandContentWidth' in currentPage)
+    ? null
+    : currentPage.expandContentWidth;
+  const isContainerFluidDefault = dataIsContainerFluid;
+  const isContainerFluid = isContainerFluidEachPage ?? isContainerFluidDefault;
 
-  const myClassName = `${className ?? ''} ${expandContainer ? 'growi-layout-fluid' : ''}`;
+  const myClassName = `${className ?? ''} ${isContainerFluid ? 'growi-layout-fluid' : ''}`;
 
   return (
     <RawLayout className={myClassName}>

packages/app/src/components/Layout/ShareLinkLayout.tsx

@@ -2,6 +2,9 @@ import React, { ReactNode } from 'react';
 
 import dynamic from 'next/dynamic';
 
+import { useIsContainerFluid } from '~/stores/context';
+import { useSWRxCurrentPage } from '~/stores/page';
+
 import { GrowiNavbar } from '../Navbar/GrowiNavbar';
 
 import { RawLayout } from './RawLayout';
@@ -16,16 +19,20 @@ const Fab = dynamic(() => import('../Fab').then(mod => mod.Fab), { ssr: false })
 
 
 type Props = {
-  className?: string,
-  expandContainer?: boolean,
   children?: ReactNode
 }
 
-export const ShareLinkLayout = ({
-  children, className, expandContainer,
-}: Props): JSX.Element => {
+export const ShareLinkLayout = ({ children }: Props): JSX.Element => {
+  const { data: currentPage } = useSWRxCurrentPage();
+  const { data: dataIsContainerFluid } = useIsContainerFluid();
+
+  const isContainerFluidEachPage = currentPage == null || !('expandContentWidth' in currentPage)
+    ? null
+    : currentPage.expandContentWidth;
+  const isContainerFluidDefault = dataIsContainerFluid;
+  const isContainerFluid = isContainerFluidEachPage ?? isContainerFluidDefault;
 
-  const myClassName = `${className ?? ''} ${expandContainer ? 'growi-layout-fluid' : ''}`;
+  const myClassName = `${isContainerFluid ? 'growi-layout-fluid' : ''}`;
 
   return (
     <RawLayout className={myClassName}>

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

@@ -260,7 +260,7 @@ const Page: NextPage<Props> = (props: Props) => {
   // useIsNotCreatable(props.isForbidden || !isCreatablePage(pagePath)); // TODO: need to include props.isIdentical
   useCurrentPathname(props.currentPathname);
 
-  const { data: currentPage } = useSWRxCurrentPage(undefined, pageWithMeta?.data ?? null); // store initial data
+  useSWRxCurrentPage(undefined, pageWithMeta?.data ?? null); // store initial data
 
   useEditingMarkdown(pageWithMeta?.data.revision?.body);
 
@@ -296,12 +296,6 @@ const Page: NextPage<Props> = (props: Props) => {
 
   const isTopPagePath = isTopPage(pageWithMeta?.data.path ?? '');
 
-  const isContainerFluidEachPage = currentPage == null || !('expandContentWidth' in currentPage)
-    ? null
-    : currentPage.expandContentWidth;
-  const isContainerFluidDefault = props.isContainerFluid;
-  const isContainerFluid = isContainerFluidEachPage ?? isContainerFluidDefault;
-
   const title = generateCustomTitle(props, 'GROWI');
 
   return (
@@ -311,7 +305,7 @@ const Page: NextPage<Props> = (props: Props) => {
       </Head>
       <DrawioViewerScript />
 
-      <BasicLayout className={classNames.join(' ')} expandContainer={isContainerFluid}>
+      <BasicLayout>
 
         <div className="h-100 d-flex flex-column justify-content-between">
           <header className="py-0 position-relative">

packages/app/src/pages/share/[[...path]].page.tsx

@@ -23,7 +23,7 @@ import { RendererConfig } from '~/interfaces/services/renderer';
 import { IShareLinkHasId } from '~/interfaces/share-link';
 import {
   useCurrentUser, useCurrentPathname, useCurrentPageId, useRendererConfig, useIsSearchPage,
-  useShareLinkId, useIsSearchServiceConfigured, useIsSearchServiceReachable, useIsSearchScopeChildrenAsDefault, useDrawioUri,
+  useShareLinkId, useIsSearchServiceConfigured, useIsSearchServiceReachable, useIsSearchScopeChildrenAsDefault, useDrawioUri, useIsContainerFluid,
 } from '~/stores/context';
 import { useDescendantsPageListModal } from '~/stores/modal';
 import loggerFactory from '~/utils/logger';
@@ -59,6 +59,7 @@ const SharedPage: NextPage<Props> = (props: Props) => {
   useIsSearchServiceReachable(props.isSearchServiceReachable);
   useIsSearchScopeChildrenAsDefault(props.isSearchScopeChildrenAsDefault);
   useDrawioUri(props.drawioUri);
+  useIsContainerFluid(props.isContainerFluid);
 
   const { open: openDescendantPageListModal } = useDescendantsPageListModal();
   const { t } = useTranslation();
@@ -77,7 +78,7 @@ const SharedPage: NextPage<Props> = (props: Props) => {
 
       <DrawioViewerScript />
 
-      <ShareLinkLayout expandContainer={props.isContainerFluid}>
+      <ShareLinkLayout>
         <div className="h-100 d-flex flex-column justify-content-between">
           <header className="py-0 position-relative">
             {isShowSharedPage && <GrowiContextualSubNavigation isLinkSharingDisabled={props.disableLinkSharing} />}