BasicLayout.tsx 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. import dynamic from "next/dynamic";
  2. import type { JSX, ReactNode } from 'react';
  3. // eslint-disable-next-line no-restricted-imports
  4. import { PageAccessoriesModalLazyLoaded } from "~/client/components/PageAccessoriesModal";
  5. // eslint-disable-next-line no-restricted-imports
  6. import { PageDeleteModalLazyLoaded } from "~/client/components/PageDeleteModal";
  7. // eslint-disable-next-line no-restricted-imports
  8. import { PageDuplicateModalLazyLoaded } from "~/client/components/PageDuplicateModal";
  9. // eslint-disable-next-line no-restricted-imports
  10. import { PageRenameModalLazyLoaded } from "~/client/components/PageRenameModal";
  11. // eslint-disable-next-line no-restricted-imports
  12. import { ShortcutsModalLazyLoaded } from "~/client/components/ShortcutsModal";
  13. import styles from "./BasicLayout.module.scss";
  14. import { RawLayout } from "./RawLayout";
  15. const AiAssistantSidebar = dynamic(
  16. () =>
  17. import(
  18. "~/features/openai/client/components/AiAssistant/AiAssistantSidebar/AiAssistantSidebar"
  19. ).then((mod) => mod.AiAssistantSidebar),
  20. { ssr: false },
  21. );
  22. const moduleClass = styles["grw-basic-layout"] ?? "";
  23. const Sidebar = dynamic(
  24. () => import("~/client/components/Sidebar").then((mod) => mod.Sidebar),
  25. { ssr: false },
  26. );
  27. const AlertSiteUrlUndefined = dynamic(
  28. () =>
  29. import("~/client/components/AlertSiteUrlUndefined").then(
  30. (mod) => mod.AlertSiteUrlUndefined,
  31. ),
  32. { ssr: false },
  33. );
  34. const DeleteAttachmentModal = dynamic(
  35. () =>
  36. import("~/client/components/PageAttachment/DeleteAttachmentModal").then(
  37. (mod) => mod.DeleteAttachmentModal,
  38. ),
  39. { ssr: false },
  40. );
  41. const HotkeysManager = dynamic(
  42. () => import("~/client/components/Hotkeys/HotkeysManager"),
  43. { ssr: false },
  44. );
  45. const GrowiNavbarBottom = dynamic(
  46. () =>
  47. import("~/client/components/Navbar/GrowiNavbarBottom").then(
  48. (mod) => mod.GrowiNavbarBottom,
  49. ),
  50. { ssr: false },
  51. );
  52. const SystemVersion = dynamic(
  53. () => import("~/client/components/SystemVersion"),
  54. { ssr: false },
  55. );
  56. const PutbackPageModal = dynamic(
  57. () => import("~/client/components/PutbackPageModal"),
  58. { ssr: false },
  59. );
  60. // Page modals
  61. const PageCreateModal = dynamic(
  62. () => import("~/client/components/PageCreateModal"),
  63. { ssr: false },
  64. );
  65. const PagePresentationModal = dynamic(
  66. () => import("~/client/components/PagePresentationModal"),
  67. { ssr: false },
  68. );
  69. const GrantedGroupsInheritanceSelectModal = dynamic(
  70. () => import("~/client/components/GrantedGroupsInheritanceSelectModal"),
  71. { ssr: false },
  72. );
  73. const DeleteBookmarkFolderModal = dynamic(
  74. () =>
  75. import("~/client/components/DeleteBookmarkFolderModal").then(
  76. (mod) => mod.DeleteBookmarkFolderModal,
  77. ),
  78. { ssr: false },
  79. );
  80. const SearchModal = dynamic(
  81. () => import("~/features/search/client/components/SearchModal"),
  82. { ssr: false },
  83. );
  84. const PageBulkExportSelectModal = dynamic(
  85. () =>
  86. import(
  87. "~/features/page-bulk-export/client/components/PageBulkExportSelectModal"
  88. ),
  89. { ssr: false },
  90. );
  91. const AiAssistantManagementModal = dynamic(
  92. () =>
  93. import(
  94. "~/features/openai/client/components/AiAssistant/AiAssistantManagementModal/AiAssistantManagementModal"
  95. ).then((mod) => mod.AiAssistantManagementModal),
  96. { ssr: false },
  97. );
  98. const PageSelectModal = dynamic(
  99. () =>
  100. import("~/client/components/PageSelectModal/PageSelectModal").then(
  101. (mod) => mod.PageSelectModal,
  102. ),
  103. { ssr: false },
  104. );
  105. type Props = {
  106. children?: ReactNode;
  107. className?: string;
  108. };
  109. export const BasicLayout = ({ children, className }: Props): JSX.Element => {
  110. return (
  111. <RawLayout className={`${moduleClass} ${className ?? ""}`}>
  112. <div className="page-wrapper flex-row">
  113. <div className="z-2 d-print-none">
  114. <Sidebar />
  115. </div>
  116. <div className="d-flex flex-grow-1 flex-column mw-0 z-1">
  117. {/* neccessary for nested {children} make expanded */}
  118. <AlertSiteUrlUndefined />
  119. {children}
  120. </div>
  121. <AiAssistantSidebar />
  122. </div>
  123. <GrowiNavbarBottom />
  124. <SearchModal />
  125. <PageCreateModal />
  126. <PageDuplicateModalLazyLoaded />
  127. <PageDeleteModalLazyLoaded />
  128. <PageRenameModalLazyLoaded />
  129. <PageAccessoriesModalLazyLoaded />
  130. <DeleteAttachmentModal />
  131. <DeleteBookmarkFolderModal />
  132. <PutbackPageModal />
  133. <PageSelectModal />
  134. <AiAssistantManagementModal />
  135. <PagePresentationModal />
  136. <HotkeysManager />
  137. <ShortcutsModalLazyLoaded />
  138. <PageBulkExportSelectModal />
  139. <GrantedGroupsInheritanceSelectModal />
  140. <SystemVersion showShortcutsButton />
  141. </RawLayout>
  142. );
  143. };