create utils

packages/app/src/components/Navbar/GlobalSearch.tsx

@@ -2,6 +2,7 @@ import React, { useState, useCallback, useRef } from 'react';
 
 import assert from 'assert';
 
+import { returnPagePathForURL } from '^/../core/src/utils/page-path-utils';
 import { useTranslation } from 'next-i18next';
 import { useRouter } from 'next/router';
 
@@ -46,11 +47,10 @@ export const GlobalSearch = (props: GlobalSearchProps): JSX.Element => {
     assert(data.length > 0);
 
     const page = data[0].data; // should be single page selected
-    const pagePath = page.path === '/' ? '/' : `/${page._id}`;
 
     // navigate to page
     if (page != null) {
-      router.push(pagePath);
+      router.push(returnPagePathForURL(page.path, page._id));
     }
   }, [router]);
 

packages/app/src/components/PageAlert/OldRevisionAlert.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 
+import { returnPagePathForURL } from '^/../core/src/utils/page-path-utils';
 import Link from 'next/link';
 import { useTranslation } from 'react-i18next';
 
@@ -16,12 +17,10 @@ export const OldRevisionAlert = (): JSX.Element => {
     return <></>;
   }
 
-  const pathPath = page.path === '/' ? '/' : `/${page._id}`;
-
   return (
     <div className="alert alert-warning">
       <strong>{ t('Warning') }: </strong> { t('page_page.notice.version') }
-      <Link href={pathPath}>
+      <Link href={returnPagePathForURL(page.path, page._id)}>
         <a><i className="icon-fw icon-arrow-right-circle"></i>{ t('Show latest') }</a>
       </Link>
     </div>

packages/app/src/components/PageHistory/Revision.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 
 import { IRevisionHasId } from '@growi/core';
 import { UserPicture } from '@growi/ui';
+import { returnPagePathForURL } from '^/../core/src/utils/page-path-utils';
 import { useTranslation } from 'next-i18next';
 import Link from 'next/link';
 
@@ -53,8 +54,6 @@ export const Revision = (props: RevisionProps): JSX.Element => {
 
     const pic = (typeof author === 'object') ? <UserPicture user={author} size="lg" /> : <></>;
 
-    const path = pagePath === '/' ? `/?revisionId=${revision._id}` : `/${pageId}?revisionId=${revision._id}`;
-
     return (
       <div className={`${styles['revision-history-main']} revision-history-main d-flex`}>
         <div className="picture-container">
@@ -68,7 +67,7 @@ export const Revision = (props: RevisionProps): JSX.Element => {
           <div className="mb-1">
             <UserDate dateTime={revision.createdAt} />
             <br className="d-xl-none d-block" />
-            <Link href={path} prefetch={false}>
+            <Link href={`${returnPagePathForURL(pagePath, pageId)}?revisionId=${revision._id}`} prefetch={false}>
               <a className="ml-xl-3" onClick={onClose}>
                 <i className="icon-login"></i> {t('Go to this version')}
               </a>

packages/core/src/utils/page-path-utils.ts

@@ -305,3 +305,10 @@ export const generateChildrenRegExp = (path: string): RegExp => {
   // ex. /parent/any_child OR /any_level1
   return new RegExp(`^${path}(\\/[^/]+)\\/?$`);
 };
+
+/**
+ * In the href, if the page path is '/', eliminate the pageId from the url path.
+ */
+export const returnPagePathForURL = (pagePath: string, pageId: string): string => {
+  return pagePath === '/' ? '/' : `/${pageId}`;
+};