Merge pull request #2993 from weseek/fix/3604-4276-fix-not-exist-user-page

Fix/3604 4276 fix not exist user page

src/client/js/app.jsx

@@ -126,7 +126,7 @@ if (pageContainer.state.path != null) {
     'page': <Page />,
     'grw-subnav-container': <GrowiSubNavigation />,
     'grw-subnav-switcher-container': <GrowiSubNavigationSwitcher />,
-    'user-info': <UserInfo />,
+    'user-info': <UserInfo pageUser={pageContainer.state.pageUser} />,
     'display-switcher': <DisplaySwitcher />,
   });
 }

src/client/js/components/User/UserInfo.jsx

@@ -1,18 +1,18 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 
-import PageContainer from '../../services/PageContainer';
-import { withUnstatedContainers } from '../UnstatedUtils';
-
 import UserPicture from './UserPicture';
 
 const UserInfo = (props) => {
+  const { pageUser } = props;
 
-  const { pageContainer } = props;
-  const pageUser = pageContainer.state.pageUser;
+  // do not display when the user does not exist
+  if (pageUser == null) {
+    return null;
+  }
 
   return (
-    <div className="grw-users-info d-flex align-items-center d-edit-none">
+    <div className="grw-users-info d-flex align-items-center d-edit-none pb-2 border-bottom">
       <UserPicture user={pageUser} />
 
       <div className="users-meta">
@@ -35,9 +35,7 @@ const UserInfo = (props) => {
 
 
 UserInfo.propTypes = {
-  pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
+  pageUser: PropTypes.object,
 };
 
-const UserInfoWrapper = withUnstatedContainers(UserInfo, [PageContainer]);
-
-export default UserInfoWrapper;
+export default UserInfo;

src/server/views/layout-growi/user_page.html

@@ -6,14 +6,13 @@
 {% endblock %}
 
 {% block content_main %}
-  <div class="border-bottom pb-2">
-    <div class="user-info" id="user-info">
-    </div>
-  </div>
 
   <div class="d-flex justify-content-between">
     <div class="grw-page-content-container flex-grow-1">
 
+      <div class="user-info" id="user-info">
+      </div>
+
       {#
         #   Because this block has content like 'Bookmarks' or 'Recent Created' whose height changes dynamically,
         #   setting of 'revision-toc' (affix) is hindered.