Merge branch 'dev/7.1.x' into imprv/153035-add-github-alert-notation

.github/mergify.yml

@@ -23,6 +23,7 @@ pull_request_rules:
   - name: Automatic queue to merge
     conditions:
       - '#approved-reviews-by >= 1'
+      - '#changes-requested-reviews-by = 0'
       - '#review-requested = 0'
       - check-success = check-title
     actions:

.github/workflows/draft-release.yml

@@ -26,7 +26,7 @@ jobs:
       - uses: actions/checkout@v4
 
       - name: Retrieve information from package.json
-        uses: myrotvorets/info-from-package-json-action@1.2.0
+        uses: myrotvorets/info-from-package-json-action@2.0.1
         id: package-json
 
       - uses: release-drafter/release-drafter@v5

.github/workflows/release-rc-scheduled.yml

@@ -23,7 +23,7 @@ jobs:
     - uses: actions/checkout@v4
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
 
     - name: Docker meta for docker.io

.github/workflows/release-rc.yml

@@ -23,7 +23,7 @@ jobs:
     - uses: actions/checkout@v4
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
 
     - name: Docker meta for docker.io

.github/workflows/release-slackbot-proxy.yml

@@ -17,7 +17,7 @@ jobs:
         ref: ${{ github.event.pull_request.base.ref }}
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
       with:
         workingDir: apps/slackbot-proxy
@@ -41,7 +41,7 @@ jobs:
         credentials_json: '${{ secrets.GCP_SA_KEY_SLACKBOT_PROXY }}'
 
     - name: Setup gcloud
-      uses: google-github-actions/setup-gcloud@v1
+      uses: google-github-actions/setup-gcloud@v2
 
     - name: Configure docker for gcloud
       run: |
@@ -110,7 +110,7 @@ jobs:
         turbo run version --filter=@growi/slackbot-proxy -- --prerelease
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
       with:
         workingDir: apps/slackbot-proxy

.github/workflows/release.yml

@@ -41,7 +41,7 @@ jobs:
         sh ./apps/app/bin/github-actions/update-readme.sh
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
 
     - name: Update Changelog
@@ -58,13 +58,13 @@ jobs:
         RELEASED_VERSION: ${{ steps.package-json.outputs.packageVersion }}
 
     - name: Commit, Tag and Push
-      uses: stefanzweifel/git-auto-commit-action@v4
+      uses: stefanzweifel/git-auto-commit-action@v5
       with:
         branch: ${{ github.event.pull_request.base.ref }}
         commit_message: Release v${{ steps.package-json.outputs.packageVersion }}
         tagging_message: v${{ steps.package-json.outputs.packageVersion }}
 
-    - uses: softprops/action-gh-release@v1
+    - uses: softprops/action-gh-release@v2
       with:
         body: ${{ github.event.pull_request.body }}
         tag_name: v${{ steps.package-json.outputs.packageVersion }}
@@ -87,7 +87,7 @@ jobs:
     - uses: actions/checkout@v4
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
 
     - name: Docker meta for docker.io
@@ -181,7 +181,7 @@ jobs:
         yarn upgrade --scope=@growi
 
     - name: Retrieve information from package.json
-      uses: myrotvorets/info-from-package-json-action@1.2.0
+      uses: myrotvorets/info-from-package-json-action@2.0.1
       id: package-json
 
     - name: Commit

apps/app/docker/README.md

@@ -4,7 +4,7 @@ GROWI Official docker image
 
 [![Actions Status](https://github.com/weseek/growi/workflows/Release/badge.svg)](https://github.com/weseek/growi/actions) [![docker-pulls](https://img.shields.io/docker/pulls/weseek/growi.svg)](https://hub.docker.com/r/weseek/growi/) [![](https://images.microbadger.com/badges/image/weseek/growi.svg)](https://microbadger.com/images/weseek/growi)
 
-![GROWI-x-docker](https://user-images.githubusercontent.com/1638767/38307565-105956e2-384f-11e8-8534-b1128522d68d.png)
+![GROWI-x-docker](https://github.com/user-attachments/assets/1a82236d-5a85-4a2e-842a-971b4c1625e6)
 
 
 Supported tags and respective Dockerfile links

apps/app/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.

apps/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@growi/app",
-  "version": "7.0.20-RC.0",
+  "version": "7.1.0-RC.0",
   "license": "MIT",
   "private": "true",
   "scripts": {
@@ -35,12 +35,9 @@
     "prelint:swagger2openapi": "yarn openapi:v3",
     "test": "run-p test:*",
     "test:jest": "cross-env NODE_ENV=test TS_NODE_PROJECT=test/integration/tsconfig.json jest",
-    "test:vitest": "run-p vitest:run vitest:run:integ vitest:run:components",
+    "test:vitest": "vitest run --coverage",
     "jest:run": "cross-env NODE_ENV=test TS_NODE_PROJECT=test/integration/tsconfig.json jest --passWithNoTests -- ",
     "reg:run": "reg-suit run",
-    "vitest:run": "vitest run config src --coverage",
-    "vitest:run:integ": "vitest run -c vitest.config.integ.ts src --coverage",
-    "vitest:run:components": "vitest run -c vitest.config.components.ts src --coverage",
     "previtest:run:integ": "vitest run -c test-with-vite/download-mongo-binary/vitest.config.ts test-with-vite/download-mongo-binary",
     "//// misc": "",
     "console": "yarn repl",
@@ -49,7 +46,7 @@
     "openapi:v3": "yarn cross-env API_VERSION=3 yarn swagger-jsdoc -- \"src/server/routes/apiv3/**/*.js\" \"src/server/models/**/*.js\"",
     "openapi:v1": "yarn cross-env API_VERSION=1 yarn swagger-jsdoc -- \"src/server/*/*.js\" \"src/server/models/**/*.js\"",
     "ts-node": "node -r ts-node/register/transpile-only -r tsconfig-paths/register -r dotenv-flow/config",
-    "version": "yarn version --no-git-tag-version --preid=RC"
+    "version": "yarn version --no-git-tag-version --non-interactive --preid=RC"
   },
   "// comments for dependencies": {
     "@aws-skd/*": "fix version above 3.186.0 that is required by mongodb@4.16.0",
@@ -143,7 +140,7 @@
     "multer": "~1.4.0",
     "multer-autoreap": "^1.0.3",
     "mustache": "^4.2.0",
-    "next": "^14.1.3",
+    "next": "^14.2.13",
     "next-dynamic-loading-props": "^0.1.1",
     "next-i18next": "^15.2.0",
     "next-superjson": "^0.0.4",
@@ -231,13 +228,16 @@
     "@popperjs/core": "^2.11.8",
     "@swc-node/jest": "^1.8.1",
     "@swc/jest": "^0.2.36",
-    "@testing-library/react": "^14.1.2",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.5.0",
+    "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
     "@types/express": "^4.17.21",
     "@types/jest": "^29.5.2",
     "@types/react-input-autosize": "^2.2.4",
     "@types/react-scroll": "^1.8.4",
     "@types/react-stickynode": "^4.0.3",
+    "@types/testing-library__dom": "^7.5.0",
     "@types/throttle-debounce": "^5.0.1",
     "@types/unzip-stream": "^0.3.4",
     "@types/url-join": "^4.0.2",
@@ -251,7 +251,7 @@
     "eslint-plugin-regex": "^1.8.0",
     "fslightbox-react": "^1.7.6",
     "handsontable": "=6.2.2",
-    "happy-dom": "^13.2.0",
+    "happy-dom": "^15.7.4",
     "i18next-chained-backend": "^4.6.2",
     "i18next-hmr": "^3.0.4",
     "i18next-http-backend": "^2.5.0",

apps/app/public/static/locales/en_US/admin.json

@@ -15,6 +15,7 @@
     "scope_of_page_disclosure": "Scope of page disclosure",
     "set_point": "Set point",
     "Guest Users Access": "Guest users access",
+    "readonly_users_access": "ROM users' access",
     "always_hidden": "Always hidden",
     "always_displayed": "Always displayed",
     "displayed_or_hidden": "Hidden / Displayed",
@@ -37,6 +38,7 @@
     "page_delete_rights": "Delete rights",
     "page_delete": "Page Delete",
     "page_delete_completely": "Page Delete Completely",
+    "comment_manage_rights": "Comment management rights",
     "other_options": "Other options",
     "deletion_explanation": "Restricts users who can trash the selected single page.",
     "complete_deletion_explanation": "Restricts users who can completely delete  selected single page.",
@@ -85,6 +87,10 @@
       "deny": "Deny (Registered users only)",
       "readonly": "Accept (Guests can read only)"
     },
+    "rom_users_comment": {
+      "deny": "Deny (Prohibit ROM users from comment management)",
+      "accept": "Allow (ROM users can manage comments)"
+    },
     "registration_mode": {
       "open": "Open (Anyone can register)",
       "restricted": "Restricted (Requires approval by administrators)",

apps/app/public/static/locales/en_US/commons.json

@@ -157,6 +157,6 @@
     "publish_transfer_key": "Publish transfer key",
     "transfer_key_limit": "Transfer keys are valid for 1 hour after issuance.",
     "once_transfer_key_used": "Once the transfer key is used for transfer, it cannot be used for any other transfer.",
-    "transfer_to_growi_cloud": "If you wish to transfer to GROWI.cloud, please click here."
+    "transfer_to_growi_cloud": "For more details, please click <a href='{{documentationUrl}}/ja/admin-guide/management-cookbook/g2g-transfer.html'>here.</a>"
   }
 }

apps/app/public/static/locales/en_US/translation.json

@@ -349,7 +349,8 @@
     "display_the_page_when_posting_this_comment": "Display the page when posting this comment",
     "no_user_found": "No user found",
     "reply": "Reply",
-    "delete_comment": "Delete comment?"
+    "delete_comment": "Delete comment?",
+    "comment_management_is_not_allowed": "Comment management is not allowed."
   },
   "page_api_error": {
     "notfound_or_forbidden": "Original page is not found or forbidden.",

apps/app/public/static/locales/fr_FR/admin.json

@@ -15,6 +15,7 @@
     "scope_of_page_disclosure": "Confidentialité de la page",
     "set_point": "Valeur",
     "Guest Users Access": "Accès invité",
+    "readonly_users_access": "Accès des utilisateurs ROM",
     "always_hidden": "Toujours caché",
     "always_displayed": "Toujours affiché",
     "displayed_or_hidden": "Caché / Affiché",
@@ -37,6 +38,7 @@
     "page_delete_rights": "Droits de suppression",
     "page_delete": "Suppression de page",
     "page_delete_completely": "Suppression complète de page",
+    "comment_manage_rights": "Droits de gestion des commentaires",
     "other_options": "Paramètres supplémentaires",
     "deletion_explanation": "Restreindre les utilisateurs pouvant supprimer une page.",
     "complete_deletion_explanation": "Restreindre les utilisateurs pouvant supprimer complètement une page.",
@@ -85,6 +87,10 @@
       "deny": "Refuser (Utilisateurs inscrits seulement)",
       "readonly": "Autoriser (Lecture seule)"
     },
+    "rom_users_comment": {
+      "deny": "Refuser (Interdire la gestion des commentaires aux utilisateurs ROM)",
+      "accept": "Autoriser (Les utilisateurs ROM peuvent gérer les commentaires)"
+    },
     "registration_mode": {
       "open": "Ouvert (Tout le monde peut s'inscrire)",
       "restricted": "Restreint (Requiert l'approbation d'administrateurs)",

apps/app/public/static/locales/fr_FR/commons.json

@@ -157,6 +157,6 @@
     "publish_transfer_key": "Publier la clé de transfert",
     "transfer_key_limit": "Les clés de transfert sont valides durant une heure.",
     "once_transfer_key_used": "Les clés de transfert sont à usage unique.",
-    "transfer_to_growi_cloud": "Si vous souhaitez transférer depuis GROWI.cloud, cliquez ici."
+    "transfer_to_growi_cloud": "Pour plus de détails, veuillez cliquer <a href='{{documentationUrl}}/ja/admin-guide/management-cookbook/g2g-transfer.html'>ici.</a>"
   }
 }

apps/app/public/static/locales/fr_FR/translation.json

@@ -349,7 +349,8 @@
     "display_the_page_when_posting_this_comment": "Afficher la page en postant le commentaire",
     "no_user_found": "Aucun utilisateur trouvé",
     "reply": "Répondre",
-    "delete_comment": "Supprimer?"
+    "delete_comment": "Supprimer?",
+    "comment_management_is_not_allowed": "La gestion des commentaires n'est pas autorisée."
   },
   "page_api_error": {
     "notfound_or_forbidden": "Page originale introuvable ou accès restreint.",

apps/app/public/static/locales/ja_JP/admin.json

@@ -24,6 +24,7 @@
     "scope_of_page_disclosure": "ページの公開範囲",
     "set_point": "設定値",
     "Guest Users Access":"ゲストユーザーのアクセス",
+    "readonly_users_access": "ROMユーザーのアクセス",
     "always_hidden": "非表示 (固定)",
     "always_displayed": "表示 (固定)",
     "displayed_or_hidden": "非表示 / 表示",
@@ -46,6 +47,7 @@
     "page_delete_rights": "ページの削除権限",
     "page_delete": "ゴミ箱に入れる",
     "page_delete_completely": "完全に削除する",
+    "comment_manage_rights": "コメントの操作権限",
     "other_options": "その他のオプション",
     "deletion_explanation": "ページをゴミ箱に入れることができるユーザーを制限します。",
     "complete_deletion_explanation": "ページを完全削除することができるユーザーを制限します。",
@@ -94,6 +96,10 @@
       "deny": "拒否 (アカウントを持つユーザーのみ利用可能)",
       "readonly": "許可 (ゲストユーザーも閲覧のみ可能)"
     },
+    "rom_users_comment": {
+      "deny": "拒否 (ROMユーザーのコメント操作を禁止)",
+      "accept": "許可 (ROMユーザーもコメント操作可能)"
+    },
     "registration_mode": {
       "open": "公開 (だれでも登録可能)",
       "restricted": "制限 (登録完了には管理者の承認が必要)",

apps/app/public/static/locales/ja_JP/commons.json

@@ -159,6 +159,6 @@
     "publish_transfer_key": "移行キーを発行する",
     "transfer_key_limit": "※ 移行キーの有効期限は発行から1時間となります。",
     "once_transfer_key_used": "※ 移行キーは一度移行に利用するとそれ以降はご利用いただけなくなります。",
-    "transfer_to_growi_cloud": "※ GROWI.cloud への移行を実施する場合はこちらをご確認ください。"
+    "transfer_to_growi_cloud": "※ 詳しくは <a href='{{documentationUrl}}/ja/admin-guide/management-cookbook/g2g-transfer.html'> GROWI お引越し機能</a>をご確認ください。"
   }
 }

apps/app/public/static/locales/ja_JP/translation.json

@@ -382,7 +382,8 @@
     "display_the_page_when_posting_this_comment": "投稿時のページを表示する",
     "no_user_found": "ユーザー名が見つかりません",
     "reply": "返信",
-    "delete_comment": "コメントを削除しますか？"
+    "delete_comment": "コメントを削除しますか？",
+    "comment_management_is_not_allowed": "コメントの操作が許可されていません。"
   },
   "page_api_error": {
     "notfound_or_forbidden": "元のページが見つからないか、アクセス権がありません。",

apps/app/public/static/locales/zh_CN/admin.json

@@ -27,6 +27,7 @@
     "always_hidden": "总是隐藏",
     "displayed_or_hidden": "隐藏 / 显示",
     "Guest Users Access": "来宾用户访问",
+    "readonly_users_access": "ROM用户的访问",
 		"Fixed by env var": "这是由env var<code>%s=%s</code>修复的。",
 		"register_limitation": "注册限制",
 		"register_limitation_desc": "限制新用户注册",
@@ -46,6 +47,7 @@
     "page_delete_rights": "删除权限",
     "page_delete": "删除",
     "page_delete_completely": "彻底删除",
+    "comment_manage_rights": "评论管理权限",
     "other_options": "其他选项",
     "deletion_explanation": "限制用户对选定的单一页面进行垃圾处理。",
     "complete_deletion_explanation": "限制可以完全删除所选单页的用户。",
@@ -94,6 +96,10 @@
 			"deny": "拒绝（仅限注册用户）",
 			"readonly": "接受（来宾可以只读）"
 		},
+    "rom_users_comment": {
+      "deny": "拒绝 (禁止ROM用户操作评论)",
+      "accept": "允许 (ROM用户可以管理评论)"
+    },
 		"registration_mode": {
 			"open": "打开（任何人都可以注册）",
 			"restricted": "受限（需要管理员批准）",

apps/app/public/static/locales/zh_CN/commons.json

@@ -160,6 +160,6 @@
     "publish_transfer_key": "发布迁移密钥",
     "transfer_key_limit": "迁移密钥在签发后一小时内有效。",
     "once_transfer_key_used": "一旦迁移密钥被用于迁移，它将不再可用于进一步的迁移。",
-    "transfer_to_growi_cloud": "如果您希望迁移到GROWI.cloud，请点击这里。"
+    "transfer_to_growi_cloud": "有关更多详情，请点击<a href='https://{{documentationUrl}}/ja/admin-guide/management-cookbook/g2g-transfer.html'>此处</a>。"
   }
 }

apps/app/public/static/locales/zh_CN/translation.json

@@ -339,7 +339,8 @@
     "display_the_page_when_posting_this_comment": "Display the page when posting this comment",
     "no_user_found": "未找到用户名",
     "reply": "Reply",
-    "delete_comment": "Delete comment?"
+    "delete_comment": "Delete comment?",
+    "comment_management_is_not_allowed": "不允许操作评论。"
   },
   "page_api_error": {
     "notfound_or_forbidden": "未找到或禁止原始页。",

apps/app/src/client/components/Admin/G2GDataTransfer.tsx

@@ -8,6 +8,7 @@ import { useGenerateTransferKey } from '~/client/services/g2g-transfer';
 import { apiv3Get, apiv3Post } from '~/client/util/apiv3-client';
 import { toastError, toastSuccess } from '~/client/util/toastr';
 import { G2G_PROGRESS_STATUS, type G2GProgress } from '~/interfaces/g2g-transfer';
+import { useGrowiDocumentationUrl } from '~/stores-universal/context';
 import { useAdminSocket } from '~/stores/socket-io';
 
 import CustomCopyToClipBoard from '../Common/CustomCopyToClipBoard';
@@ -123,6 +124,8 @@ const G2GDataTransfer = (): JSX.Element => {
     }
   }, [setTransferring, startTransferKey, selectedCollections, optionsMap]);
 
+  const { data: documentationUrl } = useGrowiDocumentationUrl();
+
   // File upload
   // const onChangeFileUploadTypeHandler = useCallback((e: ChangeEvent, type: string) => {
   //   setFileUploadType(type);
@@ -275,7 +278,13 @@ const G2GDataTransfer = (): JSX.Element => {
       <div className="alert alert-warning mt-4">
         <p className="mb-1">{t('commons:g2g_data_transfer.transfer_key_limit')}</p>
         <p className="mb-1">{t('commons:g2g_data_transfer.once_transfer_key_used')}</p>
-        <p className="mb-0">{t('commons:g2g_data_transfer.transfer_to_growi_cloud')}</p>
+        <p
+          className="mb-0"
+          // eslint-disable-next-line react/no-danger
+          dangerouslySetInnerHTML={{
+            __html: t('commons:g2g_data_transfer.transfer_to_growi_cloud', { documentationUrl }),
+          }}
+        />
       </div>
     </div>
   );

apps/app/src/client/components/Admin/Notification/NotificationSetting.jsx

@@ -14,7 +14,7 @@ import { toastError } from '~/client/util/toastr';
 import { toArrayIfNot } from '~/utils/array-utils';
 import loggerFactory from '~/utils/logger';
 
-import { CustomNavTab } from '../../CustomNavigation/CustomNav';
+import CustomNav from '../../CustomNavigation/CustomNav';
 import { withUnstatedContainers } from '../../UnstatedUtils';
 
 
@@ -155,7 +155,13 @@ function NotificationSetting(props) {
 
       <h2 className="admin-setting-header mt-5">{t('notification_settings.notification_settings')}</h2>
 
-      <CustomNavTab activeTab={activeTab} navTabMapping={navTabMapping} onNavSelected={switchActiveTab} hideBorderBottom />
+      <CustomNav
+        activeTab={activeTab}
+        navTabMapping={navTabMapping}
+        onNavSelected={switchActiveTab}
+        hideBorderBottom
+        breakpointToSwitchDropdownDown="md"
+      />
 
       <TabContent activeTab={activeTab} className="p-5">
         <TabPane tabId="user_trigger_notification">

apps/app/src/client/components/Admin/Security/SecuritySetting.jsx

@@ -333,7 +333,7 @@ class SecuritySetting extends React.Component {
     const { t, adminGeneralSecurityContainer } = this.props;
     const {
       currentRestrictGuestMode, currentPageDeletionAuthority, currentPageCompleteDeletionAuthority,
-      currentPageRecursiveDeletionAuthority, currentPageRecursiveCompleteDeletionAuthority,
+      currentPageRecursiveDeletionAuthority, currentPageRecursiveCompleteDeletionAuthority, isRomUserAllowedToComment,
     } = adminGeneralSecurityContainer.state;
 
     const isButtonDisabledForDeletion = !validateDeleteConfigs(
@@ -509,6 +509,39 @@ class SecuritySetting extends React.Component {
           </div>
         </div>
 
+        <h4 className="mb-3">{t('security_settings.comment_manage_rights')}</h4>
+        <div className="row mb-4">
+          <div className="col-md-4 text-md-end py-2">
+            <strong>{t('security_settings.readonly_users_access')}</strong>
+          </div>
+          <div className="col-md-8">
+            <div className="dropdown">
+              <button
+                className={`btn btn-outline-secondary dropdown-toggle text-end col-12
+                            col-md-auto ${adminGeneralSecurityContainer.isWikiModeForced && 'disabled'}`}
+                type="button"
+                id="dropdownMenuButton"
+                data-bs-toggle="dropdown"
+                aria-haspopup="true"
+                aria-expanded="true"
+              >
+                <span className="float-start">
+                  {isRomUserAllowedToComment === true && t('security_settings.rom_users_comment.accept')}
+                  {isRomUserAllowedToComment === false && t('security_settings.rom_users_comment.deny')}
+                </span>
+              </button>
+              <div className="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                <button className="dropdown-item" type="button" onClick={() => { adminGeneralSecurityContainer.switchIsRomUserAllowedToComment(false) }}>
+                  {t('security_settings.rom_users_comment.deny')}
+                </button>
+                <button className="dropdown-item" type="button" onClick={() => { adminGeneralSecurityContainer.switchIsRomUserAllowedToComment(true) }}>
+                  {t('security_settings.rom_users_comment.accept')}
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
         <h4>{t('security_settings.session')}</h4>
         <div className="row">
           <label className="text-start text-md-end col-md-3 col-form-label">{t('security_settings.max_age')}</label>

apps/app/src/client/components/Common/Dropdown/PageItemControl.spec.tsx

@@ -1,7 +1,8 @@
 import { type IPageInfoForOperation } from '@growi/core/dist/interfaces';
 import {
-  fireEvent, render, screen, within,
-} from '@testing-library/react';
+  fireEvent, screen, within,
+} from '@testing-library/dom';
+import { render } from '@testing-library/react';
 import { mock } from 'vitest-mock-extended';
 
 import { PageItemControl } from './PageItemControl';

apps/app/src/client/components/CustomNavigation/CustomNav.module.scss

@@ -14,5 +14,4 @@
     border-bottom: 3px solid;
     transition: 0.3s ease-in-out;
   }
-
 }

apps/app/src/client/components/CustomNavigation/CustomNav.tsx

@@ -42,26 +42,42 @@ export const CustomNavDropdown = (props: CustomNavDropdownProps): JSX.Element =>
 
   const { Icon, i18n } = navTabMapping[activeTab];
 
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+
+  const dropdownButtonRef = useRef<HTMLButtonElement>(null);
+
+  const toggleDropdown = () => {
+    setIsDropdownOpen(prev => !prev);
+  };
+
   const menuItemClickHandler = useCallback((key) => {
     if (onNavSelected != null) {
       onNavSelected(key);
     }
+    // Manually close the dropdown
+    setIsDropdownOpen(false);
+    if (dropdownButtonRef.current) {
+      dropdownButtonRef.current.classList.remove('show');
+    }
   }, [onNavSelected]);
 
   return (
     <div className="btn-group">
       <button
+        ref={dropdownButtonRef}
         className="btn btn-outline-primary btn-lg dropdown-toggle text-end"
         type="button"
         data-bs-toggle="dropdown"
         aria-haspopup="true"
-        aria-expanded="false"
+        aria-expanded={isDropdownOpen}
+        onClick={toggleDropdown}
+        data-testid="custom-nav-dropdown"
       >
         <span className="float-start">
           { Icon != null && <Icon /> } {i18n}
         </span>
       </button>
-      <div className="dropdown-menu dropdown-menu-right">
+      <div className={`dropdown-menu dropdown-menu-right w-100 ${isDropdownOpen ? 'show' : ''} ${styles['dropdown-menu']}`}>
         {Object.entries(navTabMapping).map(([key, value]) => {
 
           const isActive = activeTab === key;
@@ -167,7 +183,7 @@ export const CustomNavTab = (props: CustomNavTabProps): JSX.Element => {
   }
 
   return (
-    <div className={`grw-custom-nav-tab ${styles['grw-custom-nav-tab']}`}>
+    <div data-testid="custom-nav-tab" className={`grw-custom-nav-tab ${styles['grw-custom-nav-tab']}`}>
       <div ref={navContainerRef} className="d-flex justify-content-between">
         <Nav className="nav-title">
           {Object.entries(navTabMapping).map(([key, value]) => {

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

@@ -3,12 +3,14 @@ import React from 'react';
 import { useTranslation } from 'next-i18next';
 
 import { useGenerateTransferKey } from '~/client/services/g2g-transfer';
+import { useGrowiDocumentationUrl } from '~/stores-universal/context';
 
 import CustomCopyToClipBoard from './Common/CustomCopyToClipBoard';
 
 const DataTransferForm = (): JSX.Element => {
   const { t } = useTranslation('commons');
   const { transferKey, generateTransferKey } = useGenerateTransferKey();
+  const { data: documentationUrl } = useGrowiDocumentationUrl();
 
   return (
     <div data-testid="installerForm" className="py-3 px-4">
@@ -33,7 +35,13 @@ const DataTransferForm = (): JSX.Element => {
       <div className="alert alert-warning mt-4">
         <p className="mb-1">{t('g2g_data_transfer.transfer_key_limit')}</p>
         <p className="mb-1">{t('g2g_data_transfer.once_transfer_key_used')}</p>
-        <p className="mb-0">{t('g2g_data_transfer.transfer_to_growi_cloud')}</p>
+        <p
+          className="mb-0"
+          // eslint-disable-next-line react/no-danger
+          dangerouslySetInnerHTML={{
+            __html: t('g2g_data_transfer.transfer_to_growi_cloud', { documentationUrl }),
+          }}
+        />
       </div>
     </div>
   );

apps/app/src/client/components/DescendantsPageListModal.module.scss

@@ -9,6 +9,10 @@
     padding: 25px 30px;
   }
 
+  .grw-tab-content-style-md-down {
+    padding-top: 25px;
+  }
+
   .grw-modal-body-style {
     max-height: calc(100vh - 100px);
   }

apps/app/src/client/components/DescendantsPageListModal.spec.tsx

@@ -0,0 +1,70 @@
+import { render, screen, fireEvent } from '@testing-library/react';
+
+import { DescendantsPageListModal } from './DescendantsPageListModal';
+
+const mockClose = vi.hoisted(() => vi.fn());
+const useIsDeviceLargerThanLg = vi.hoisted(() => vi.fn().mockReturnValue({ data: true }));
+
+vi.mock('next/router', () => ({
+  useRouter: () => ({
+    events: {
+      on: vi.fn(),
+      off: vi.fn(),
+    },
+  }),
+}));
+
+vi.mock('~/stores/modal', () => ({
+  useDescendantsPageListModal: vi.fn().mockReturnValue({
+    data: { isOpened: true },
+    close: mockClose,
+  }),
+}));
+
+vi.mock('~/stores/ui', () => ({
+  useIsDeviceLargerThanLg,
+}));
+
+describe('DescendantsPageListModal.tsx', () => {
+
+  it('should render the modal when isOpened is true', () => {
+    render(<DescendantsPageListModal />);
+    expect(screen.getByTestId('descendants-page-list-modal')).not.toBeNull();
+  });
+
+  it('should call close function when close button is clicked', () => {
+    render(<DescendantsPageListModal />);
+    const closeButton = screen.getByLabelText('Close');
+    fireEvent.click(closeButton);
+    expect(mockClose).toHaveBeenCalled();
+  });
+
+  describe('when device is larger than lg', () => {
+
+    it('should render CustomNavTab', () => {
+      render(<DescendantsPageListModal />);
+      expect(screen.getByTestId('custom-nav-tab')).not.toBeNull();
+    });
+
+    it('should not render CustomNavDropdown', () => {
+      render(<DescendantsPageListModal />);
+      expect(screen.queryByTestId('custom-nav-dropdown')).toBeNull();
+    });
+  });
+
+  describe('when device is smaller than lg', () => {
+    beforeEach(() => {
+      useIsDeviceLargerThanLg.mockReturnValue({ data: false });
+    });
+
+    it('should render CustomNavDropdown on devices smaller than lg', () => {
+      render(<DescendantsPageListModal />);
+      expect(screen.getByTestId('custom-nav-dropdown')).not.toBeNull();
+    });
+
+    it('should not render CustomNavTab', () => {
+      render(<DescendantsPageListModal />);
+      expect(screen.queryByTestId('custom-nav-tab')).toBeNull();
+    });
+  });
+});

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

@@ -10,8 +10,9 @@ import {
 
 import { useIsSharedUser } from '~/stores-universal/context';
 import { useDescendantsPageListModal } from '~/stores/modal';
+import { useIsDeviceLargerThanLg } from '~/stores/ui';
 
-import { CustomNavTab } from './CustomNavigation/CustomNav';
+import { CustomNavDropdown, CustomNavTab } from './CustomNavigation/CustomNav';
 import CustomTabContent from './CustomNavigation/CustomTabContent';
 import type { DescendantsPageListProps } from './DescendantsPageList';
 import ExpandOrContractButton from './ExpandOrContractButton';
@@ -34,6 +35,8 @@ export const DescendantsPageListModal = (): JSX.Element => {
 
   const { events } = useRouter();
 
+  const { data: isDeviceLargerThanLg } = useIsDeviceLargerThanLg();
+
   useEffect(() => {
     events.on('routeChangeStart', close);
     return () => {
@@ -93,17 +96,30 @@ export const DescendantsPageListModal = (): JSX.Element => {
       data-testid="descendants-page-list-modal"
       className={`grw-descendants-page-list-modal ${styles['grw-descendants-page-list-modal']} ${isWindowExpanded ? 'grw-modal-expanded' : ''} `}
     >
-      <ModalHeader className="p-0" toggle={close} close={buttons}>
-        <CustomNavTab
+      <ModalHeader className={isDeviceLargerThanLg ? 'p-0' : ''} toggle={close} close={buttons}>
+        {isDeviceLargerThanLg && (
+          <CustomNavTab
+            activeTab={activeTab}
+            navTabMapping={navTabMapping}
+            breakpointToHideInactiveTabsDown="md"
+            onNavSelected={v => setActiveTab(v)}
+            hideBorderBottom
+          />
+        )}
+      </ModalHeader>
+      <ModalBody>
+        {!isDeviceLargerThanLg && (
+          <CustomNavDropdown
+            activeTab={activeTab}
+            navTabMapping={navTabMapping}
+            onNavSelected={v => setActiveTab(v)}
+          />
+        )}
+        <CustomTabContent
           activeTab={activeTab}
           navTabMapping={navTabMapping}
-          breakpointToHideInactiveTabsDown="md"
-          onNavSelected={v => setActiveTab(v)}
-          hideBorderBottom
+          additionalClassNames={!isDeviceLargerThanLg ? ['grw-tab-content-style-md-down'] : undefined}
         />
-      </ModalHeader>
-      <ModalBody>
-        <CustomTabContent activeTab={activeTab} navTabMapping={navTabMapping} />
       </ModalBody>
     </Modal>
   );

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

@@ -6,19 +6,11 @@ import {
   Dropdown, DropdownToggle, DropdownMenu, DropdownItem,
 } from 'reactstrap';
 
-
-import { apiv3Post } from '~/client/util/apiv3-client';
-import { toastError } from '~/client/util/toastr';
 import { useSWRxInAppNotifications, useSWRxInAppNotificationStatus } from '~/stores/in-app-notification';
 import { useDefaultSocket } from '~/stores/socket-io';
-import loggerFactory from '~/utils/logger';
 
 import InAppNotificationList from './InAppNotificationList';
 
-
-const logger = loggerFactory('growi:InAppNotificationDropdown');
-
-
 export const InAppNotificationDropdown = (): JSX.Element => {
   const { t } = useTranslation('commons');
 
@@ -36,16 +28,6 @@ export const InAppNotificationDropdown = (): JSX.Element => {
   const buttonRef = useRef(null);
   useRipple(buttonRef, { rippleColor: 'rgba(255, 255, 255, 0.3)' });
 
-  const updateNotificationStatus = async() => {
-    try {
-      await apiv3Post('/in-app-notification/read');
-    }
-    catch (err) {
-      toastError(err);
-      logger.error(err);
-    }
-  };
-
   useEffect(() => {
     if (socket != null) {
       socket.on('notificationUpdated', () => {
@@ -62,7 +44,6 @@ export const InAppNotificationDropdown = (): JSX.Element => {
 
   const toggleDropdownHandler = async() => {
     if (!isOpen && inAppNotificationUnreadStatusCount != null && inAppNotificationUnreadStatusCount > 0) {
-      await updateNotificationStatus();
       mutateInAppNotificationUnreadStatusCount();
     }
 

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

@@ -1,10 +1,13 @@
-import React, { FC } from 'react';
+import type { FC } from 'react';
+import React from 'react';
 
 import type { HasObjectId } from '@growi/core';
 import { UserPicture } from '@growi/ui/dist/components';
 
 import { apiv3Post } from '~/client/util/apiv3-client';
-import { IInAppNotification, InAppNotificationStatuses } from '~/interfaces/in-app-notification';
+import type { IInAppNotification } from '~/interfaces/in-app-notification';
+import { InAppNotificationStatuses } from '~/interfaces/in-app-notification';
+import { useSWRxInAppNotificationStatus } from '~/stores/in-app-notification';
 
 import { useModelNotification } from './PageNotification';
 
@@ -21,6 +24,7 @@ const InAppNotificationElm: FC<Props> = (props: Props) => {
 
   const Notification = modelNotificationUtils?.Notification;
   const publishOpen = modelNotificationUtils?.publishOpen;
+  const { mutate: mutateNotificationCount } = useSWRxInAppNotificationStatus();
 
   if (Notification == null || publishOpen == null) {
     return <></>;
@@ -31,6 +35,7 @@ const InAppNotificationElm: FC<Props> = (props: Props) => {
       // set notification status "OPEND"
       await apiv3Post('/in-app-notification/open', { id: notification._id });
       onUnopenedNotificationOpend?.();
+      mutateNotificationCount();
     }
 
     publishOpen();

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

@@ -1,46 +1,26 @@
 import type { FC } from 'react';
-import React, { useState, useEffect, useCallback } from 'react';
+import React, { useState } from 'react';
 
 import { LoadingSpinner } from '@growi/ui/dist/components';
 import { useTranslation } from 'next-i18next';
 
-import { apiv3Put, apiv3Post } from '~/client/util/apiv3-client';
+import { apiv3Put } from '~/client/util/apiv3-client';
 import { InAppNotificationStatuses } from '~/interfaces/in-app-notification';
 import { useShowPageLimitationXL } from '~/stores-universal/context';
 import { useSWRxInAppNotifications, useSWRxInAppNotificationStatus } from '~/stores/in-app-notification';
-import loggerFactory from '~/utils/logger';
 
 import CustomNavAndContents from '../CustomNavigation/CustomNavAndContents';
 import PaginationWrapper from '../PaginationWrapper';
 
 import InAppNotificationList from './InAppNotificationList';
 
-
-const logger = loggerFactory('growi:InAppNotificationPage');
-
-
 export const InAppNotificationPage: FC = () => {
   const { t } = useTranslation('commons');
-  const { mutate } = useSWRxInAppNotificationStatus();
 
   const { data: showPageLimitationXL } = useShowPageLimitationXL();
 
   const limit = showPageLimitationXL != null ? showPageLimitationXL : 20;
 
-  const updateNotificationStatus = useCallback(async() => {
-    try {
-      await apiv3Post('/in-app-notification/read');
-      mutate();
-    }
-    catch (err) {
-      logger.error(err);
-    }
-  }, [mutate]);
-
-  useEffect(() => {
-    updateNotificationStatus();
-  }, [updateNotificationStatus]);
-
   const InAppNotificationCategoryByStatus = (status?: InAppNotificationStatuses) => {
     const [activePage, setActivePage] = useState(1);
     const offset = (activePage - 1) * limit;
@@ -56,6 +36,7 @@ export const InAppNotificationPage: FC = () => {
 
     const { data: notificationData, mutate: mutateNotificationData } = useSWRxInAppNotifications(limit, offset, categoryStatus);
     const { mutate: mutateAllNotificationData } = useSWRxInAppNotifications(limit, offset, undefined);
+    const { mutate: mutateNotificationCount } = useSWRxInAppNotificationStatus();
 
     const setAllNotificationPageNumber = (selectedPageNumber): void => {
       setActivePage(selectedPageNumber);
@@ -78,6 +59,7 @@ export const InAppNotificationPage: FC = () => {
       mutateNotificationData();
       // mutate notification statuses in 'ALL' Category
       mutateAllNotificationData();
+      mutateNotificationCount();
     };
 
 

apps/app/src/client/components/Navbar/GrowiContextualSubNavigation.tsx

@@ -348,7 +348,11 @@ const GrowiContextualSubNavigation = (props: GrowiContextualSubNavigationProps):
     <>
       <GroundGlassBar className="py-4 d-block d-md-none d-print-none border-bottom" />
 
-      <Sticky className="z-1" onStateChange={status => setStickyActive(status.status === Sticky.STATUS_FIXED)}>
+      <Sticky
+        className="z-1"
+        onStateChange={status => setStickyActive(status.status === Sticky.STATUS_FIXED)}
+        innerActiveClass="w-100 end-0"
+      >
         <GroundGlassBar>
 
           <nav

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

@@ -2,7 +2,7 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 
-import { useIsReadOnlyUser } from '~/stores-universal/context';
+import { useIsReadOnlyUser, useIsRomUserAllowedToComment } from '~/stores-universal/context';
 
 import { NotAvailable } from './NotAvailable';
 
@@ -26,3 +26,26 @@ export const NotAvailableForReadOnlyUser: React.FC<{
   );
 });
 NotAvailableForReadOnlyUser.displayName = 'NotAvailableForReadOnlyUser';
+
+export const NotAvailableIfReadOnlyUserNotAllowedToComment: React.FC<{
+  children: JSX.Element
+}> = React.memo(({ children }) => {
+  const { t } = useTranslation();
+  const { data: isReadOnlyUser } = useIsReadOnlyUser();
+
+  const { data: isRomUserAllowedToComment } = useIsRomUserAllowedToComment();
+
+  const isDisabled = !!isReadOnlyUser && !isRomUserAllowedToComment;
+  const title = t('page_comment.comment_management_is_not_allowed');
+
+  return (
+    <NotAvailable
+      isDisabled={isDisabled}
+      title={title}
+      classNamePrefix="grw-not-available-for-read-only-user"
+    >
+      {children}
+    </NotAvailable>
+  );
+});
+NotAvailableIfReadOnlyUserNotAllowedToComment.displayName = 'NotAvailableIfReadOnlyUserNotAllowedToComment';

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

@@ -20,7 +20,7 @@ import type { ICommentHasId, ICommentHasIdList } from '../../interfaces/comment'
 import { useSWRxPageComment } from '../../stores/comment';
 
 import { NotAvailableForGuest } from './NotAvailableForGuest';
-import { NotAvailableForReadOnlyUser } from './NotAvailableForReadOnlyUser';
+import { NotAvailableIfReadOnlyUserNotAllowedToComment } from './NotAvailableForReadOnlyUser';
 import { Comment } from './PageComment/Comment';
 import { CommentEditor } from './PageComment/CommentEditor';
 import { DeleteCommentModal } from './PageComment/DeleteCommentModal';
@@ -183,7 +183,7 @@ export const PageComment: FC<PageCommentProps> = memo((props: PageCommentProps):
                 {(!isReadOnly && !showEditorIds.has(comment._id)) && (
                   <div className="d-flex flex-row-reverse">
                     <NotAvailableForGuest>
-                      <NotAvailableForReadOnlyUser>
+                      <NotAvailableIfReadOnlyUserNotAllowedToComment>
                         <button
                           type="button"
                           data-testid="comment-reply-button"
@@ -193,7 +193,7 @@ export const PageComment: FC<PageCommentProps> = memo((props: PageCommentProps):
                           <UserPicture user={currentUser} noLink noTooltip additionalClassName="me-2" />
                           <span className="material-symbols-outlined me-1 fs-5 pb-1">reply</span><small>{t('page_comment.reply')}...</small>
                         </button>
-                      </NotAvailableForReadOnlyUser>
+                      </NotAvailableIfReadOnlyUserNotAllowedToComment>
                     </NotAvailableForGuest>
                   </div>
                 )}

apps/app/src/client/components/PageComment/CommentControl.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 
+import { NotAvailableIfReadOnlyUserNotAllowedToComment } from '../NotAvailableForReadOnlyUser';
 
 type CommentControlProps = {
   onClickEditBtn: () => void,
@@ -13,17 +14,21 @@ export const CommentControl = (props: CommentControlProps): JSX.Element => {
   return (
     // The page-comment-control class is imported from Comment.module.scss
     <div className="page-comment-control">
-      <button type="button" className="btn btn-link p-2 opacity-50" onClick={onClickEditBtn}>
-        <span className="material-symbols-outlined">edit</span>
-      </button>
-      <button
-        data-testid="comment-delete-button"
-        type="button"
-        className="btn btn-link p-2 me-2 opacity-50"
-        onClick={onClickDeleteBtn}
-      >
-        <span className="material-symbols-outlined">close</span>
-      </button>
+      <NotAvailableIfReadOnlyUserNotAllowedToComment>
+        <>
+          <button type="button" className="btn btn-link p-2 opacity-50" onClick={onClickEditBtn}>
+            <span className="material-symbols-outlined">edit</span>
+          </button>
+          <button
+            data-testid="comment-delete-button"
+            type="button"
+            className="btn btn-link p-2 me-2 opacity-50"
+            onClick={onClickDeleteBtn}
+          >
+            <span className="material-symbols-outlined">close</span>
+          </button>
+        </>
+      </NotAvailableIfReadOnlyUserNotAllowedToComment>
     </div>
   );
 

apps/app/src/client/components/PageComment/CommentEditor.tsx

@@ -32,7 +32,7 @@ import { useCommentEditorDirtyMap } from '~/stores/ui';
 import loggerFactory from '~/utils/logger';
 
 import { NotAvailableForGuest } from '../NotAvailableForGuest';
-import { NotAvailableForReadOnlyUser } from '../NotAvailableForReadOnlyUser';
+import { NotAvailableIfReadOnlyUserNotAllowedToComment } from '../NotAvailableForReadOnlyUser';
 
 import { CommentPreview } from './CommentPreview';
 import { SwitchingButtonGroup } from './SwitchingButtonGroup';
@@ -330,7 +330,7 @@ export const CommentEditorPre = (props: CommentEditorProps): JSX.Element => {
     return (
       <CommentEditorLayout>
         <NotAvailableForGuest>
-          <NotAvailableForReadOnlyUser>
+          <NotAvailableIfReadOnlyUserNotAllowedToComment>
             <button
               type="button"
               className="btn btn-outline-primary w-100 text-start py-3"
@@ -341,7 +341,7 @@ export const CommentEditorPre = (props: CommentEditorProps): JSX.Element => {
               <span className="material-symbols-outlined me-1 fs-5">add_comment</span>
               <small>{t('page_comment.add_a_comment')}...</small>
             </button>
-          </NotAvailableForReadOnlyUser>
+          </NotAvailableIfReadOnlyUserNotAllowedToComment>
         </NotAvailableForGuest>
       </CommentEditorLayout>
     );

apps/app/src/client/components/PageHeader/PageTitleHeader.spec.tsx

@@ -0,0 +1,115 @@
+import '@testing-library/jest-dom/vitest';
+
+import { faker } from '@faker-js/faker';
+import type { IPagePopulatedToShowRevision } from '@growi/core';
+import {
+  fireEvent, render, screen, waitFor,
+} from '@testing-library/react';
+import { mock } from 'vitest-mock-extended';
+
+
+import { EditorMode } from '~/stores-universal/ui';
+
+import { PageTitleHeader } from './PageTitleHeader';
+
+const mocks = vi.hoisted(() => ({
+  useIsUntitledPageMock: vi.fn(),
+  useEditorModeMock: vi.fn(() => ({ data: EditorMode.Editor })),
+}));
+
+vi.mock('~/stores/ui', () => ({
+  useIsUntitledPage: mocks.useIsUntitledPageMock,
+}));
+vi.mock('~/stores-universal/ui', async importOriginal => ({
+  ...await importOriginal(),
+  useEditorMode: mocks.useEditorModeMock,
+}));
+
+describe('PageTitleHeader Component with untitled page', () => {
+
+  beforeAll(() => {
+    mocks.useIsUntitledPageMock.mockImplementation(() => ({ data: true }));
+  });
+
+  it('should render the textbox correctly', async() => {
+    // arrange
+    const currentPage = mock<IPagePopulatedToShowRevision>({
+      _id: faker.database.mongodbObjectId(),
+      path: '/path/to/page/Untitled-1',
+    });
+
+    // act
+    render(<PageTitleHeader currentPage={currentPage} />);
+
+    // assert
+    // header should be rendered
+    const headerElement = screen.getByText('Untitled-1');
+    const inputElement = screen.getByRole('textbox');
+    const inputElementByPlaceholder = screen.getByPlaceholderText('Input page name');
+    await waitFor(() => {
+      expect(inputElement).toBeInTheDocument();
+      expect(inputElement).toStrictEqual(inputElementByPlaceholder);
+      expect(inputElement).toHaveValue(''); // empty
+      expect(headerElement).toHaveClass('invisible');
+    });
+  });
+
+});
+
+
+describe('PageTitleHeader Component', () => {
+
+  beforeAll(() => {
+    mocks.useIsUntitledPageMock.mockImplementation(() => ({ data: false }));
+  });
+
+  it('should render the title correctly', async() => {
+    // arrange
+    const pageTitle = faker.lorem.slug();
+    const currentPage = mock<IPagePopulatedToShowRevision>({
+      _id: faker.database.mongodbObjectId(),
+      path: `/path/to/page/${pageTitle}`,
+    });
+
+    // act
+    render(<PageTitleHeader currentPage={currentPage} />);
+
+    // assert
+    // header should be rendered
+    const headerElement = screen.getByText(pageTitle);
+    await waitFor(() => {
+      expect(headerElement).toBeInTheDocument();
+      expect(headerElement).not.toHaveClass('invisible');
+    });
+    // textbox should not be rendered
+    const inputElement = screen.queryByRole('textbox');
+    expect(inputElement).not.toBeInTheDocument();
+  });
+
+  it('should render text input after clicking', async() => {
+    // arrange
+    const pageTitle = faker.lorem.slug();
+    const currentPage = mock<IPagePopulatedToShowRevision>({
+      _id: faker.database.mongodbObjectId(),
+      path: `/path/to/page/${pageTitle}`,
+    });
+
+    // act
+    render(<PageTitleHeader currentPage={currentPage} />);
+
+    const headerElement = screen.getByText(pageTitle);
+    await waitFor(() => expect(headerElement).toBeInTheDocument());
+
+    // click
+    fireEvent.click(headerElement);
+
+    // assert
+    const inputElement = screen.getByRole('textbox');
+    await waitFor(() => {
+      expect(inputElement).toBeInTheDocument();
+      expect(inputElement).toHaveValue(pageTitle);
+      expect(headerElement).toHaveClass('invisible');
+    });
+  });
+
+});

apps/app/src/client/components/PageHeader/PageTitleHeader.tsx

@@ -129,6 +129,7 @@ export const PageTitleHeader = (props: Props): JSX.Element => {
             ${isRenameInputShown ? 'invisible' : ''} text-truncate
             ${isMovable ? 'border border-2 rounded-2' : ''} ${borderColorClass}
           `}
+          style={{ maxWidth: inputMaxWidth }}
           onClick={onClickPageTitle}
         >
           {pageTitle}

apps/app/src/client/components/Sidebar/InAppNotification/PrimaryItemForNotification.tsx

@@ -1,15 +1,11 @@
 import { memo, useCallback, useEffect } from 'react';
 
-import { apiv3Post } from '~/client/util/apiv3-client';
 import { SidebarContentsType } from '~/interfaces/ui';
 import { useSWRxInAppNotificationStatus } from '~/stores/in-app-notification';
 import { useDefaultSocket } from '~/stores/socket-io';
-import loggerFactory from '~/utils/logger';
 
 import { PrimaryItem, type Props } from '../SidebarNav/PrimaryItem';
 
-const logger = loggerFactory('growi:PrimaryItemsForNotification');
-
 type PrimaryItemForNotificationProps = Omit<Props, 'onClick' | 'label' | 'iconName' | 'contents' | 'badgeContents' >
 
 // TODO(after v7 release): https://redmine.weseek.co.jp/issues/138463
@@ -22,20 +18,9 @@ export const PrimaryItemForNotification = memo((props: PrimaryItemForNotificatio
 
   const badgeContents = notificationCount != null && notificationCount > 0 ? notificationCount : undefined;
 
-  const updateNotificationStatus = useCallback(async() => {
-    try {
-      await apiv3Post('/in-app-notification/read');
-      mutateNotificationCount();
-    }
-    catch (err) {
-      logger.error(err);
-    }
-  }, [mutateNotificationCount]);
-
   const itemHoverHandler = useCallback((contents: SidebarContentsType) => {
     onHover?.(contents);
-    updateNotificationStatus();
-  }, [onHover, updateNotificationStatus]);
+  }, [onHover]);
 
   useEffect(() => {
     if (socket != null) {
@@ -57,7 +42,6 @@ export const PrimaryItemForNotification = memo((props: PrimaryItemForNotificatio
       label="In-App Notification"
       iconName="notifications"
       badgeContents={badgeContents}
-      onClick={updateNotificationStatus}
       onHover={itemHoverHandler}
     />
   );

apps/app/src/client/services/AdminGeneralSecurityContainer.js

@@ -41,6 +41,7 @@ export default class AdminGeneralSecurityContainer extends Container {
       isShowRestrictedByGroup: false,
       isUsersHomepageDeletionEnabled: false,
       isForceDeleteUserHomepageOnUserDeletion: false,
+      isRomUserAllowedToComment: false,
       isLocalEnabled: false,
       isLdapEnabled: false,
       isSamlEnabled: false,
@@ -79,6 +80,7 @@ export default class AdminGeneralSecurityContainer extends Container {
       isShowRestrictedByGroup: !generalSetting.hideRestrictedByGroup,
       isUsersHomepageDeletionEnabled: generalSetting.isUsersHomepageDeletionEnabled,
       isForceDeleteUserHomepageOnUserDeletion: generalSetting.isForceDeleteUserHomepageOnUserDeletion,
+      isRomUserAllowedToComment: generalSetting.isRomUserAllowedToComment,
       sessionMaxAge: generalSetting.sessionMaxAge,
       wikiMode: generalSetting.wikiMode,
       disableLinkSharing: shareLinkSetting.disableLinkSharing,
@@ -220,6 +222,14 @@ export default class AdminGeneralSecurityContainer extends Container {
     this.setState({ isForceDeleteUserHomepageOnUserDeletion: !this.state.isForceDeleteUserHomepageOnUserDeletion });
   }
 
+  /**
+   * switch isRomUserAllowedToComment
+   */
+  switchIsRomUserAllowedToComment(bool) {
+    this.setState({ isRomUserAllowedToComment: bool });
+  }
+
+
   /**
    * Update restrictGuestMode
    * @memberOf AdminGeneralSecuritySContainer
@@ -239,6 +249,7 @@ export default class AdminGeneralSecurityContainer extends Container {
       hideRestrictedByOwner: !this.state.isShowRestrictedByOwner,
       isUsersHomepageDeletionEnabled: this.state.isUsersHomepageDeletionEnabled,
       isForceDeleteUserHomepageOnUserDeletion: this.state.isForceDeleteUserHomepageOnUserDeletion,
+      isRomUserAllowedToComment: this.state.isRomUserAllowedToComment,
     };
 
     requestParams = await removeNullPropertyFromObject(requestParams);

apps/app/src/components/Common/PagePathNav/PagePathNav.module.scss

@@ -1,6 +1,26 @@
 @use '@growi/core-styles/scss/bootstrap/init' as bs;
 @use '@growi/ui/scss/atoms/btn-muted';
 
+
+.grw-page-path-nav-layout :global {
+  .grw-page-path-nav-copydropdown {
+    display: none;
+    @include bs.media-breakpoint-down(md) {
+      display: block;
+    }
+  }
+}
+
+.grw-page-path-nav-layout {
+  &:global {
+    &:hover {
+      .grw-page-path-nav-copydropdown {
+        display: block;
+      }
+    }
+  }
+}
+
 .grw-page-path-nav :global {
   .btn-copy {
     @include btn-muted.colorize(bs.$orange);

apps/app/src/components/Common/PagePathNav/PagePathNavLayout.tsx

@@ -6,6 +6,7 @@ import { useIsNotFound } from '~/stores/page';
 
 import styles from './PagePathNav.module.scss';
 
+const moduleClass = styles['grw-page-path-nav-layout'] ?? '';
 
 export type PagePathNavLayoutProps = {
   className?: string,
@@ -40,7 +41,10 @@ export const PagePathNavLayout = (props: Props): JSX.Element => {
   const copyDropdownId = `copydropdown-${pageId}`;
 
   return (
-    <div className={className} style={{ maxWidth }}>
+    <div
+      className={`${className} ${moduleClass}`}
+      style={{ maxWidth }}
+    >
       <span className={`${formerLinkClassName ?? ''} ${styles['grw-former-link']}`}>{formerLink}</span>
       <div className="d-flex align-items-center">
         <h1 className={`m-0 ${latterLinkClassName}`}>
@@ -51,9 +55,11 @@ export const PagePathNavLayout = (props: Props): JSX.Element => {
             { isWipPage && (
               <span className="badge text-bg-secondary ms-1 me-1">WIP</span>
             )}
-            <CopyDropdown pageId={pageId} pagePath={pagePath} dropdownToggleId={copyDropdownId} dropdownToggleClassName="p-2">
-              <span className="material-symbols-outlined">content_paste</span>
-            </CopyDropdown>
+            <span className=" grw-page-path-nav-copydropdown">
+              <CopyDropdown pageId={pageId} pagePath={pagePath} dropdownToggleId={copyDropdownId} dropdownToggleClassName="p-2">
+                <span className="material-symbols-outlined">content_paste</span>
+              </CopyDropdown>
+            </span>
           </div>
         ) }
       </div>

apps/app/src/interfaces/in-app-notification.ts

@@ -1,9 +1,8 @@
 import type { IUser } from '@growi/core';
 
-import { SupportedTargetModelType, SupportedActionType } from './activity';
+import type { SupportedTargetModelType, SupportedActionType } from './activity';
 
 export enum InAppNotificationStatuses {
-  STATUS_UNREAD = 'UNREAD',
   STATUS_UNOPENED = 'UNOPENED',
   STATUS_OPENED = 'OPENED',
 }

apps/app/src/migrations/20240924181317-changed-status-in-inappnotifications-from-unread-to-unopened.js

@@ -0,0 +1,27 @@
+import loggerFactory from '~/utils/logger';
+
+const logger = loggerFactory('growi:changed-status-in-inappnotifications-from-unread-to-unopened');
+
+module.exports = {
+  async up(db) {
+    logger.info('Apply migration');
+
+    const unreadInAppnotifications = await db.collection('inappnotifications');
+    await unreadInAppnotifications.updateMany(
+      { status: { $eq: 'UNREAD' } },
+      [
+        {
+          $set: {
+            status: 'UNOPENED',
+          },
+        },
+      ],
+    );
+
+    logger.info('Migration has successfully applied');
+  },
+
+  async down() {
+    // No rollback
+  },
+};

apps/app/src/pages/[[...path]].page.tsx

@@ -45,6 +45,7 @@ import {
   useIsUploadAllFileAllowed, useIsUploadEnabled,
   useElasticsearchMaxBodyLengthToIndex,
   useIsLocalAccountRegistrationEnabled,
+  useIsRomUserAllowedToComment,
 } from '~/stores-universal/context';
 import { useEditingMarkdown } from '~/stores/editor';
 import {
@@ -164,6 +165,8 @@ type Props = CommonProps & {
   elasticsearchMaxBodyLengthToIndex: number,
   isEnabledMarp: boolean,
 
+  isRomUserAllowedToComment: boolean,
+
   sidebarConfig: ISidebarConfig,
 
   isSlackConfigured: boolean,
@@ -242,6 +245,8 @@ const Page: NextPageWithLayout<Props> = (props: Props) => {
 
   useIsLocalAccountRegistrationEnabled(props.isLocalAccountRegistrationEnabled);
 
+  useIsRomUserAllowedToComment(props.isRomUserAllowedToComment);
+
   const { pageWithMeta } = props;
 
   const pageId = pageWithMeta?.data._id;
@@ -551,6 +556,8 @@ function injectServerConfigurations(context: GetServerSidePropsContext, props: P
   props.isSearchScopeChildrenAsDefault = configManager.getConfig('crowi', 'customize:isSearchScopeChildrenAsDefault');
   props.elasticsearchMaxBodyLengthToIndex = configManager.getConfig('crowi', 'app:elasticsearchMaxBodyLengthToIndex');
 
+  props.isRomUserAllowedToComment = configManager.getConfig('crowi', 'security:isRomUserAllowedToComment');
+
   props.isSlackConfigured = crowi.slackIntegrationService.isSlackConfigured;
   // props.isMailerSetup = mailService.isMailerSetup;
   props.isAclEnabled = aclService.isAclEnabled();

apps/app/src/pages/admin/data-transfer.page.tsx

@@ -9,8 +9,9 @@ import Head from 'next/head';
 import type { Container } from 'unstated';
 import { Provider } from 'unstated';
 
+import type { CrowiRequest } from '~/interfaces/crowi-request';
 import type { CommonProps } from '~/pages/utils/commons';
-import { useCurrentUser } from '~/stores-universal/context';
+import { useCurrentUser, useGrowiCloudUri } from '~/stores-universal/context';
 
 import { retrieveServerSideProps } from '../../utils/admin-page-util';
 
@@ -25,6 +26,7 @@ type Props = CommonProps;
 const DataTransferPage: NextPage<Props> = (props) => {
   const { t } = useTranslation('commons');
   useCurrentUser(props.currentUser ?? null);
+  useGrowiCloudUri(props.growiCloudUri);
 
   const title = t('g2g_data_transfer.data_transfer');
 
@@ -54,9 +56,15 @@ const DataTransferPage: NextPage<Props> = (props) => {
   );
 };
 
+const injectServerConfigurations = async(context: GetServerSidePropsContext, props: Props): Promise<void> => {
+  const req: CrowiRequest = context.req as CrowiRequest;
+  const { crowi } = req;
+
+  props.growiCloudUri = await crowi.configManager.getConfig('crowi', 'app:growiCloudUri');
+};
 
 export const getServerSideProps: GetServerSideProps = async(context: GetServerSidePropsContext) => {
-  const props = await retrieveServerSideProps(context);
+  const props = await retrieveServerSideProps(context, injectServerConfigurations);
   return props;
 };
 

apps/app/src/pages/installer.page.tsx

@@ -11,7 +11,7 @@ import Head from 'next/head';
 import { NoLoginLayout } from '~/components/Layout/NoLoginLayout';
 import type { CrowiRequest } from '~/interfaces/crowi-request';
 import {
-  useCsrfToken, useAppTitle, useSiteUrl, useConfidential,
+  useCsrfToken, useAppTitle, useSiteUrl, useConfidential, useGrowiCloudUri,
 } from '~/stores-universal/context';
 
 import type { CommonProps } from './utils/commons';
@@ -57,6 +57,7 @@ const InstallerPage: NextPage<Props> = (props: Props) => {
   useSiteUrl(props.siteUrl);
   useConfidential(props.confidential);
   useCsrfToken(props.csrfToken);
+  useGrowiCloudUri(props.growiCloudUri);
 
   const title = generateCustomTitle(props, t('installer.title'));
   const classNames: string[] = [];

apps/app/src/server/middlewares/exclude-read-only-user.ts

@@ -1,9 +1,12 @@
 import { ErrorV3 } from '@growi/core/dist/models';
-import { NextFunction, Response } from 'express';
-import { Request } from 'express-validator/src/base';
+import type { NextFunction, Response } from 'express';
+import type { Request } from 'express-validator/src/base';
 
 import loggerFactory from '~/utils/logger';
 
+import { configManager } from '../service/config-manager';
+
+
 const logger = loggerFactory('growi:middleware:exclude-read-only-user');
 
 export const excludeReadOnlyUser = (req: Request, res: Response & { apiv3Err }, next: () => NextFunction): NextFunction => {
@@ -23,3 +26,24 @@ export const excludeReadOnlyUser = (req: Request, res: Response & { apiv3Err },
 
   return next();
 };
+
+export const excludeReadOnlyUserIfCommentNotAllowed = (req: Request, res: Response & { apiv3Err }, next: () => NextFunction): NextFunction => {
+  const user = req.user;
+
+  const isRomUserAllowedToComment = configManager.getConfig('crowi', 'security:isRomUserAllowedToComment');
+
+  if (user == null) {
+    logger.warn('req.user is null');
+    return next();
+  }
+
+  if (user.readOnly && !isRomUserAllowedToComment) {
+    const message = 'This user is read only user and comment is not allowed';
+    logger.warn(message);
+
+    return res.apiv3Err(new ErrorV3(message, 'validation_failed'));
+  }
+
+  return next();
+
+};

apps/app/src/server/models/config.ts

@@ -75,6 +75,7 @@ export const defaultCrowiConfigs: { [key: string]: any } = {
   'security:disableLinkSharing' : false,
   'security:user-homepage-deletion:isEnabled': false,
   'security:user-homepage-deletion:isForceDeleteUserHomepageOnUserDeletion': false,
+  'security:isRomUserAllowedToComment': false,
 
   'security:passport-local:isEnabled' : true,
   'security:passport-ldap:isEnabled' : false,

apps/app/src/server/models/in-app-notification.ts

@@ -10,7 +10,7 @@ import { getOrCreateModel } from '../util/mongoose-utils';
 import type { ActivityDocument } from './activity';
 
 
-const { STATUS_UNREAD, STATUS_UNOPENED, STATUS_OPENED } = InAppNotificationStatuses;
+const { STATUS_UNOPENED, STATUS_OPENED } = InAppNotificationStatuses;
 
 export interface InAppNotificationDocument extends Document {
   _id: Types.ObjectId
@@ -31,7 +31,6 @@ export interface InAppNotificationModel extends Model<InAppNotificationDocument>
   open(user, id: Types.ObjectId): Promise<InAppNotificationDocument | null>
   read(user) /* : Promise<Query<any>> */
 
-  STATUS_UNREAD: string
   STATUS_UNOPENED: string
   STATUS_OPENED: string
 }
@@ -66,7 +65,7 @@ const inAppNotificationSchema = new Schema<InAppNotificationDocument, InAppNotif
   ],
   status: {
     type: String,
-    default: STATUS_UNREAD,
+    default: STATUS_UNOPENED,
     enum: InAppNotificationStatuses,
     index: true,
     required: true,
@@ -95,9 +94,6 @@ inAppNotificationSchema.index({
 inAppNotificationSchema.statics.STATUS_UNOPENED = function() {
   return STATUS_UNOPENED;
 };
-inAppNotificationSchema.statics.STATUS_UNREAD = function() {
-  return STATUS_UNREAD;
-};
 inAppNotificationSchema.statics.STATUS_OPENED = function() {
   return STATUS_OPENED;
 };

apps/app/src/server/routes/apiv3/in-app-notification.ts

@@ -93,18 +93,6 @@ module.exports = (crowi) => {
     }
   });
 
-  router.post('/read', accessTokenParser, loginRequiredStrictly, async(req: CrowiRequest, res: ApiV3Response) => {
-    const user = req.user;
-
-    try {
-      await inAppNotificationService.read(user);
-      return res.apiv3();
-    }
-    catch (err) {
-      return res.apiv3Err(err);
-    }
-  });
-
   router.post('/open', accessTokenParser, loginRequiredStrictly, async(req: CrowiRequest, res: ApiV3Response) => {
     // user must be set by loginRequiredStrictly
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion

apps/app/src/server/routes/apiv3/security-settings/index.js

@@ -364,6 +364,7 @@ module.exports = (crowi) => {
         isUsersHomepageDeletionEnabled: await configManager.getConfig('crowi', 'security:user-homepage-deletion:isEnabled'),
         isForceDeleteUserHomepageOnUserDeletion:
         await configManager.getConfig('crowi', 'security:user-homepage-deletion:isForceDeleteUserHomepageOnUserDeletion'),
+        isRomUserAllowedToComment: await configManager.getConfig('crowi', 'security:isRomUserAllowedToComment'),
         wikiMode: await configManager.getConfig('crowi', 'security:wikiMode'),
         sessionMaxAge: await configManager.getConfig('crowi', 'security:sessionMaxAge'),
       },
@@ -637,6 +638,7 @@ module.exports = (crowi) => {
       'security:user-homepage-deletion:isForceDeleteUserHomepageOnUserDeletion': req.body.isUsersHomepageDeletionEnabled
         ? req.body.isForceDeleteUserHomepageOnUserDeletion
         : false,
+      'security:isRomUserAllowedToComment': req.body.isRomUserAllowedToComment,
     };
 
     // Validate delete config
@@ -670,6 +672,7 @@ module.exports = (crowi) => {
         isUsersHomepageDeletionEnabled: await configManager.getConfig('crowi', 'security:user-homepage-deletion:isEnabled'),
         isForceDeleteUserHomepageOnUserDeletion:
         await configManager.getConfig('crowi', 'security:user-homepage-deletion:isForceDeleteUserHomepageOnUserDeletion'),
+        isRomUserAllowedToComment: await configManager.getConfig('crowi', 'security:isRomUserAllowedToComment'),
       };
 
       const parameters = { action: SupportedAction.ACTION_ADMIN_SECURITY_SETTINGS_UPDATE };

apps/app/src/server/routes/index.js

@@ -5,7 +5,7 @@ import { middlewareFactory as rateLimiterFactory } from '~/features/rate-limiter
 
 import { generateAddActivityMiddleware } from '../middlewares/add-activity';
 import apiV1FormValidator from '../middlewares/apiv1-form-validator';
-import { excludeReadOnlyUser } from '../middlewares/exclude-read-only-user';
+import { excludeReadOnlyUser, excludeReadOnlyUserIfCommentNotAllowed } from '../middlewares/exclude-read-only-user';
 import injectResetOrderByTokenMiddleware from '../middlewares/inject-reset-order-by-token-middleware';
 import injectUserRegistrationOrderByTokenMiddleware from '../middlewares/inject-user-registration-order-by-token-middleware';
 import * as loginFormValidator from '../middlewares/login-form-validator';
@@ -131,9 +131,9 @@ module.exports = function(crowi, app) {
   apiV1Router.get('/tags.search'         , accessTokenParser, loginRequired, tag.api.search);
   apiV1Router.post('/tags.update'        , accessTokenParser, loginRequiredStrictly, excludeReadOnlyUser, addActivity, tag.api.update);
   apiV1Router.get('/comments.get'        , accessTokenParser , loginRequired , comment.api.get);
-  apiV1Router.post('/comments.add'       , comment.api.validators.add(), accessTokenParser , loginRequiredStrictly , excludeReadOnlyUser, addActivity, comment.api.add);
-  apiV1Router.post('/comments.update'    , comment.api.validators.add(), accessTokenParser , loginRequiredStrictly , excludeReadOnlyUser, addActivity, comment.api.update);
-  apiV1Router.post('/comments.remove'    , accessTokenParser , loginRequiredStrictly , excludeReadOnlyUser, addActivity, comment.api.remove);
+  apiV1Router.post('/comments.add'       , comment.api.validators.add(), accessTokenParser , loginRequiredStrictly , excludeReadOnlyUserIfCommentNotAllowed, addActivity, comment.api.add);
+  apiV1Router.post('/comments.update'    , comment.api.validators.add(), accessTokenParser , loginRequiredStrictly , excludeReadOnlyUserIfCommentNotAllowed, addActivity, comment.api.update);
+  apiV1Router.post('/comments.remove'    , accessTokenParser , loginRequiredStrictly , excludeReadOnlyUserIfCommentNotAllowed, addActivity, comment.api.remove);
 
   apiV1Router.post('/attachments.uploadProfileImage'   , uploads.single('file'), autoReap, accessTokenParser, loginRequiredStrictly , excludeReadOnlyUser, attachmentApi.uploadProfileImage);
   apiV1Router.post('/attachments.remove'               , accessTokenParser , loginRequiredStrictly , excludeReadOnlyUser, addActivity ,attachmentApi.remove);

apps/app/src/server/service/in-app-notification.ts

@@ -25,7 +25,7 @@ import { preNotifyService, type PreNotify } from './pre-notify';
 import { RoomPrefix, getRoomNameWithId } from './socket-io/helper';
 
 
-const { STATUS_UNREAD, STATUS_UNOPENED, STATUS_OPENED } = InAppNotificationStatuses;
+const { STATUS_UNOPENED, STATUS_OPENED } = InAppNotificationStatuses;
 
 const logger = loggerFactory('growi:service:inAppNotification');
 
@@ -93,7 +93,7 @@ export default class InAppNotificationService {
         targetModel,
         target,
         action,
-        status: STATUS_UNREAD,
+        status: STATUS_UNOPENED,
         createdAt: now,
         snapshot,
         $addToSet: { activities: activityId },
@@ -147,14 +147,6 @@ export default class InAppNotificationService {
     }
   };
 
-  read = async function(user: Types.ObjectId): Promise<void> {
-    const query = { user, status: STATUS_UNREAD };
-    const parameters = { status: STATUS_UNOPENED };
-    await InAppNotification.updateMany(query, parameters);
-
-    return;
-  };
-
   open = async function(user: IUser & HasObjectId, id: Types.ObjectId): Promise<void> {
     const query = { _id: id, user: user._id };
     const parameters = { status: STATUS_OPENED };
@@ -173,7 +165,7 @@ export default class InAppNotificationService {
   };
 
   getUnreadCountByUser = async function(user: Types.ObjectId): Promise<number| undefined> {
-    const query = { user, status: STATUS_UNREAD };
+    const query = { user, status: STATUS_UNOPENED };
 
     try {
       const count = await InAppNotification.countDocuments(query);

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

@@ -1,5 +1,3 @@
-import { useCallback, useEffect } from 'react';
-
 import type EventEmitter from 'events';
 
 import { AcceptedUploadFileType } from '@growi/core';
@@ -208,6 +206,10 @@ export const useIsLocalAccountRegistrationEnabled = (initialData?: boolean): SWR
   return useContextSWR('isLocalAccountRegistrationEnabled', initialData);
 };
 
+export const useIsRomUserAllowedToComment = (initialData?: boolean): SWRResponse<boolean, Error> => {
+  return useContextSWR('isRomUserAllowedToComment', initialData);
+};
+
 /** **********************************************************
  *                     Computed contexts
  *********************************************************** */
@@ -285,3 +287,23 @@ export const useAcceptedUploadFileType = (): SWRResponse<AcceptedUploadFileType,
     },
   );
 };
+
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export const useGrowiDocumentationUrl = () => {
+  const { data: growiCloudUri } = useGrowiCloudUri();
+
+  return useSWR(
+    ['documentationUrl', growiCloudUri],
+    ([, growiCloudUri]) => {
+      const url = growiCloudUri != null
+        ? new URL('/help', growiCloudUri)
+        : new URL('https://docs.growi.org');
+      return url.toString();
+    },
+    {
+      fallbackData: 'https://docs.growi.org',
+      revalidateOnFocus: false,
+      revalidateOnReconnect: false,
+    },
+  );
+};

apps/app/test-with-vite/download-mongo-binary/vitest.config.ts

@@ -1,15 +1,16 @@
-import { defineConfig, mergeConfig } from 'vitest/config';
+import tsconfigPaths from 'vite-tsconfig-paths';
+import { defineConfig } from 'vitest/config';
 
-import configShared from '../../vitest.config';
-
-export default mergeConfig(
-  configShared,
-  defineConfig({
-    test: {
-      hookTimeout: 60000, // increased for downloading MongoDB binary file
-      setupFiles: [
-        './test-with-vite/setup/mongoms.ts',
-      ],
-    },
-  }),
-);
+export default defineConfig({
+  plugins: [
+    tsconfigPaths(),
+  ],
+  test: {
+    clearMocks: true,
+    globals: true,
+    hookTimeout: 60000, // increased for downloading MongoDB binary file
+    setupFiles: [
+      './test-with-vite/setup/mongoms.ts',
+    ],
+  },
+});

apps/app/vitest.config.components.ts

@@ -1,19 +0,0 @@
-import react from '@vitejs/plugin-react';
-import tsconfigPaths from 'vite-tsconfig-paths';
-import { defineConfig } from 'vitest/config';
-
-export default defineConfig({
-  plugins: [
-    react(), tsconfigPaths(),
-  ],
-  test: {
-    globals: true,
-    environment: 'happy-dom',
-    include: [
-      '**/*.spec.{tsx,jsx}',
-    ],
-    coverage: {
-      reportsDirectory: './coverage/components',
-    },
-  },
-});

apps/app/vitest.config.integ.ts

@@ -1,23 +0,0 @@
-import { defineConfig, mergeConfig } from 'vitest/config';
-
-import configShared from './vitest.config';
-
-export default mergeConfig(
-  configShared,
-  defineConfig({
-    test: {
-      include: [
-        '**/*.integ.ts',
-      ],
-      setupFiles: [
-        './test-with-vite/setup/mongoms.ts',
-      ],
-      coverage: {
-        reportsDirectory: './coverage/integ',
-        exclude: [
-          '**/*{.,-}integ.ts',
-        ],
-      },
-    },
-  }),
-);

apps/app/vitest.config.ts

@@ -1,19 +0,0 @@
-import tsconfigPaths from 'vite-tsconfig-paths';
-import { defineConfig } from 'vitest/config';
-
-export default defineConfig({
-  plugins: [
-    tsconfigPaths(),
-  ],
-  test: {
-    environment: 'node',
-    exclude: [
-      '**/test/**', '**/*.spec.{tsx,jsx}',
-    ],
-    clearMocks: true,
-    globals: true,
-    coverage: {
-      reportsDirectory: './coverage/unit',
-    },
-  },
-});

apps/app/vitest.workspace.mts

@@ -0,0 +1,65 @@
+import react from '@vitejs/plugin-react';
+import tsconfigPaths from 'vite-tsconfig-paths';
+import {
+  defineConfig, defineWorkspace, mergeConfig,
+} from 'vitest/config';
+
+const configShared = defineConfig({
+  plugins: [
+    tsconfigPaths(),
+  ],
+  test: {
+    clearMocks: true,
+    globals: true,
+    exclude: [
+      'test/**',
+      'test-with-vite/**',
+      'playwright/**',
+    ]
+  },
+});
+
+export default defineWorkspace([
+
+  // unit test
+  mergeConfig(
+    configShared,
+    {
+      test: {
+        name: 'app-unit',
+        environment: 'node',
+        include: ['**/*.spec.{ts,js}'],
+      },
+    },
+  ),
+
+  // integration test
+  mergeConfig(
+    configShared,
+    {
+      test: {
+        name: 'app-integration',
+        environment: 'node',
+        include: ['**/*.integ.ts'],
+        setupFiles: [
+          './test-with-vite/setup/mongoms.ts',
+        ],
+      },
+    },
+  ),
+
+  // component test
+  mergeConfig(
+    configShared,
+    {
+      plugins: [react()],
+      test: {
+        name: 'app-components',
+        environment: 'happy-dom',
+        include: [
+          '**/*.spec.{tsx,jsx}',
+        ],
+      },
+    },
+  ),
+]);

apps/slackbot-proxy/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@growi/slackbot-proxy",
-  "version": "7.0.20-slackbot-proxy.0",
+  "version": "7.1.0-slackbot-proxy.0",
   "license": "MIT",
   "private": "true",
   "scripts": {
@@ -20,7 +20,7 @@
     "lint:styles": "stylelint --allow-empty-input \"src/**/*.scss\" \"src/**/*.css\"",
     "lint:typecheck": "tspc",
     "lint": "run-p lint:*",
-    "version": "yarn version --no-git-tag-version --preid=slackbot-proxy",
+    "version": "yarn version --no-git-tag-version --non-interactive --preid=slackbot-proxy",
     "ts-node": "node -r ts-node/register/transpile-only -r tsconfig-paths/register -r dotenv-flow/config"
   },
   "// comments for dependencies": {

apps/slackbot-proxy/turbo.json

@@ -31,11 +31,6 @@
     "test": {
       "dependsOn": ["@growi/slack#dev"],
       "outputLogs": "new-only"
-    },
-
-    "version": {
-      "cache": false,
-      "dependsOn": ["^version", "//#version"]
     }
 
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "growi",
-  "version": "7.0.20-RC.0",
+  "version": "7.1.0-RC.0",
   "description": "Team collaboration software using markdown",
   "license": "MIT",
   "private": "true",
@@ -41,7 +41,7 @@
     "version-subpackages": "changeset version && yarn upgrade --scope=@growi",
     "release-subpackages": "turbo run build --filter @growi/core --filter @growi/pluginkit && changeset publish",
     "release-subpackages:snapshot": "turbo run build --filter @growi/core --filter @growi/pluginkit && changeset version --snapshot next && changeset publish --no-git-tag --snapshot --tag next",
-    "version": "yarn version --no-git-tag-version --preid=RC"
+    "version": "yarn version --no-git-tag-version --non-interactive --preid=RC"
   },
   "dependencies": {
     "cross-env": "^7.0.0",
@@ -52,7 +52,7 @@
     "yargs": "^17.7.1"
   },
   "// comments for defDependencies": {
-    "vitest": "v1.6.0 occures an error on ci-app-test: \"ENOENT: no such file or directory, lstat '/home/runner/work/growi/growi/apps/app/coverage/.tmp'\""
+    "vite-plugin-dts": "v4.2.1 causes the unexpected error 'Cannot find package 'vue-tsc''"
   },
   "devDependencies": {
     "@changesets/changelog-github": "^0.5.0",
@@ -69,8 +69,8 @@
     "@typescript-eslint/eslint-plugin": "^5.59.7",
     "@typescript-eslint/parser": "^5.59.7",
     "@vitejs/plugin-react": "^4.3.1",
-    "@vitest/coverage-v8": "^1.6.0",
-    "@vitest/ui": "^1.6.0",
+    "@vitest/coverage-v8": "^2.1.1",
+    "@vitest/ui": "^2.1.1",
     "eslint": "^8.41.0",
     "eslint-config-next": "^12.1.6",
     "eslint-config-weseek": "^2.1.1",
@@ -81,6 +81,7 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-rulesdir": "^0.2.2",
     "eslint-plugin-vitest": "^0.2.3",
+    "@faker-js/faker": "^9.0.1",
     "glob": "^8.1.0",
     "mock-require": "^3.0.3",
     "nodemon": "^3.1.3",
@@ -100,10 +101,10 @@
     "tsconfig-paths": "^4.2.0",
     "typescript": "~5.0.0",
     "typescript-transform-paths": "^3.4.7",
-    "vite": "^5.2.9",
-    "vite-plugin-dts": "^3.8.3",
-    "vite-tsconfig-paths": "^4.3.2",
-    "vitest": "~1.6.0",
+    "vite": "^5.4.6",
+    "vite-plugin-dts": "^3.9.1",
+    "vite-tsconfig-paths": "^5.0.1",
+    "vitest": "^2.1.1",
     "vitest-mock-extended": "^1.3.1"
   },
   "engines": {

packages/core-styles/scss/bootstrap/theming/_dropdown-dark.scss

@@ -0,0 +1,5 @@
+@use '@growi/core-styles/scss/bootstrap/init' as bs;
+
+.dropdown-item:active{
+  --#{$prefix}dropdown-link-active-bg: var(--#{$prefix}gray-700);
+}

packages/core-styles/scss/bootstrap/theming/_dropdown-light.scss

@@ -0,0 +1,6 @@
+@use '@growi/core-styles/scss/bootstrap/init' as bs;
+
+.dropdown-item:active{
+  --#{$prefix}dropdown-link-active-color: var(----#{$prefix}gray-600);
+  --#{$prefix}dropdown-link-active-bg: var(----#{$prefix}gray-200);
+}

packages/core-styles/scss/bootstrap/theming/apply-dark.scss

@@ -5,3 +5,4 @@
 @import './pagination';
 @import './progress';
 @import './list-group';
+@import './dropdown-dark';

packages/core-styles/scss/bootstrap/theming/apply-light.scss

@@ -5,3 +5,4 @@
 @import './pagination';
 @import './progress';
 @import './list-group';
+@import './dropdown-light';

packages/pluginkit/src/v4/utils/template.spec.ts

@@ -0,0 +1,81 @@
+import type { TemplateSummary } from '../interfaces';
+
+import { getLocalizedTemplate, extractSupportedLocales } from './template';
+
+describe('getLocalizedTemplate', () => {
+  it('should return undefined if templateSummary is undefined', () => {
+    expect(getLocalizedTemplate(undefined)).toBeUndefined();
+  });
+
+  it('should return the default template if locale is not provided', () => {
+    const templateSummary: TemplateSummary = {
+      default: {
+        id: 'templateId',
+        locale: 'en_US',
+        isValid: true,
+        isDefault: true,
+        title: 'Default Title',
+      },
+    };
+    expect(getLocalizedTemplate(templateSummary)).toEqual(templateSummary.default);
+  });
+
+  it('should return the localized template if locale is provided and exists in templateSummary', () => {
+    const templateSummary: TemplateSummary = {
+      default: {
+        id: 'templateId',
+        locale: 'en_US',
+        isValid: true,
+        isDefault: true,
+        title: 'Default Title',
+      },
+      ja_JP: {
+        id: 'templateId',
+        locale: 'ja_JP',
+        isValid: true,
+        isDefault: false,
+        title: 'Japanese Title',
+      },
+    };
+    expect(getLocalizedTemplate(templateSummary, 'ja_JP')).toEqual(templateSummary.ja_JP);
+  });
+
+  it('should return the default template if locale is provided but does not exist in templateSummary', () => {
+    const templateSummary: TemplateSummary = {
+      default: {
+        id: 'templateId',
+        locale: 'en_US',
+        isValid: true,
+        isDefault: true,
+        title: 'Default Title',
+      },
+    };
+    expect(getLocalizedTemplate(templateSummary, 'fr')).toEqual(templateSummary.default);
+  });
+});
+
+describe('extractSupportedLocales', () => {
+  it('should return undefined if templateSummary is undefined', () => {
+    expect(extractSupportedLocales(undefined)).toBeUndefined();
+  });
+
+  it('should return a set of locales from the templateSummary', () => {
+    const templateSummary: TemplateSummary = {
+      default: {
+        id: 'templateId',
+        locale: 'en_US',
+        isValid: true,
+        isDefault: true,
+        title: 'Default Title',
+      },
+      ja_JP: {
+        id: 'templateId',
+        locale: 'ja_JP',
+        isValid: true,
+        isDefault: false,
+        title: 'Japanese Title',
+      },
+    };
+    expect(extractSupportedLocales(templateSummary)).toEqual(new Set(['en_US', 'ja_JP']));
+  });
+});

packages/pluginkit/vitest.config.ts

@@ -1,5 +1,5 @@
 import tsconfigPaths from 'vite-tsconfig-paths';
-import { defineConfig } from 'vitest/config';
+import { defineConfig, coverageConfigDefaults } from 'vitest/config';
 
 export default defineConfig({
   plugins: [
@@ -10,11 +10,16 @@ export default defineConfig({
     clearMocks: true,
     globals: true,
     coverage: {
+      exclude: [
+        ...coverageConfigDefaults.exclude,
+        'src/v4/interfaces/**',
+        'src/**/index.ts',
+      ],
       thresholds: {
-        statements: 42.78,
-        branches: 63.15,
-        lines: 42.78,
-        functions: 26.31,
+        statements: 47.59,
+        branches: 89.47,
+        lines: 47.59,
+        functions: 66.66,
       },
     },
   },

vitest.workspace.ts → vitest.workspace.mts

@@ -1,4 +1,6 @@
 export default [
   'apps/*/vitest.config.ts',
+  'apps/*/vitest.workspace.ts',
   'packages/*/vitest.config.ts',
+  'packages/*/vitest.workspace.ts',
 ];