PageContentFooter.tsx 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. import React from 'react';
  2. import { IPage, IUser } from '@growi/core';
  3. import dynamic from 'next/dynamic';
  4. import { useSWRxCurrentPage } from '~/stores/page';
  5. import { Skelton } from './Skelton';
  6. import styles from './PageContentFooter.module.scss';
  7. const AuthorInfo = dynamic(() => import('./Navbar/AuthorInfo'), {
  8. ssr: false,
  9. loading: () => <Skelton additionalClass={`${styles['page-content-footer-skelton']} mb-3`} />,
  10. });
  11. export type PageContentFooterProps = {
  12. page: IPage,
  13. }
  14. export const PageContentFooter = (props: PageContentFooterProps): JSX.Element => {
  15. const { page } = props;
  16. const {
  17. creator, lastUpdateUser, createdAt, updatedAt,
  18. } = page;
  19. return (
  20. <div className={`${styles['page-content-footer']} page-content-footer py-4 d-edit-none d-print-none}`}>
  21. <div className="grw-container-convertible">
  22. <div className="page-meta">
  23. <AuthorInfo user={creator as IUser} date={createdAt} mode="create" locate="footer" />
  24. <AuthorInfo user={lastUpdateUser as IUser} date={updatedAt} mode="update" locate="footer" />
  25. </div>
  26. </div>
  27. </div>
  28. );
  29. };
  30. export const CurrentPageContentFooter = (): JSX.Element => {
  31. const { data: currentPage } = useSWRxCurrentPage();
  32. if (currentPage == null) {
  33. return <></>;
  34. }
  35. return <PageContentFooter page={currentPage} />;
  36. };