_document.page.tsx 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. /* eslint-disable @next/next/google-font-display */
  2. import React, { type JSX } from 'react';
  3. import type { DocumentContext, DocumentInitialProps } from 'next/document';
  4. import Document, { Head, Html, Main, NextScript } from 'next/document';
  5. import type { Locale } from '@growi/core/dist/interfaces';
  6. import type { GrowiPluginResourceEntries } from '~/features/growi-plugin/server/services';
  7. import type { CrowiRequest } from '~/interfaces/crowi-request';
  8. import loggerFactory from '~/utils/logger';
  9. import { getLocaleAtServerSide } from './utils/commons';
  10. const logger = loggerFactory('growi:page:_document');
  11. type HeadersForGrowiPluginProps = {
  12. pluginResourceEntries: GrowiPluginResourceEntries;
  13. };
  14. const HeadersForGrowiPlugin = (
  15. props: HeadersForGrowiPluginProps,
  16. ): JSX.Element => {
  17. const { pluginResourceEntries } = props;
  18. return (
  19. <>
  20. {pluginResourceEntries.map(([installedPath, href]) => {
  21. if (href.endsWith('.js')) {
  22. // eslint-disable-next-line @next/next/no-sync-scripts
  23. return (
  24. <script type="module" key={`script_${installedPath}`} src={href} />
  25. );
  26. }
  27. if (href.endsWith('.css')) {
  28. // eslint-disable-next-line @next/next/no-sync-scripts
  29. return (
  30. <link rel="stylesheet" key={`link_${installedPath}`} href={href} />
  31. );
  32. }
  33. return <></>;
  34. })}
  35. </>
  36. );
  37. };
  38. interface GrowiDocumentProps {
  39. themeHref: string;
  40. customScript: string | null;
  41. customCss: string | null;
  42. customNoscript: string | null;
  43. pluginResourceEntries: GrowiPluginResourceEntries;
  44. locale: Locale;
  45. }
  46. declare type GrowiDocumentInitialProps = DocumentInitialProps &
  47. GrowiDocumentProps;
  48. class GrowiDocument extends Document<GrowiDocumentInitialProps> {
  49. static override async getInitialProps(
  50. ctx: DocumentContext,
  51. ): Promise<GrowiDocumentInitialProps> {
  52. const initialProps: DocumentInitialProps =
  53. await Document.getInitialProps(ctx);
  54. const req = ctx.req as CrowiRequest;
  55. const { crowi } = req;
  56. const { customizeService } = crowi;
  57. const { themeHref } = customizeService;
  58. const customScript: string | null = customizeService.getCustomScript();
  59. const customCss: string | null = customizeService.getCustomCss();
  60. const customNoscript: string | null = customizeService.getCustomNoscript();
  61. // retrieve plugin manifests
  62. const growiPluginService = await import(
  63. '~/features/growi-plugin/server/services'
  64. ).then((mod) => mod.growiPluginService);
  65. const pluginResourceEntries =
  66. await growiPluginService.retrieveAllPluginResourceEntries();
  67. const locale = getLocaleAtServerSide(req);
  68. return {
  69. ...initialProps,
  70. themeHref,
  71. customScript,
  72. customCss,
  73. customNoscript,
  74. pluginResourceEntries,
  75. locale,
  76. };
  77. }
  78. renderCustomScript(customScript: string | null): JSX.Element {
  79. if (customScript == null || customScript.length === 0) {
  80. return <></>;
  81. }
  82. return (
  83. <script
  84. id="customScript"
  85. // biome-ignore lint/security/noDangerouslySetInnerHtml: ignore
  86. dangerouslySetInnerHTML={{ __html: customScript }}
  87. />
  88. );
  89. }
  90. renderCustomCss(customCss: string | null): JSX.Element {
  91. if (customCss == null || customCss.length === 0) {
  92. return <></>;
  93. }
  94. // biome-ignore lint/security/noDangerouslySetInnerHtml: ignore
  95. return <style dangerouslySetInnerHTML={{ __html: customCss }} />;
  96. }
  97. renderCustomNoscript(customNoscript: string | null): JSX.Element {
  98. if (customNoscript == null || customNoscript.length === 0) {
  99. return <></>;
  100. }
  101. // biome-ignore lint/security/noDangerouslySetInnerHtml: ignore
  102. return <noscript dangerouslySetInnerHTML={{ __html: customNoscript }} />;
  103. }
  104. override render(): JSX.Element {
  105. const {
  106. customCss,
  107. customScript,
  108. customNoscript,
  109. themeHref,
  110. pluginResourceEntries,
  111. locale,
  112. } = this.props;
  113. return (
  114. <Html lang={locale}>
  115. <Head>
  116. {this.renderCustomScript(customScript)}
  117. <link rel="stylesheet" key="link-theme" href={themeHref} />
  118. <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
  119. <link rel="alternate icon" href="/favicon.ico" />
  120. <HeadersForGrowiPlugin
  121. pluginResourceEntries={pluginResourceEntries}
  122. />
  123. {this.renderCustomCss(customCss)}
  124. </Head>
  125. <body>
  126. {this.renderCustomNoscript(customNoscript)}
  127. <Main />
  128. <NextScript />
  129. </body>
  130. </Html>
  131. );
  132. }
  133. }
  134. export default GrowiDocument;