preveint SSR

packages/app/src/components/Admin/UserGroup/UserGroupPage.tsx

@@ -9,9 +9,9 @@ import { IUserGroup, IUserGroupHasId } from '~/interfaces/user';
 import { useIsAclEnabled } from '~/stores/context';
 import { useSWRxUserGroupList, useSWRxChildUserGroupList, useSWRxUserGroupRelationList } from '~/stores/user-group';
 
-const UserGroupDeleteModal = dynamic(() => import('./UserGroupDeleteModal').then(module => module.UserGroupDeleteModal));
-const UserGroupModal = dynamic(() => import('./UserGroupModal').then(module => module.UserGroupModal));
-const UserGroupTable = dynamic(() => import('./UserGroupTable').then(module => module.UserGroupTable));
+const UserGroupDeleteModal = dynamic(() => import('./UserGroupDeleteModal').then(mod => mod.UserGroupDeleteModal), { ssr: false });
+const UserGroupModal = dynamic(() => import('./UserGroupModal').then(mod => mod.UserGroupModal), { ssr: false });
+const UserGroupTable = dynamic(() => import('./UserGroupTable').then(mod => mod.UserGroupTable), { ssr: false });
 
 export const UserGroupPage: FC = () => {
   const { t } = useTranslation();

packages/app/src/components/Admin/UserGroupDetail/UserGroupDetailPage.tsx

@@ -21,12 +21,12 @@ import {
   useSWRxSelectableParentUserGroups, useSWRxSelectableChildUserGroups, useSWRxAncestorUserGroups,
 } from '~/stores/user-group';
 
-const UserGroupDeleteModal = dynamic(() => import('../UserGroup/UserGroupDeleteModal').then(module => module.UserGroupDeleteModal));
-const UserGroupDropdown = dynamic(() => import('../UserGroup/UserGroupDropdown').then(module => module.UserGroupDropdown));
-const UserGroupForm = dynamic(() => import('../UserGroup/UserGroupForm').then(module => module.UserGroupForm));
-const UserGroupModal = dynamic(() => import('../UserGroup/UserGroupModal').then(module => module.UserGroupModal));
-const UserGroupTable = dynamic(() => import('../UserGroup/UserGroupTable').then(module => module.UserGroupTable));
-const UpdateParentConfirmModal = dynamic(() => import('./UpdateParentConfirmModal').then(module => module.UpdateParentConfirmModal));
+const UserGroupDeleteModal = dynamic(() => import('../UserGroup/UserGroupDeleteModal').then(mod => mod.UserGroupDeleteModal), { ssr: false });
+const UserGroupDropdown = dynamic(() => import('../UserGroup/UserGroupDropdown').then(mod => mod.UserGroupDropdown), { ssr: false });
+const UserGroupForm = dynamic(() => import('../UserGroup/UserGroupForm').then(mod => mod.UserGroupForm), { ssr: false });
+const UserGroupModal = dynamic(() => import('../UserGroup/UserGroupModal').then(mod => mod.UserGroupModal), { ssr: false });
+const UserGroupTable = dynamic(() => import('../UserGroup/UserGroupTable').then(mod => mod.UserGroupTable), { ssr: false });
+const UpdateParentConfirmModal = dynamic(() => import('./UpdateParentConfirmModal').then(mod => mod.UpdateParentConfirmModal), { ssr: false });
 // import UserGroupPageList from './UserGroupPageList';
 // import UserGroupUserModal from './UserGroupUserModal';
 // import UserGroupUserTable from './UserGroupUserTable';
@@ -343,7 +343,9 @@ export const UserGroupDetailPage = (props: Props) => {
       <h2 className="admin-setting-header mt-4">{t('admin:user_group_management.user_list')}</h2>
       {/* These compoents will be successfully shown in https://redmine.weseek.co.jp/issues/102159 */}
       {/* <UserGroupUserTable /> */}
+      UserGroupUserTable
       {/* <UserGroupUserModal /> */}
+      UserGroupUserModal
 
       <h2 className="admin-setting-header mt-4">{t('admin:user_group_management.child_group_list')}</h2>
       <UserGroupDropdown
@@ -391,6 +393,7 @@ export const UserGroupDetailPage = (props: Props) => {
       <div className="page-list">
         {/* This compoent will be successfully shown in https://redmine.weseek.co.jp/issues/102159 */}
         {/* <UserGroupPageList /> */}
+        UserGroupPageList
       </div>
     </div>
   );

packages/app/src/components/Layout/AdminLayout.tsx

@@ -8,7 +8,7 @@ import { RawLayout } from './RawLayout';
 
 import styles from './Admin.module.scss';
 
-const AdminNotFoundPage = dynamic(() => import('../Admin/NotFoundPage').then(module => module.AdminNotFoundPage));
+const AdminNotFoundPage = dynamic(() => import('../Admin/NotFoundPage').then(mod => mod.AdminNotFoundPage), { ssr: false });
 
 
 type Props = {

packages/app/src/pages/admin/[[...path]].page.tsx

@@ -57,10 +57,13 @@ const UserManagement = dynamic(() => import('../../components/Admin/UserManageme
 const ManageExternalAccount = dynamic(() => import('../../components/Admin/ManageExternalAccount'), { ssr: false });
 const ElasticsearchManagement = dynamic(() => import('../../components/Admin/ElasticsearchManagement/ElasticsearchManagement'), { ssr: false });
 // named export
-const UserGroupPage = dynamic(() => import('../../components/Admin/UserGroup/UserGroupPage').then(module => module.UserGroupPage));
-const UserGroupDetailPage = dynamic(() => import('../../components/Admin/UserGroupDetail/UserGroupDetailPage').then(module => module.UserGroupDetailPage));
-const AuditLogManagement = dynamic(() => import('../../components/Admin/AuditLogManagement').then(module => module.AuditLogManagement));
-const AdminLayout = dynamic(() => import('../../components/Layout/AdminLayout').then(module => module.AdminLayout));
+const UserGroupPage = dynamic(() => import('../../components/Admin/UserGroup/UserGroupPage').then(mod => mod.UserGroupPage), { ssr: false });
+const UserGroupDetailPage = dynamic(
+  () => import('../../components/Admin/UserGroupDetail/UserGroupDetailPage').then(mod => mod.UserGroupDetailPage),
+  { ssr: false },
+);
+const AuditLogManagement = dynamic(() => import('../../components/Admin/AuditLogManagement').then(mod => mod.AuditLogManagement), { ssr: false });
+const AdminLayout = dynamic(() => import('../../components/Layout/AdminLayout').then(mod => mod.AdminLayout), { ssr: false });
 
 const pluginUtils = new PluginUtils();