refactor

apps/app/src/client/components/Admin/Customize/CustomizeTitle.tsx

@@ -6,7 +6,7 @@ import { Card, CardBody } from 'reactstrap';
 
 import { apiv3Put } from '~/client/util/apiv3-client';
 import { toastSuccess, toastError } from '~/client/util/toastr';
-import { useCustomizeTitle } from '~/stores-universal/context';
+import { useCustomTitleTemplate } from '~/states/global';
 
 import AdminUpdateButtonRow from '../Common/AdminUpdateButtonRow';
 
@@ -14,9 +14,9 @@ export const CustomizeTitle: FC = () => {
 
   const { t } = useTranslation('admin');
 
-  const { data: customizeTitle } = useCustomizeTitle();
+  const customTitleTemplate = useCustomTitleTemplate();
 
-  const [currentCustomizeTitle, setCrrentCustomizeTitle] = useState(customizeTitle ?? '');
+  const [currentCustomizeTitle, setCrrentCustomizeTitle] = useState(customTitleTemplate ?? '');
 
   const onClickSubmit = async() => {
     try {

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

@@ -322,7 +322,7 @@ export const CommentEditorPre = (props: CommentEditorProps): JSX.Element => {
 
   const { onCommented, onCanceled, ...rest } = props;
 
-  const [currentUser] = useCurrentUser();
+  const currentUser = useCurrentUser();
   const { mutate: mutateResolvedTheme } = useResolvedThemeForEditor();
   const { resolvedTheme } = useNextThemes();
   mutateResolvedTheme({ themeData: resolvedTheme });

apps/app/src/client/components/PageEditor/EditorNavbarBottom/EditorNavbarBottom.tsx

@@ -1,8 +1,9 @@
 import type { JSX } from 'react';
 
+import { useAtomValue } from 'jotai';
 import dynamic from 'next/dynamic';
 
-import { useIsAiEnabled } from '~/states/server-configurations';
+import { aiEnabledAtom } from '~/states/server-configurations';
 import { useDrawerOpened } from '~/states/ui/sidebar';
 
 import { EditorAssistantToggleButton } from './EditorAssistantToggleButton';
@@ -16,7 +17,7 @@ const SavePageControls = dynamic(() => import('./SavePageControls').then(mod =>
 const OptionsSelector = dynamic(() => import('./OptionsSelector').then(mod => mod.OptionsSelector), { ssr: false });
 
 export const EditorNavbarBottom = (): JSX.Element => {
-  const [isAiEnabled] = useIsAiEnabled();
+  const isAiEnabled = useAtomValue(aiEnabledAtom);
   const [, setIsDrawerOpened] = useDrawerOpened();
 
   return (

apps/app/src/client/components/PageEditor/EditorNavbarBottom/OptionsSelector.tsx

@@ -5,13 +5,14 @@ import React, {
 import {
   type EditorTheme, type KeyMapMode, PasteMode, AllPasteMode, DEFAULT_KEYMAP, DEFAULT_PASTE_MODE, DEFAULT_THEME,
 } from '@growi/editor';
+import { useAtomValue } from 'jotai';
 import { useTranslation } from 'next-i18next';
 import Image from 'next/image';
 import {
   Dropdown, DropdownToggle, DropdownMenu, Input, FormGroup,
 } from 'reactstrap';
 
-import { useIsIndentSizeForced } from '~/states/server-configurations';
+import { isIndentSizeForcedAtom } from '~/states/server-configurations';
 import { useEditorSettings, useCurrentIndentSize } from '~/stores/editor';
 import {
   useIsDeviceLargerThanMd,
@@ -305,7 +306,7 @@ export const OptionsSelector = (): JSX.Element => {
   const [status, setStatus] = useState<OptionStatus>(OptionsStatus.Home);
   const { data: editorSettings } = useEditorSettings();
   const { data: currentIndentSize } = useCurrentIndentSize();
-  const [isIndentSizeForced] = useIsIndentSizeForced();
+  const isIndentSizeForced = useAtomValue(isIndentSizeForcedAtom);
   const { data: isDeviceLargerThanMd } = useIsDeviceLargerThanMd();
 
   if (editorSettings == null || currentIndentSize == null || isIndentSizeForced == null) {

apps/app/src/client/components/PageEditor/EditorNavbarBottom/SavePageControls.tsx

@@ -7,6 +7,7 @@ import type EventEmitter from 'events';
 import { PageGrant } from '@growi/core';
 import { isTopPage, isUsersProtectedPages } from '@growi/core/dist/utils/page-path-utils';
 import { LoadingSpinner } from '@growi/ui/dist/components';
+import { useAtomValue } from 'jotai';
 import { useTranslation } from 'next-i18next';
 import {
   UncontrolledButtonDropdown, Button,
@@ -16,8 +17,8 @@ import {
 import { useIsEditable } from '~/states/context';
 import { useCurrentPageData, useCurrentPagePath } from '~/states/page';
 import {
-  useIsAclEnabled,
-  useIsSlackConfigured,
+  isAclEnabledAtom,
+  isSlackConfiguredAtom,
 } from '~/states/server-configurations';
 import { useEditorMode } from '~/states/ui/editor';
 import { useWaitingSaveProcessing, useSWRxSlackChannels, useIsSlackEnabled } from '~/stores/editor';
@@ -146,13 +147,13 @@ const SavePageButton = (props: {slackChannels: string, isSlackEnabled?: boolean,
 
 export const SavePageControls = (): JSX.Element | null => {
   const { t } = useTranslation('commons');
-  const [currentPage] = useCurrentPageData();
-  const [isEditable] = useIsEditable();
-  const [isAclEnabled] = useIsAclEnabled();
+  const currentPage = useCurrentPageData();
+  const isEditable = useIsEditable();
+  const isAclEnabled = useAtomValue(isAclEnabledAtom);
 
   const { editorMode } = useEditorMode();
-  const [currentPagePath] = useCurrentPagePath();
-  const [isSlackConfigured] = useIsSlackConfigured();
+  const currentPagePath = useCurrentPagePath();
+  const isSlackConfigured = useAtomValue(isSlackConfiguredAtom);
   const { data: isSlackEnabled, mutate: mutateIsSlackEnabled } = useIsSlackEnabled();
   const { data: slackChannelsData } = useSWRxSlackChannels(currentPagePath);
   const { data: isDeviceLargerThanMd } = useIsDeviceLargerThanMd();

apps/app/src/client/components/Sidebar/SidebarContents.tsx

@@ -4,7 +4,8 @@ import { AiAssistant } from '~/features/openai/client/components/AiAssistant/Sid
 import { SidebarContentsType } from '~/interfaces/ui';
 import { useIsGuestUser } from '~/states/context';
 import { useSidebarMode, useCollapsedContentsOpened, useCurrentSidebarContents } from '~/states/ui/sidebar';
-import { useIsAiEnabled } from '~/states/server-configurations';
+import { useAtomValue } from 'jotai';
+import { aiEnabledAtom } from '~/states/server-configurations';
 
 import { Bookmarks } from './Bookmarks';
 import { CustomSidebar } from './Custom';
@@ -18,8 +19,8 @@ import styles from './SidebarContents.module.scss';
 
 export const SidebarContents = memo(() => {
   const { isCollapsedMode } = useSidebarMode();
-  const [isGuestUser] = useIsGuestUser();
-  const [isAiEnabled] = useIsAiEnabled();
+  const isGuestUser = useIsGuestUser();
+  const isAiEnabled = useAtomValue(aiEnabledAtom);
 
   const [isCollapsedContentsOpened] = useCollapsedContentsOpened();
   const [currentSidebarContents] = useCurrentSidebarContents();

apps/app/src/client/components/Sidebar/SidebarNav/PrimaryItems.tsx

@@ -1,11 +1,12 @@
 import { memo } from 'react';
 
+import { useAtomValue } from 'jotai';
 import dynamic from 'next/dynamic';
 
 import { SidebarContentsType } from '~/interfaces/ui';
 import { useIsGuestUser } from '~/states/context';
+import { aiEnabledAtom } from '~/states/server-configurations';
 import { useSidebarMode } from '~/states/ui/sidebar';
-import { useIsAiEnabled } from '~/states/server-configurations';
 
 import { PrimaryItem } from './PrimaryItem';
 
@@ -25,8 +26,8 @@ export const PrimaryItems = memo((props: Props) => {
   const { onItemHover } = props;
 
   const { sidebarMode } = useSidebarMode();
-  const [isAiEnabled] = useIsAiEnabled();
-  const [isGuestUser] = useIsGuestUser();
+  const isAiEnabled = useAtomValue(aiEnabledAtom);
+  const isGuestUser = useIsGuestUser();
 
   if (sidebarMode == null) {
     return <></>;

apps/app/src/features/openai/client/components/AiAssistant/OpenDefaultAiAssistantButton.tsx

@@ -1,10 +1,11 @@
 import React, { useCallback, useMemo, type JSX } from 'react';
 
+import { useAtomValue } from 'jotai';
 import { useTranslation } from 'react-i18next';
 
 import { NotAvailable } from '~/client/components/NotAvailable';
 import { NotAvailableForGuest } from '~/client/components/NotAvailableForGuest';
-import { useIsAiEnabled } from '~/states/server-configurations';
+import { aiEnabledAtom } from '~/states/server-configurations';
 
 import { useAiAssistantSidebar, useSWRxAiAssistants } from '../../stores/ai-assistant';
 
@@ -48,7 +49,7 @@ const OpenDefaultAiAssistantButtonSubstance = (): JSX.Element => {
 };
 
 const OpenDefaultAiAssistantButton = (): JSX.Element => {
-  const [isAiEnabled] = useIsAiEnabled();
+  const isAiEnabled = useAtomValue(aiEnabledAtom);
 
   if (!isAiEnabled) {
     return <></>;

apps/app/src/features/page-bulk-export/client/components/PageBulkExportSelectModal.tsx

@@ -1,20 +1,20 @@
 import { format } from 'date-fns/format';
+import { useAtomValue } from 'jotai';
 import { useTranslation } from 'next-i18next';
 import { type JSX, useState } from 'react';
 import { Modal, ModalBody, ModalHeader } from 'reactstrap';
-
 import { apiv3Post } from '~/client/util/apiv3-client';
 import { toastError, toastSuccess } from '~/client/util/toastr';
 import { usePageBulkExportSelectModal } from '~/features/page-bulk-export/client/stores/modal';
 import { PageBulkExportFormat } from '~/features/page-bulk-export/interfaces/page-bulk-export';
 import { useCurrentPagePath } from '~/states/page';
-import { useIsPdfBulkExportEnabled } from '~/states/server-configurations';
+import { isPdfBulkExportEnabledAtom } from '~/states/server-configurations';
 
 const PageBulkExportSelectModal = (): JSX.Element => {
   const { t } = useTranslation();
   const { data: status, close } = usePageBulkExportSelectModal();
-  const [currentPagePath] = useCurrentPagePath();
-  const [isPdfBulkExportEnabled] = useIsPdfBulkExportEnabled();
+  const currentPagePath = useCurrentPagePath();
+  const isPdfBulkExportEnabled = useAtomValue(isPdfBulkExportEnabledAtom);
 
   const [isRestartModalOpened, setIsRestartModalOpened] = useState(false);
   const [formatMemoForRestart, setFormatMemoForRestart] = useState<