|
@@ -1,19 +1,22 @@
|
|
|
import React, { FC, memo } from 'react';
|
|
import React, { FC, memo } from 'react';
|
|
|
|
|
|
|
|
-import { Ref } from '@growi/core';
|
|
|
|
|
|
|
+import { Nullable, Ref } from '@growi/core';
|
|
|
|
|
+import dynamic from 'next/dynamic';
|
|
|
|
|
+
|
|
|
|
|
+import { MySkelton } from '~/components/MySkelton';
|
|
|
|
|
|
|
|
import { IUser } from '../interfaces/user';
|
|
import { IUser } from '../interfaces/user';
|
|
|
|
|
|
|
|
-import AuthorInfo from './Navbar/AuthorInfo';
|
|
|
|
|
|
|
+const AuthorInfo = dynamic(() => import('./Navbar/AuthorInfo'), { ssr: false });
|
|
|
|
|
|
|
|
type Props = {
|
|
type Props = {
|
|
|
- createdAt: Date,
|
|
|
|
|
- updatedAt: Date,
|
|
|
|
|
|
|
+ createdAt: Nullable<Date> | undefined, // TODO: check createdAt type
|
|
|
|
|
+ updatedAt: Nullable<Date> | undefined, // TODO: check updatedAt type
|
|
|
creator: any,
|
|
creator: any,
|
|
|
revisionAuthor: Ref<IUser>,
|
|
revisionAuthor: Ref<IUser>,
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-const PageContentFooter:FC<Props> = memo((props:Props):JSX.Element => {
|
|
|
|
|
|
|
+export const PageContentFooter:FC<Props> = memo((props:Props):JSX.Element => {
|
|
|
const {
|
|
const {
|
|
|
createdAt, updatedAt, creator, revisionAuthor,
|
|
createdAt, updatedAt, creator, revisionAuthor,
|
|
|
} = props;
|
|
} = props;
|
|
@@ -22,8 +25,17 @@ const PageContentFooter:FC<Props> = memo((props:Props):JSX.Element => {
|
|
|
<div className="page-content-footer py-4 d-edit-none d-print-none">
|
|
<div className="page-content-footer py-4 d-edit-none d-print-none">
|
|
|
<div className="grw-container-convertible">
|
|
<div className="grw-container-convertible">
|
|
|
<div className="page-meta">
|
|
<div className="page-meta">
|
|
|
- <AuthorInfo user={creator as IUser} date={createdAt} mode="create" locate="footer" />
|
|
|
|
|
- <AuthorInfo user={revisionAuthor as IUser} date={updatedAt} mode="update" locate="footer" />
|
|
|
|
|
|
|
+ {createdAt === null || updatedAt === null ? (
|
|
|
|
|
+ <>
|
|
|
|
|
+ <MySkelton />
|
|
|
|
|
+ <MySkelton />
|
|
|
|
|
+ </>
|
|
|
|
|
+ ) : (
|
|
|
|
|
+ <>
|
|
|
|
|
+ <AuthorInfo user={creator as IUser} date={createdAt} mode="create" locate="footer" />
|
|
|
|
|
+ <AuthorInfo user={revisionAuthor as IUser} date={updatedAt} mode="update" locate="footer" />
|
|
|
|
|
+ </>
|
|
|
|
|
+ )}
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
@@ -31,5 +43,3 @@ const PageContentFooter:FC<Props> = memo((props:Props):JSX.Element => {
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
PageContentFooter.displayName = 'PageContentFooter';
|
|
PageContentFooter.displayName = 'PageContentFooter';
|
|
|
-
|
|
|
|
|
-export default PageContentFooter;
|
|
|