customize.page.tsx 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. import { useEffect, useMemo } from 'react';
  2. import type {
  3. GetServerSideProps,
  4. GetServerSidePropsContext,
  5. NextPage,
  6. } from 'next';
  7. import dynamic from 'next/dynamic';
  8. import Head from 'next/head';
  9. import { useTranslation } from 'next-i18next';
  10. import type { Container } from 'unstated';
  11. import { Provider } from 'unstated';
  12. import type { CrowiRequest } from '~/interfaces/crowi-request';
  13. import type { CommonProps } from '~/pages/utils/commons';
  14. import { generateCustomTitle } from '~/pages/utils/commons';
  15. import { configManager } from '~/server/service/config-manager';
  16. import {
  17. useCurrentUser,
  18. useCustomizeTitle,
  19. useIsCustomizedLogoUploaded,
  20. } from '~/stores-universal/context';
  21. import { retrieveServerSideProps } from '../../utils/admin-page-util';
  22. const AdminLayout = dynamic(() => import('~/components/Layout/AdminLayout'), {
  23. ssr: false,
  24. });
  25. const CustomizeSettingContents = dynamic(
  26. () => import('~/client/components/Admin/Customize/Customize'),
  27. { ssr: false },
  28. );
  29. const ForbiddenPage = dynamic(
  30. () =>
  31. import('~/client/components/Admin/ForbiddenPage').then(
  32. (mod) => mod.ForbiddenPage,
  33. ),
  34. { ssr: false },
  35. );
  36. type Props = CommonProps & {
  37. customizeTitle?: string;
  38. isCustomizedLogoUploaded: boolean;
  39. };
  40. const AdminCustomizeSettingsPage: NextPage<Props> = (props) => {
  41. const { t } = useTranslation('admin');
  42. useCustomizeTitle(props.customizeTitle);
  43. useCurrentUser(props.currentUser ?? null);
  44. useIsCustomizedLogoUploaded(props.isCustomizedLogoUploaded);
  45. const componentTitle = t('customize_settings.customize_settings');
  46. const pageTitle = generateCustomTitle(props, componentTitle);
  47. const injectableContainers: Container<any>[] = useMemo(() => [], []);
  48. useEffect(() => {
  49. (async () => {
  50. const AdminCustomizeContainer = (
  51. await import('~/client/services/AdminCustomizeContainer')
  52. ).default;
  53. const adminCustomizeContainer = new AdminCustomizeContainer();
  54. injectableContainers.push(adminCustomizeContainer);
  55. })();
  56. }, [injectableContainers]);
  57. if (props.isAccessDeniedForNonAdminUser) {
  58. return <ForbiddenPage />;
  59. }
  60. return (
  61. <Provider inject={[...injectableContainers]}>
  62. <AdminLayout componentTitle={componentTitle}>
  63. <Head>
  64. <title>{pageTitle}</title>
  65. </Head>
  66. <CustomizeSettingContents />
  67. </AdminLayout>
  68. </Provider>
  69. );
  70. };
  71. const injectServerConfigurations = async (
  72. context: GetServerSidePropsContext,
  73. props: Props,
  74. ): Promise<void> => {
  75. const req: CrowiRequest = context.req as CrowiRequest;
  76. const { crowi } = req;
  77. props.customizeTitle = crowi.configManager.getConfig('customize:title');
  78. props.isCustomizedLogoUploaded =
  79. await crowi.attachmentService.isBrandLogoExist();
  80. };
  81. export const getServerSideProps: GetServerSideProps = async (
  82. context: GetServerSidePropsContext,
  83. ) => {
  84. const props = await retrieveServerSideProps(
  85. context,
  86. injectServerConfigurations,
  87. );
  88. return props;
  89. };
  90. export default AdminCustomizeSettingsPage;