implement trash page

apps/app/src/client/components/InAppNotification/InAppNotificationPage.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from 'next-i18next';
 
 import { apiv3Put } from '~/client/util/apiv3-client';
 import { InAppNotificationStatuses } from '~/interfaces/in-app-notification';
-import { useShowPageLimitationXL } from '~/stores-universal/context';
+import { useShowPageLimitationXL } from '~/states/server-configurations';
 import { useSWRxInAppNotifications, useSWRxInAppNotificationStatus } from '~/stores/in-app-notification';
 
 import CustomNavAndContents from '../CustomNavigation/CustomNavAndContents';
@@ -17,7 +17,7 @@ import InAppNotificationList from './InAppNotificationList';
 export const InAppNotificationPage: FC = () => {
   const { t } = useTranslation('commons');
 
-  const { data: showPageLimitationXL } = useShowPageLimitationXL();
+  const [showPageLimitationXL] = useShowPageLimitationXL();
 
   const limit = showPageLimitationXL != null ? showPageLimitationXL : 20;
 

apps/app/src/client/components/TrashPageList.tsx

@@ -7,7 +7,7 @@ import dynamic from 'next/dynamic';
 import { toastSuccess } from '~/client/util/toastr';
 import type { IPagingResult } from '~/interfaces/paging-result';
 import { useIsReadOnlyUser } from '~/states/context';
-import { useShowPageLimitationXL } from '~/stores-universal/context';
+import { useShowPageLimitationXL } from '~/states/server-configurations';
 import { useEmptyTrashModal } from '~/stores/modal';
 import { useSWRxPageInfoForList, useSWRxPageList } from '~/stores/page-listing';
 
@@ -26,7 +26,7 @@ const convertToIDataWithMeta = (page) => {
 const useEmptyTrashButton = () => {
 
   const { t } = useTranslation();
-  const { data: limit } = useShowPageLimitationXL();
+  const [limit] = useShowPageLimitationXL();
   const [isReadOnlyUser] = useIsReadOnlyUser();
   const { data: pagingResult, mutate: mutatePageLists } = useSWRxPageList('/trash', 1, limit);
   const { open: openEmptyTrashModal } = useEmptyTrashModal();
@@ -64,7 +64,7 @@ const useEmptyTrashButton = () => {
 };
 
 const DescendantsPageListForTrash = (): JSX.Element => {
-  const { data: limit } = useShowPageLimitationXL();
+  const [limit] = useShowPageLimitationXL();
 
   return (
     <DescendantsPageList

apps/app/src/pages/trash/index.page.tsx

@@ -1,8 +1,8 @@
 import type { ReactNode, JSX } from 'react';
+import React from 'react';
 
-import type { IUser } from '@growi/core';
+import { isPermalink, isUserPage, isUsersTopPage } from '@growi/core/dist/utils/page-path-utils';
 import type { GetServerSideProps, GetServerSidePropsContext } from 'next';
-import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
 import dynamic from 'next/dynamic';
 import Head from 'next/head';
 
@@ -10,59 +10,38 @@ import { PagePathNavTitle } from '~/components/Common/PagePathNavTitle';
 import { BasicLayout } from '~/components/Layout/BasicLayout';
 import { GroundGlassBar } from '~/components/Navbar/GroundGlassBar';
 import type { CrowiRequest } from '~/interfaces/crowi-request';
-import type { RendererConfig } from '~/interfaces/services/renderer';
-import type { ISidebarConfig } from '~/interfaces/sidebar-config';
-import { useHydratePageAtoms } from '~/states/hydrate/page';
-import { useHydrateSidebarAtoms } from '~/states/hydrate/sidebar';
-import {
-  useCurrentUser, useCurrentPathname, useGrowiCloudUri,
-  useIsSearchServiceConfigured, useIsSearchServiceReachable,
-  useIsSearchScopeChildrenAsDefault, useIsSearchPage, useShowPageLimitationXL,
-} from '~/stores-universal/context';
-
+import { useHydrateSidebarAtoms } from '~/states/ui/sidebar/hydrate';
 
 import type { NextPageWithLayout } from '../_app.page';
-import type { CommonProps } from '../common-props';
+import type { CommonEachProps, CommonInitialProps, UserUISettingsProps } from '../common-props';
 import {
-  getServerSideCommonProps, getNextI18NextConfig, generateCustomTitleForPage,
+  getServerSideCommonEachProps, getServerSideCommonInitialProps, getServerSideI18nProps, getServerSideUserUISettingsProps,
 } from '../common-props';
+import type { RendererConfigProps, SidebarConfigProps } from '../general-page';
+import { getServerSideSidebarConfigProps } from '../general-page';
+import { useCustomTitle } from '../utils/page-title-customization';
+import { mergeGetServerSidePropsResults } from '../utils/server-side-props';
+
+import type { ServerConfigurationProps } from './types';
+import { useHydrateServerConfigurationAtoms } from './use-hydrate-server-configurations';
 
 
 const TrashPageList = dynamic(() => import('~/client/components/TrashPageList').then(mod => mod.TrashPageList), { ssr: false });
 const EmptyTrashModal = dynamic(() => import('~/client/components/EmptyTrashModal'), { ssr: false });
 
+type Props = CommonInitialProps & CommonEachProps & ServerConfigurationProps & RendererConfigProps & UserUISettingsProps & SidebarConfigProps;
 
-type Props = CommonProps & {
-  currentUser: IUser,
-  isSearchServiceConfigured: boolean,
-  isSearchServiceReachable: boolean,
-  isSearchScopeChildrenAsDefault: boolean,
-  showPageLimitationXL: number,
-
-  rendererConfig: RendererConfig,
-
-  sidebarConfig: ISidebarConfig,
-};
-
-const TrashPage: NextPageWithLayout<CommonProps> = (props: Props) => {
-  useCurrentUser(props.currentUser ?? null);
+const TrashPage: NextPageWithLayout<Props> = (props: Props) => {
+  // // clear the cache for the current page
+  // //  in order to fix https://redmine.weseek.co.jp/issues/135811
+  // useHydratePageAtoms(undefined);
+  // useCurrentPathname('/trash');
 
-  // clear the cache for the current page
-  //  in order to fix https://redmine.weseek.co.jp/issues/135811
-  useHydratePageAtoms(undefined);
-  useCurrentPathname('/trash');
-
-  useGrowiCloudUri(props.growiCloudUri);
-
-  useIsSearchServiceConfigured(props.isSearchServiceConfigured);
-  useIsSearchServiceReachable(props.isSearchServiceReachable);
-  useIsSearchScopeChildrenAsDefault(props.isSearchScopeChildrenAsDefault);
-
-  useIsSearchPage(false);
-
-  useShowPageLimitationXL(props.showPageLimitationXL);
+  // Hydrate server-side data
+  useHydrateServerConfigurationAtoms(props.serverConfig);
+  useHydrateSidebarAtoms(props.sidebarConfig, props.userUISettings);
 
-  const title = generateCustomTitleForPage(props, '/trash');
+  const title = useCustomTitle('/trash');
 
   return (
     <>
@@ -104,55 +83,58 @@ TrashPage.getLayout = function getLayout(page) {
   );
 };
 
-function injectServerConfigurations(context: GetServerSidePropsContext, props: Props): void {
+
+const getServerSideConfigurationProps: GetServerSideProps<ServerConfigurationProps> = async(context: GetServerSidePropsContext) => {
   const req: CrowiRequest = context.req as CrowiRequest;
   const { crowi } = req;
   const {
-    searchService, configManager,
+    configManager, searchService,
   } = crowi;
 
-  props.isSearchServiceConfigured = searchService.isConfigured;
-  props.isSearchServiceReachable = searchService.isReachable;
-  props.isSearchScopeChildrenAsDefault = configManager.getConfig('customize:isSearchScopeChildrenAsDefault');
-  props.showPageLimitationXL = crowi.configManager.getConfig('customize:showPageLimitationXL');
-
-  props.sidebarConfig = {
-    isSidebarCollapsedMode: configManager.getConfig('customize:isSidebarCollapsedMode'),
-    isSidebarClosedAtDockMode: configManager.getConfig('customize:isSidebarClosedAtDockMode'),
+  return {
+    props: {
+      serverConfig: {
+        isSearchServiceConfigured: searchService.isConfigured,
+        isSearchServiceReachable: searchService.isReachable,
+        isSearchScopeChildrenAsDefault: configManager.getConfig('customize:isSearchScopeChildrenAsDefault'),
+        showPageLimitationXL: crowi.configManager.getConfig('customize:showPageLimitationXL'),
+      },
+    },
   };
-
-}
-
-/**
- * for Server Side Translations
- * @param context
- * @param props
- * @param namespacesRequired
- */
-async function injectNextI18NextConfigurations(context: GetServerSidePropsContext, props: Props, namespacesRequired?: string[] | undefined): Promise<void> {
-  const nextI18NextConfig = await getNextI18NextConfig(serverSideTranslations, context, namespacesRequired);
-  props._nextI18Next = nextI18NextConfig._nextI18Next;
-}
+};
 
 export const getServerSideProps: GetServerSideProps = async(context: GetServerSidePropsContext) => {
-  const req = context.req as CrowiRequest;
-  const { user } = req;
-  const result = await getServerSideCommonProps(context);
-
-  if (!('props' in result)) {
-    throw new Error('invalid getSSP result');
-  }
-  const props: Props = result.props as Props;
+  const req: CrowiRequest = context.req as CrowiRequest;
 
-  if (user != null) {
-    props.currentUser = user.toObject();
+  // redirect to the page the user was on before moving to the Login Page
+  if (req.headers.referer != null) {
+    const urlBeforeLogin = new URL(req.headers.referer);
+    if (isPermalink(urlBeforeLogin.pathname) || isUserPage(urlBeforeLogin.pathname) || isUsersTopPage(urlBeforeLogin.pathname)) {
+      req.session.redirectTo = urlBeforeLogin.href;
+    }
   }
-  injectServerConfigurations(context, props);
-  await injectNextI18NextConfigurations(context, props, ['translation']);
 
-  return {
-    props,
-  };
+  const [
+    commonInitialResult,
+    commonEachResult,
+    userUIResult,
+    sidebarConfigResult,
+    serverConfigResult,
+    i18nPropsResult,
+  ] = await Promise.all([
+    getServerSideCommonInitialProps(context),
+    getServerSideCommonEachProps(context),
+    getServerSideUserUISettingsProps(context),
+    getServerSideSidebarConfigProps(context),
+    getServerSideConfigurationProps(context),
+    getServerSideI18nProps(context, ['translation']),
+  ]);
+
+  return mergeGetServerSidePropsResults(commonInitialResult,
+    mergeGetServerSidePropsResults(commonEachResult,
+      mergeGetServerSidePropsResults(userUIResult,
+        mergeGetServerSidePropsResults(sidebarConfigResult,
+          mergeGetServerSidePropsResults(serverConfigResult, i18nPropsResult)))));
 };
 
 export default TrashPage;

apps/app/src/pages/trash/types.ts

@@ -3,5 +3,6 @@ export type ServerConfigurationProps = {
     isSearchServiceConfigured: boolean;
     isSearchServiceReachable: boolean;
     isSearchScopeChildrenAsDefault: boolean;
+    showPageLimitationXL: number,
   },
 }

apps/app/src/pages/trash/use-hydrate-server-configurations.ts

@@ -1,13 +1,11 @@
 import { useHydrateAtoms } from 'jotai/utils';
 
-import type { RendererConfig } from '~/interfaces/services/renderer';
 import {
   isSearchScopeChildrenAsDefaultAtom,
   isSearchServiceConfiguredAtom,
   isSearchServiceReachableAtom,
-  isContainerFluidAtom,
-  rendererConfigAtom,
-} from '~/states/server-configurations/server-configurations';
+  showPageLimitationXLAtom,
+} from '~/states/server-configurations';
 
 import type { ServerConfigurationProps } from './types';
 
@@ -17,14 +15,12 @@ import type { ServerConfigurationProps } from './types';
  */
 export const useHydrateServerConfigurationAtoms = (
     serverConfig: ServerConfigurationProps['serverConfig'] | undefined,
-    rendererConfigs: RendererConfig | undefined,
 ): void => {
   // Hydrate server configuration atoms with server-side data
-  useHydrateAtoms(serverConfig == null || rendererConfigs == null ? [] : [
+  useHydrateAtoms(serverConfig == null ? [] : [
     [isSearchServiceConfiguredAtom, serverConfig.isSearchServiceConfigured],
     [isSearchServiceReachableAtom, serverConfig.isSearchServiceReachable],
     [isSearchScopeChildrenAsDefaultAtom, serverConfig.isSearchScopeChildrenAsDefault],
-    [isContainerFluidAtom, serverConfig.isContainerFluid],
-    [rendererConfigAtom, rendererConfigs],
+    [showPageLimitationXLAtom, serverConfig.showPageLimitationXL],
   ]);
 };

apps/app/src/states/server-configurations/server-configurations.ts

@@ -85,6 +85,28 @@ export const useIsAllReplyShown = (): UseAtom<typeof isAllReplyShownAtom> => {
   return useAtom(isAllReplyShownAtom);
 };
 
+/**
+ * Atom for show page limitation L
+ */
+export const showPageLimitationLAtom = atom<number>(50);
+
+export const useShowPageLimitationL = (): UseAtom<
+  typeof showPageLimitationLAtom
+> => {
+  return useAtom(showPageLimitationLAtom);
+};
+
+/**
+ * Atom for show page limitation XL
+ */
+export const showPageLimitationXLAtom = atom<number>(20);
+
+export const useShowPageLimitationXL = (): UseAtom<
+  typeof showPageLimitationXLAtom
+> => {
+  return useAtom(showPageLimitationXLAtom);
+};
+
 /**
  * Atom for show page side authors
  */

apps/app/src/stores-universal/context.tsx

@@ -42,14 +42,6 @@ export const useIsBlinkedHeaderAtBoot = (initialData?: boolean): SWRResponse<boo
   return useContextSWR('isBlinkedAtBoot', initialData, { fallbackData: false });
 };
 
-export const useShowPageLimitationL = (initialData?: number): SWRResponse<number, Error> => {
-  return useContextSWR('showPageLimitationL', initialData);
-};
-
-export const useShowPageLimitationXL = (initialData?: number): SWRResponse<number, Error> => {
-  return useContextSWR('showPageLimitationXL', initialData);
-};
-
 export const useCustomizeTitle = (initialData?: string): SWRResponse<string, Error> => {
   return useContextSWR('CustomizeTitle', initialData);
 };