Not show control when guest user

packages/app/src/components/Sidebar/PageTree.tsx

@@ -2,7 +2,9 @@ import React, { FC, memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { useSWRxV5MigrationStatus } from '~/stores/page-listing';
-import { useCurrentPagePath, useCurrentPageId, useTargetAndAncestors } from '~/stores/context';
+import {
+  useCurrentPagePath, useCurrentPageId, useTargetAndAncestors, useIsGuestUser,
+} from '~/stores/context';
 
 import ItemsTree from './PageTree/ItemsTree';
 import PrivateLegacyPages from './PageTree/PrivateLegacyPages';
@@ -12,16 +14,24 @@ import { IPageForPageDeleteModal } from '../PageDeleteModal';
 const PageTree: FC = memo(() => {
   const { t } = useTranslation();
 
+  const { data: isGuestUser } = useIsGuestUser();
   const { data: currentPath } = useCurrentPagePath();
   const { data: targetId } = useCurrentPageId();
   const { data: targetAndAncestorsData } = useTargetAndAncestors();
 
-  const { data: migrationStatus } = useSWRxV5MigrationStatus();
+  const { data: migrationStatus } = useSWRxV5MigrationStatus(!isGuestUser);
 
   // for delete modal
   const [isDeleteModalOpen, setDeleteModalOpen] = useState(false);
   const [pagesToDelete, setPagesToDelete] = useState<IPageForPageDeleteModal[]>([]);
 
+  /*
+   * dependencies
+   */
+  if (isGuestUser == null) {
+    return null;
+  }
+
   const onClickDeleteByPage = (page: IPageForPageDeleteModal) => {
     setDeleteModalOpen(true);
     setPagesToDelete([page]);
@@ -41,6 +51,7 @@ const PageTree: FC = memo(() => {
 
       <div className="grw-sidebar-content-body">
         <ItemsTree
+          isGuestUser={isGuestUser}
           targetPath={path}
           targetId={targetId}
           targetAndAncestorsData={targetAndAncestorsData}
@@ -55,7 +66,7 @@ const PageTree: FC = memo(() => {
 
       <div className="grw-sidebar-content-footer">
         {
-          migrationStatus?.migratablePagesCount != null && migrationStatus.migratablePagesCount !== 0 && (
+          !isGuestUser && migrationStatus?.migratablePagesCount != null && migrationStatus.migratablePagesCount !== 0 && (
             <PrivateLegacyPages />
           )
         }

packages/app/src/components/Sidebar/PageTree/Item.tsx

@@ -13,6 +13,7 @@ import { IPageForPageDeleteModal } from '~/components/PageDeleteModal';
 
 
 interface ItemProps {
+  isGuestUser: boolean
   itemNode: ItemNode
   targetId?: string
   isOpen?: boolean
@@ -87,7 +88,7 @@ const ItemCount: FC = () => {
 const Item: FC<ItemProps> = (props: ItemProps) => {
   const { t } = useTranslation();
   const {
-    itemNode, targetId, isOpen: _isOpen = false, onClickDeleteByPage,
+    itemNode, targetId, isOpen: _isOpen = false, onClickDeleteByPage, isGuestUser,
   } = props;
 
   const { page, children } = itemNode;
@@ -192,25 +193,30 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
           <ItemCount />
         </div>
         <div className="grw-pagetree-control d-none">
-          <ItemControl
-            page={page}
-            onClickDeleteButtonHandler={onClickDeleteButtonHandler}
-            onClickPlusButtonHandler={() => { setNewPageInputShown(true) }}
-          />
+          {!isGuestUser && (
+            <ItemControl
+              page={page}
+              onClickDeleteButtonHandler={onClickDeleteButtonHandler}
+              onClickPlusButtonHandler={() => { setNewPageInputShown(true) }}
+            />
+          )}
         </div>
       </div>
 
-      <ClosableTextInput
-        isShown={isNewPageInputShown}
-        placeholder={t('Input title')}
-        onClickOutside={() => { setNewPageInputShown(false) }}
-        onPressEnter={onPressEnterHandler}
-        inputValidator={inputValidator}
-      />
+      {!isGuestUser && (
+        <ClosableTextInput
+          isShown={isNewPageInputShown}
+          placeholder={t('Input title')}
+          onClickOutside={() => { setNewPageInputShown(false) }}
+          onPressEnter={onPressEnterHandler}
+          inputValidator={inputValidator}
+        />
+      )}
       {
         isOpen && hasChildren() && currentChildren.map(node => (
           <Item
             key={node.page._id}
+            isGuestUser={isGuestUser}
             itemNode={node}
             isOpen={false}
             onClickDeleteByPage={onClickDeleteByPage}

packages/app/src/components/Sidebar/PageTree/ItemsTree.tsx

@@ -43,6 +43,7 @@ const generateInitialNodeAfterResponse = (ancestorsChildren: Record<string, Part
 };
 
 type ItemsTreeProps = {
+  isGuestUser: boolean
   targetPath: string
   targetId?: string
   targetAndAncestorsData?: TargetAndAncestors
@@ -57,11 +58,18 @@ type ItemsTreeProps = {
 }
 
 const renderByInitialNode = (
-    initialNode: ItemNode, DeleteModal: JSX.Element, targetId?: string, onClickDeleteByPage?: (page: IPageForPageDeleteModal) => void,
+    initialNode: ItemNode, DeleteModal: JSX.Element, isGuestUser: boolean, targetId?: string, onClickDeleteByPage?: (page: IPageForPageDeleteModal) => void,
 ): JSX.Element => {
   return (
     <div className="grw-pagetree p-3">
-      <Item key={initialNode.page.path} targetId={targetId} itemNode={initialNode} isOpen onClickDeleteByPage={onClickDeleteByPage} />
+      <Item
+        key={initialNode.page.path}
+        targetId={targetId}
+        itemNode={initialNode}
+        isOpen
+        isGuestUser={isGuestUser}
+        onClickDeleteByPage={onClickDeleteByPage}
+      />
       {DeleteModal}
     </div>
   );
@@ -74,7 +82,7 @@ const renderByInitialNode = (
 const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
   const {
     targetPath, targetId, targetAndAncestorsData, isDeleteModalOpen, pagesToDelete, isAbleToDeleteCompletely, isDeleteCompletelyModal, onCloseDelete,
-    onClickDeleteByPage,
+    onClickDeleteByPage, isGuestUser,
   } = props;
 
   const { data: ancestorsChildrenData, error: error1 } = useSWRxPageAncestorsChildren(targetPath);
@@ -101,7 +109,7 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
    */
   if (ancestorsChildrenData != null && rootPageData != null) {
     const initialNode = generateInitialNodeAfterResponse(ancestorsChildrenData.ancestorsChildren, new ItemNode(rootPageData.rootPage));
-    return renderByInitialNode(initialNode, DeleteModal, targetId, onClickDeleteByPage);
+    return renderByInitialNode(initialNode, DeleteModal, isGuestUser, targetId, onClickDeleteByPage);
   }
 
   /*
@@ -109,7 +117,7 @@ const ItemsTree: FC<ItemsTreeProps> = (props: ItemsTreeProps) => {
    */
   if (targetAndAncestorsData != null) {
     const initialNode = generateInitialNodeBeforeResponse(targetAndAncestorsData.targetAndAncestors);
-    return renderByInitialNode(initialNode, DeleteModal, targetId, onClickDeleteByPage);
+    return renderByInitialNode(initialNode, DeleteModal, isGuestUser, targetId, onClickDeleteByPage);
   }
 
   return null;

packages/app/src/stores/page-listing.tsx

@@ -45,9 +45,11 @@ export const useSWRxPageChildren = (
   );
 };
 
-export const useSWRxV5MigrationStatus = (): SWRResponse<V5MigrationStatus, Error> => {
+export const useSWRxV5MigrationStatus = (
+    shouldFetch = true,
+): SWRResponse<V5MigrationStatus, Error> => {
   return useSWR(
-    '/pages/v5-migration-status',
+    shouldFetch ? '/pages/v5-migration-status' : null,
     endpoint => apiv3Get(endpoint).then((response) => {
       return {
         migratablePagesCount: response.data.migratablePagesCount,