remove RevisionAuthor and integrate it into PageCreator

src/client/js/components/Navbar/GrowiSubNavigation.jsx

@@ -20,7 +20,6 @@ import LikeButton from '../LikeButton';
 import BookmarkButton from '../BookmarkButton';
 
 import PageCreator from './PageCreator';
-import RevisionAuthor from './RevisionAuthor';
 import DrawerToggler from './DrawerToggler';
 import UserPicture from '../User/UserPicture';
 
@@ -202,12 +201,12 @@ const GrowiSubNavigation = (props) => {
           <ul className="authors text-nowrap border-left d-none d-lg-block d-edit-none">
             { creator != null && (
               <li className="pb-1">
-                <PageCreator creator={creator} createdAt={createdAt} />
+                <PageCreator user={creator} date={createdAt} />
               </li>
             ) }
             { revisionAuthor != null && (
               <li className="mt-1 pt-1 border-top">
-                <RevisionAuthor revisionAuthor={revisionAuthor} updatedAt={updatedAt} />
+                <PageCreator user={revisionAuthor} date={updatedAt} mode="update" />
               </li>
             ) }
           </ul>

src/client/js/components/Navbar/PageCreator.jsx

@@ -5,31 +5,57 @@ import { userPageRoot } from '@commons/util/path-utils';
 
 import UserPicture from '../User/UserPicture';
 
+const LabelNormal = ({ mode, user, date }) => {
+  const infoLabel = mode === 'create'
+    ? 'Created by'
+    : 'Updated by';
+  const userLabel = user != null
+    ? <a href={userPageRoot(user)}>{user.name}</a>
+    : <i>Unknown</i>;
+
+  return (
+    <div>
+      <div>{infoLabel} {userLabel}</div>
+      <div className="text-muted text-date">{date}</div>
+    </div>
+  );
+};
+
+const LabelCompact = ({ mode, date }) => {
+  const infoLabel = mode === 'create'
+    ? 'Created at'
+    : 'Updated at';
+
+  return <div>{infoLabel} <span className="text-muted">{date}</span></div>;
+};
+
 const PageCreator = (props) => {
-  const { creator, createdAt, isCompactMode } = props;
-  const creatInfo = isCompactMode
-    ? (<div>Created at <span className="text-muted">{createdAt}</span></div>)
-    : (<div><div>Created by <a href={userPageRoot(creator)}>{creator.name}</a></div><div className="text-muted text-date">{createdAt}</div></div>);
+  const { user, isCompactMode } = props;
+
+  const Label = isCompactMode ? LabelCompact : LabelNormal;
   const pictureSize = isCompactMode ? 'xs' : 'sm';
 
   return (
     <div className="d-flex align-items-center">
       <div className="mr-2">
-        <UserPicture user={creator} size={pictureSize} />
+        <UserPicture user={user} size={pictureSize} />
       </div>
-      {creatInfo}
+      <Label {...props} />
     </div>
   );
 };
 
 PageCreator.propTypes = {
-
-  creator: PropTypes.object.isRequired,
-  createdAt: PropTypes.string.isRequired,
+  date: PropTypes.string.isRequired,
+  user: PropTypes.object,
+  mode: PropTypes.oneOf('create', 'update'),
   isCompactMode: PropTypes.bool,
 };
+LabelNormal.propTypes = PageCreator.propTypes;
+LabelCompact.propTypes = PageCreator.propTypes;
 
 PageCreator.defaultProps = {
+  mode: 'create',
   isCompactMode: false,
 };
 

src/client/js/components/Navbar/RevisionAuthor.jsx

@@ -1,41 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { userPageRoot } from '@commons/util/path-utils';
-
-import UserPicture from '../User/UserPicture';
-
-const RevisionAuthor = (props) => {
-  const { revisionAuthor, updatedAt, isCompactMode } = props;
-  const updateInfo = isCompactMode
-    ? (<div>Updated at <span className="text-muted">{updatedAt}</span></div>)
-    : (
-      <div>
-        <div>Updated by <a href={userPageRoot(revisionAuthor)}>{revisionAuthor.name}</a></div>
-        <div className="text-muted text-date">{updatedAt}</div>
-      </div>
-    );
-  const pictureSize = isCompactMode ? 'xs' : 'sm';
-
-  return (
-    <div className="d-flex align-items-center">
-      <div className="mr-2">
-        <UserPicture user={revisionAuthor} size={pictureSize} />
-      </div>
-      {updateInfo}
-    </div>
-  );
-};
-
-RevisionAuthor.propTypes = {
-
-  revisionAuthor: PropTypes.object.isRequired,
-  updatedAt: PropTypes.string.isRequired,
-  isCompactMode: PropTypes.bool,
-};
-
-RevisionAuthor.defaultProps = {
-  isCompactMode: false,
-};
-
-export default RevisionAuthor;