modularize imports for reactstrap

apps/app/src/components/Admin/AdminHome/AdminHome.jsx

@@ -3,7 +3,7 @@ import React, { useEffect, useCallback } from 'react';
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
-import { Tooltip } from 'reactstrap';
+import Tooltip from 'reactstrap/es/Tooltip';
 
 import AdminHomeContainer from '~/client/services/AdminHomeContainer';
 import { toastError } from '~/client/util/toastr';

apps/app/src/components/Admin/App/ConfirmModal.tsx

@@ -1,9 +1,10 @@
 import React, { FC } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 type ConfirmModalProps = {
   isModalOpen: boolean

apps/app/src/components/Admin/AuditLog/ActivityTable.tsx

@@ -5,7 +5,7 @@ import { UserPicture } from '@growi/ui/dist/components/User/UserPicture';
 import { format } from 'date-fns';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { useTranslation } from 'react-i18next';
-import { Tooltip } from 'reactstrap';
+import Tooltip from 'reactstrap/es/Tooltip';
 
 import { IActivityHasId } from '~/interfaces/activity';
 

apps/app/src/components/Admin/AuditLog/AuditLogSettings.tsx

@@ -1,7 +1,7 @@
 import React, { FC, useState } from 'react';
 
 import { useTranslation } from 'react-i18next';
-import { Collapse } from 'reactstrap';
+import Collapse from 'reactstrap/es/Collapse';
 
 import { AllSupportedActions } from '~/interfaces/activity';
 import { useActivityExpirationSeconds, useAuditLogAvailableActions } from '~/stores/context';

apps/app/src/components/Admin/Common/Accordion.jsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
-import { Collapse } from 'reactstrap';
+
 import PropTypes from 'prop-types';
+import Collapse from 'reactstrap/es/Collapse';
 
 const Accordion = (props) => {
   const [isOpen, setIsOpen] = useState(props.isOpenDefault);

apps/app/src/components/Admin/Common/LabeledProgressBar.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { Progress } from 'reactstrap';
+import Progress from 'reactstrap/es/Progress';
 
 type Props = {
   header: string,

apps/app/src/components/Admin/ExportArchiveData/SelectCollectionsModal.tsx

@@ -1,9 +1,10 @@
 import React, { useCallback, useState, useEffect } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 import * as toastr from 'toastr';
 
 import { apiPost } from '~/client/util/apiv1-client';

apps/app/src/components/Admin/ImportData/GrowiArchive/ErrorViewer.tsx

@@ -1,6 +1,9 @@
 import React from 'react';
 
-import { Modal, ModalHeader, ModalBody } from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 type ErrorViewerProps = {
   isOpen: boolean,

apps/app/src/components/Admin/ImportData/GrowiArchive/ImportCollectionConfigurationModal.jsx

@@ -4,12 +4,10 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import GrowiArchiveImportOption from '~/models/admin/growi-archive-import-option';
 

apps/app/src/components/Admin/ImportData/GrowiArchive/ImportCollectionItem.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import PropTypes from 'prop-types';
-import { Progress } from 'reactstrap';
+import Progress from 'reactstrap/es/Progress';
 
 import GrowiArchiveImportOption from '~/models/admin/growi-archive-import-option';
 

apps/app/src/components/Admin/Notification/NotificationDeleteModal.jsx

@@ -2,9 +2,10 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 class NotificationDeleteModal extends React.PureComponent {
 

apps/app/src/components/Admin/Notification/NotificationTypeIcon.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import type { INotificationType } from '~/client/interfaces/notification';
 

apps/app/src/components/Admin/PluginsExtension/PluginsExtensionPageContents.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { useTranslation } from 'next-i18next';
-import { Spinner } from 'reactstrap';
+import Spinner from 'reactstrap/es/Spinner';
 
 import { useSWRxPlugins } from '~/stores/plugin';
 

apps/app/src/components/Admin/Security/DeleteAllShareLinksModal.jsx

@@ -2,9 +2,11 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Button, Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Button from 'reactstrap/es/Button';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 const DeleteAllShareLinksModal = React.memo((props) => {
   const { t } = props;

apps/app/src/components/Admin/Security/LdapAuthTestModal.jsx

@@ -1,11 +1,9 @@
 import React from 'react';
 
 import PropTypes from 'prop-types';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { withUnstatedContainers } from '../../UnstatedUtils';
 

apps/app/src/components/Admin/Security/SamlSecuritySettingContents.jsx

@@ -4,7 +4,7 @@ import React from 'react';
 import { pathUtils } from '@growi/core';
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import { Collapse } from 'reactstrap';
+import Collapse from 'reactstrap/es/Collapse';
 import urljoin from 'url-join';
 
 

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

@@ -3,7 +3,7 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import { Collapse } from 'reactstrap';
+import Collapse from 'reactstrap/es/Collapse';
 
 import AdminGeneralSecurityContainer from '~/client/services/AdminGeneralSecurityContainer';
 import { toastSuccess, toastError } from '~/client/util/toastr';

apps/app/src/components/Admin/SlackIntegration/Bridge.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 const ProxyCircle = () => (
   <div className="grw-bridge-proxy-circle">

apps/app/src/components/Admin/SlackIntegration/ConfirmBotChangeModal.jsx

@@ -2,9 +2,10 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 const ConfirmBotChangeModal = (props) => {
   const { t } = useTranslation('admin');

apps/app/src/components/Admin/SlackIntegration/WithProxyAccordions.jsx

@@ -5,7 +5,7 @@ import { SlackbotType } from '@growi/slack';
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
-import { Tooltip } from 'reactstrap';
+import Tooltip from 'reactstrap/es/Tooltip';
 
 import { apiv3Put, apiv3Post } from '~/client/util/apiv3-client';
 import { toastSuccess, toastError } from '~/client/util/toastr';

apps/app/src/components/Admin/UserGroup/UserGroupDeleteModal.tsx

@@ -3,9 +3,10 @@ import React, {
 } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { IUserGroupHasId } from '~/interfaces/user';
 

apps/app/src/components/Admin/UserGroup/UserGroupModal.tsx

@@ -4,9 +4,10 @@ import React, {
 
 import { Ref } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { IUserGroup, IUserGroupHasId } from '~/interfaces/user';
 

apps/app/src/components/Admin/UserGroupDetail/UpdateParentConfirmModal.tsx

@@ -1,9 +1,10 @@
 import React, { FC, useState } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { useUpdateUserGroupConfirmModal } from '~/stores/modal';
 

apps/app/src/components/Admin/UserGroupDetail/UserGroupUserModal.tsx

@@ -1,9 +1,10 @@
 import React from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { IUserGroupHasId } from '~/interfaces/user';
 import { SearchTypes, SearchType } from '~/interfaces/user-group';

apps/app/src/components/Admin/Users/PasswordResetModal.jsx

@@ -2,9 +2,10 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiv3Put } from '~/client/util/apiv3-client';
 import { toastError } from '~/client/util/toastr';

apps/app/src/components/Admin/Users/UserInviteModal.jsx

@@ -3,10 +3,10 @@ import React from 'react';
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
 import { CopyToClipboard } from 'react-copy-to-clipboard';
-// import Button from 'react-bootstrap/es/Button';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 
 import AdminUsersContainer from '~/client/services/AdminUsersContainer';

apps/app/src/components/ArchiveCreateModal.jsx

@@ -2,9 +2,10 @@ import React, { useState, useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiv3Post } from '~/client/util/apiv3-client';
 import { toastSuccess, toastError } from '~/client/util/toastr';

apps/app/src/components/BookmarkButtons.tsx

@@ -1,7 +1,9 @@
 import React, { FC, useState, useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import { UncontrolledTooltip, Popover, PopoverBody } from 'reactstrap';
+import Popover from 'reactstrap/es/Popover';
+import PopoverBody from 'reactstrap/es/PopoverBody';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import { useIsGuestUser } from '~/stores/context';
 

apps/app/src/components/Common/CustomCopyToClipBoard.tsx

@@ -2,7 +2,7 @@ import React, { FC, useState, useCallback } from 'react';
 
 import { CopyToClipboard } from 'react-copy-to-clipboard';
 import { useTranslation } from 'react-i18next';
-import { Tooltip } from 'reactstrap';
+import Tooltip from 'reactstrap/es/Tooltip';
 
 type Props = {
   message: string

apps/app/src/components/Common/ImageCropModal.tsx

@@ -5,12 +5,10 @@ import React, {
 import canvasToBlob from 'async-canvas-to-blob';
 import { useTranslation } from 'react-i18next';
 import ReactCrop from 'react-image-crop';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 
 import { toastError } from '~/client/util/toastr';

apps/app/src/components/CreateTemplateModal.jsx

@@ -3,7 +3,9 @@ import React from 'react';
 import { pathUtils } from '@growi/core';
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import { Modal, ModalHeader, ModalBody } from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 import urljoin from 'url-join';
 
 const CreateTemplateModal = (props) => {

apps/app/src/components/DescendantsPageListModal.tsx

@@ -4,9 +4,9 @@ import React, { useState, useMemo, useEffect } from 'react';
 import { useTranslation } from 'next-i18next';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import {
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { useIsSharedUser } from '~/stores/context';
 import { useDescendantsPageListModal } from '~/stores/modal';

apps/app/src/components/EmptyTrashModal.tsx

@@ -3,9 +3,10 @@ import React, {
 } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiv3Delete } from '~/client/util/apiv3-client';
 import { useEmptyTrashModal } from '~/stores/modal';

apps/app/src/components/FormattedDistanceDate.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import { format, formatDistanceStrict, differenceInSeconds } from 'date-fns';
 import PropTypes from 'prop-types';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 const FormattedDistanceDate = (props) => {
 

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

@@ -4,7 +4,7 @@ import React, {
 
 import { HasObjectId } from '@growi/core';
 import { UserPicture } from '@growi/ui/dist/components/User/UserPicture';
-import { DropdownItem } from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
 
 import { IInAppNotificationOpenable } from '~/client/interfaces/in-app-notification-openable';
 import { apiv3Post } from '~/client/util/apiv3-client';

apps/app/src/components/LikeButtons.tsx

@@ -1,7 +1,9 @@
 import React, { FC, useState, useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import { UncontrolledTooltip, Popover, PopoverBody } from 'reactstrap';
+import Popover from 'reactstrap/es/Popover';
+import PopoverBody from 'reactstrap/es/PopoverBody';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import { IUser } from '../interfaces/user';
 

apps/app/src/components/Me/AssociateModal.tsx

@@ -1,16 +1,14 @@
 import React, { useState, useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-  Nav,
-  NavLink,
-  TabContent,
-  TabPane,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+import Nav from 'reactstrap/es/Nav';
+import NavLink from 'reactstrap/es/NavLink';
+import TabContent from 'reactstrap/es/TabContent';
+import TabPane from 'reactstrap/es/TabPane';
 
 import { toastSuccess, toastError } from '~/client/util/toastr';
 import { usePersonalSettings, useSWRxPersonalExternalAccounts } from '~/stores/personal-settings';

apps/app/src/components/Me/DisassociateModal.tsx

@@ -1,12 +1,10 @@
 import React, { useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { toastSuccess, toastError } from '~/client/util/toastr';
 import { IExternalAccount } from '~/interfaces/external-account';

apps/app/src/components/Navbar/AppearanceModeDropdown.tsx

@@ -4,7 +4,7 @@ import React, {
 
 import { useTranslation } from 'next-i18next';
 import { useRipple } from 'react-use-ripple';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import { useUserUISettings } from '~/client/services/user-ui-settings';
 import { usePreferDrawerModeByUser, usePreferDrawerModeOnEditByUser } from '~/stores/ui';

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

@@ -6,7 +6,7 @@ import {
 import { useTranslation } from 'next-i18next';
 import dynamic from 'next/dynamic';
 import { useRouter } from 'next/router';
-import { DropdownItem } from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
 
 import { exportAsMarkdown, updateContentWidth, useUpdateStateAfterSave } from '~/client/services/page-operation';
 import { apiPost } from '~/client/util/apiv1-client';

apps/app/src/components/Navbar/GrowiNavbar.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from 'next-i18next';
 import dynamic from 'next/dynamic';
 import Link from 'next/link';
 import { useRipple } from 'react-use-ripple';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import {
   useIsSearchPage, useIsGuestUser, useIsSearchServiceConfigured, useAppTitle, useConfidential, useIsDefaultLogo,

apps/app/src/components/Navbar/PageEditorModeManager.jsx

@@ -2,7 +2,7 @@ import React, { useCallback } from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import { useCurrentUser, useHackmdUri } from '~/stores/context';
 import { EditorMode, useIsDeviceSmallerThanMd } from '~/stores/ui';

apps/app/src/components/Navbar/SubNavButtons.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useMemo } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import { DropdownItem } from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
 
 import {
   toggleBookmark, toggleLike, toggleSubscribe,

apps/app/src/components/NotAvailable.tsx

@@ -1,7 +1,8 @@
 import React from 'react';
 
 import { Disable } from 'react-disable';
-import { UncontrolledTooltip, UncontrolledTooltipProps } from 'reactstrap';
+import type { UncontrolledTooltipProps } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 type NotAvailableProps = {
   children: JSX.Element

apps/app/src/components/Page/TagEditModal.jsx

@@ -2,9 +2,10 @@ import React, { useState, useEffect } from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import TagsInput from './TagsInput';
 

apps/app/src/components/PageAccessoriesModal.tsx

@@ -1,9 +1,9 @@
 import React, { useEffect, useMemo, useState } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalBody, ModalHeader,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import {
   useDisableLinkSharing, useIsGuestUser, useIsSharedUser,

apps/app/src/components/PageAlert/FixPageGrantAlert.tsx

@@ -1,9 +1,10 @@
 import React, { useEffect, useState, useCallback } from 'react';
 
 import { useTranslation } from 'react-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiv3Put } from '~/client/util/apiv3-client';
 import { toastError, toastSuccess } from '~/client/util/toastr';

apps/app/src/components/PageAttachment/DeleteAttachmentModal.tsx

@@ -3,10 +3,11 @@ import React, { useCallback } from 'react';
 
 import { HasObjectId, IAttachment } from '@growi/core';
 import { UserPicture } from '@growi/ui/dist/components/User/UserPicture';
-import {
-  Button,
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Button from 'reactstrap/es/Button';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { Username } from '../User/Username';
 

apps/app/src/components/PageComment.tsx

@@ -4,7 +4,7 @@ import React, {
 
 import { isPopulated, getIdForRef } from '@growi/core/dist/interfaces/common';
 import { type IRevisionHasId } from '@growi/core/dist/interfaces/revision';
-import { Button } from 'reactstrap';
+import Button from 'reactstrap/es/Button';
 
 import { apiPost } from '~/client/util/apiv1-client';
 import { toastError } from '~/client/util/toastr';

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

@@ -6,7 +6,7 @@ import { UserPicture } from '@growi/ui/dist/components/User/UserPicture';
 import { format, parseISO } from 'date-fns';
 import { useTranslation } from 'next-i18next';
 import Link from 'next/link';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 import urljoin from 'url-join';
 
 import type { RendererOptions } from '~/interfaces/renderer-options';

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

@@ -2,9 +2,12 @@ import React from 'react';
 
 import { UserPicture } from '@growi/ui/dist/components/User/UserPicture';
 import { format } from 'date-fns';
-import {
-  Button, Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Button from 'reactstrap/es/Button';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+
 
 import { ICommentHasId } from '../../interfaces/comment';
 import { Username } from '../User/Username';

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

@@ -2,7 +2,7 @@
 import React, { useState } from 'react';
 
 import type { IUser } from '@growi/core';
-import { Collapse } from 'reactstrap';
+import Collapse from 'reactstrap/es/Collapse';
 
 import type { RendererOptions } from '~/interfaces/renderer-options';
 

apps/app/src/components/PageCreateModal.jsx

@@ -6,9 +6,13 @@ import { pagePathUtils, pathUtils } from '@growi/core';
 import { format } from 'date-fns';
 import { useTranslation } from 'next-i18next';
 import { useRouter } from 'next/router';
-import {
-  Modal, ModalHeader, ModalBody, UncontrolledButtonDropdown, DropdownToggle, DropdownMenu, DropdownItem,
-} from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
+import DropdownMenu from 'reactstrap/es/DropdownMenu';
+import DropdownToggle from 'reactstrap/es/DropdownToggle';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+import UncontrolledButtonDropdown from 'reactstrap/es/UncontrolledButtonDropdown';
 import { debounce } from 'throttle-debounce';
 
 import { toastError } from '~/client/util/toastr';

apps/app/src/components/PageDeleteModal.tsx

@@ -4,9 +4,10 @@ import React, {
 
 import { HasObjectId, pagePathUtils } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiPost } from '~/client/util/apiv1-client';
 import { apiv3Post } from '~/client/util/apiv3-client';

apps/app/src/components/PageDuplicateModal.tsx

@@ -3,9 +3,10 @@ import React, {
 } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 import { debounce } from 'throttle-debounce';
 
 import { apiv3Get, apiv3Post } from '~/client/util/apiv3-client';

apps/app/src/components/PageEditor/CodeMirrorEditor.jsx

@@ -3,7 +3,7 @@ import React, { useCallback, memo } from 'react';
 import { commands } from 'codemirror';
 import * as loadCssSync from 'load-css-file';
 import PropTypes from 'prop-types';
-import { Button } from 'reactstrap';
+import Button from 'reactstrap/es/Button';
 import * as loadScript from 'simple-load-script';
 import { throttle, debounce } from 'throttle-debounce';
 import urljoin from 'url-join';

apps/app/src/components/PageEditor/DrawioModal.tsx

@@ -4,10 +4,8 @@ import React, {
   useMemo,
 } from 'react';
 
-import {
-  Modal,
-  ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
 
 import { getDiagramsNetLangCode } from '~/client/util/locale-utils';
 import { useRendererConfig } from '~/stores/context';

apps/app/src/components/PageEditor/Editor.tsx

@@ -6,9 +6,9 @@ import React, {
 
 import Dropzone from 'react-dropzone';
 import { useTranslation } from 'react-i18next';
-import {
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { toastError, toastSuccess } from '~/client/util/toastr';
 import { IEditorSettings } from '~/interfaces/editor-settings';

apps/app/src/components/PageEditor/EmojiPicker.tsx

@@ -1,7 +1,7 @@
 import React, { FC, useCallback } from 'react';
 
 import { Picker } from 'emoji-mart';
-import { Modal } from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
 
 import { useNextThemes } from '~/stores/use-next-themes';
 

apps/app/src/components/PageEditor/GridEditModal.jsx

@@ -2,9 +2,10 @@ import React from 'react';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import BootstrapGrid from '~/client/models/BootstrapGrid';
 

apps/app/src/components/PageEditor/LinkEditModal.jsx

@@ -4,14 +4,12 @@ import path from 'path';
 
 import { useTranslation } from 'next-i18next';
 import PropTypes from 'prop-types';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-  Popover,
-  PopoverBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+import Popover from 'reactstrap/es/Popover';
+import PopoverBody from 'reactstrap/es/PopoverBody';
 import validator from 'validator';
 
 

apps/app/src/components/PageEditor/TextAreaEditor.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 // import PropTypes from 'prop-types';
 
-import { Input } from 'reactstrap';
+import Input from 'reactstrap/es/Input';
 
 import InterceptorManager from '~/services/interceptor-manager';
 import loggerFactory from '~/utils/logger';

apps/app/src/components/PageList/PageListItemL.tsx

@@ -11,7 +11,7 @@ import { format } from 'date-fns';
 import { useTranslation } from 'next-i18next';
 import Link from 'next/link';
 import Clamp from 'react-multiline-clamp';
-import { CustomInput } from 'reactstrap';
+import CustomInput from 'reactstrap/es/CustomInput';
 
 import { ISelectable } from '~/client/interfaces/selectable-all';
 import { unlink, bookmark, unbookmark } from '~/client/services/page-operation';

apps/app/src/components/PagePresentationModal.tsx

@@ -4,9 +4,8 @@ import type { PresentationProps } from '@growi/presentation';
 import { useFullScreen } from '@growi/ui/dist/utils';
 import dynamic from 'next/dynamic';
 import type { ReactMarkdownOptions } from 'react-markdown/lib/react-markdown';
-import {
-  Modal, ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
 
 import { usePagePresentationModal } from '~/stores/modal';
 import { useSWRxCurrentPage } from '~/stores/page';

apps/app/src/components/PageRenameModal.tsx

@@ -4,9 +4,11 @@ import React, {
 
 import { pagePathUtils } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import {
-  Collapse, Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Collapse from 'reactstrap/es/Collapse';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 import { debounce } from 'throttle-debounce';
 
 import { apiv3Get, apiv3Put } from '~/client/util/apiv3-client';

apps/app/src/components/PaginationWrapper.tsx

@@ -2,7 +2,9 @@ import React, {
   FC, memo, useCallback, useMemo,
 } from 'react';
 
-import { Pagination, PaginationItem, PaginationLink } from 'reactstrap';
+import Pagination from 'reactstrap/es/Pagination';
+import PaginationItem from 'reactstrap/es/PaginationItem';
+import PaginationLink from 'reactstrap/es/PaginationLink';
 
 
 type Props = {

apps/app/src/components/PrivateLegacyPages.tsx

@@ -3,9 +3,14 @@ import React, {
 } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  UncontrolledButtonDropdown, DropdownToggle, DropdownMenu, DropdownItem, Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
+import DropdownMenu from 'reactstrap/es/DropdownMenu';
+import DropdownToggle from 'reactstrap/es/DropdownToggle';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+import UncontrolledButtonDropdown from 'reactstrap/es/UncontrolledButtonDropdown';
 
 import { ISelectableAll, ISelectableAndIndeterminatable } from '~/client/interfaces/selectable-all';
 import { apiv3Post } from '~/client/util/apiv3-client';

apps/app/src/components/PrivateLegacyPagesMigrationModal.tsx

@@ -1,9 +1,10 @@
 import React, { useState } from 'react';
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiv3Post } from '~/client/util/apiv3-client';
 import { usePrivateLegacyPagesMigrationModal } from '~/stores/modal';

apps/app/src/components/PutbackPageModal.jsx

@@ -2,9 +2,10 @@ import React, { useState, useCallback } from 'react';
 
 
 import { useTranslation } from 'next-i18next';
-import {
-  Modal, ModalHeader, ModalBody, ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { apiPost } from '~/client/util/apiv1-client';
 import { usePutBackPageModal } from '~/stores/modal';

apps/app/src/components/SavePageControls/GrantSelector.tsx

@@ -2,12 +2,13 @@ import React, { useCallback, useState } from 'react';
 
 import { isPopulated } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import {
-  UncontrolledDropdown,
-  DropdownToggle, DropdownMenu, DropdownItem,
-
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
+import DropdownMenu from 'reactstrap/es/DropdownMenu';
+import DropdownToggle from 'reactstrap/es/DropdownToggle';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
+import UncontrolledDropdown from 'reactstrap/es/UncontrolledDropdown';
 
 import { IPageGrantData } from '~/interfaces/page';
 import { IUserGroupHasId } from '~/interfaces/user';

apps/app/src/components/SearchPage/OperateAllControl.tsx

@@ -1,7 +1,9 @@
 import React, {
   ChangeEvent, forwardRef, ForwardRefRenderFunction, useImperativeHandle, useRef,
 } from 'react';
-import { CustomInput } from 'reactstrap';
+
+import CustomInput from 'reactstrap/es/CustomInput';
+
 import { ISelectableAndIndeterminatable } from '~/client/interfaces/selectable-all';
 import { IndeterminateInputElement } from '~/interfaces/indeterminate-input-elm';
 

apps/app/src/components/SearchPage/SearchOptionModal.tsx

@@ -1,9 +1,9 @@
 import React, { FC } from 'react';
-import { useTranslation } from 'next-i18next';
 
-import {
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
+import { useTranslation } from 'next-i18next';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 
 type Props = {

apps/app/src/components/SearchPage/SearchResultContent.tsx

@@ -6,7 +6,7 @@ import { getIdForRef } from '@growi/core';
 import { useTranslation } from 'next-i18next';
 import dynamic from 'next/dynamic';
 import { animateScroll } from 'react-scroll';
-import { DropdownItem } from 'reactstrap';
+import DropdownItem from 'reactstrap/es/DropdownItem';
 
 
 import { exportAsMarkdown, updateContentWidth } from '~/client/services/page-operation';

apps/app/src/components/ShortcutsModal.tsx

@@ -1,7 +1,9 @@
 import React from 'react';
 
 import { useTranslation } from 'next-i18next';
-import { Modal, ModalHeader, ModalBody } from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import KeyboardReturnEnterIcon from '~/components/Icons/KeyboardReturnEnterIcon';
 import { useShortcutsModal } from '~/stores/modal';

apps/app/src/components/StaffCredit/StaffCredit.tsx

@@ -1,9 +1,8 @@
 import React, { useCallback, useState } from 'react';
 
 import { animateScroll } from 'react-scroll';
-import {
-  Modal, ModalBody,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
 
 import { useSWRxStaffs } from '~/stores/staff';
 import loggerFactory from '~/utils/logger';

apps/app/src/components/SubscribeButton.tsx

@@ -2,7 +2,7 @@ import React, { FC, useCallback } from 'react';
 
 import { SubscriptionStatusType } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import { UncontrolledTooltip } from 'reactstrap';
+import UncontrolledTooltip from 'reactstrap/es/UncontrolledTooltip';
 
 import styles from './SubscribeButton.module.scss';
 

apps/app/src/components/TemplateModal.tsx

@@ -2,12 +2,10 @@ import React, { useCallback, useState } from 'react';
 
 import { ITemplate } from '@growi/core';
 import { useTranslation } from 'next-i18next';
-import {
-  Modal,
-  ModalHeader,
-  ModalBody,
-  ModalFooter,
-} from 'reactstrap';
+import Modal from 'reactstrap/es/Modal';
+import ModalBody from 'reactstrap/es/ModalBody';
+import ModalFooter from 'reactstrap/es/ModalFooter';
+import ModalHeader from 'reactstrap/es/ModalHeader';
 
 import { useTemplateModal } from '~/stores/modal';
 import { usePreviewOptions } from '~/stores/renderer';