Merge pull request #3890 from weseek/imprv/commonalize-MessageBasedOnConnection

Imprv/commonalize message based on connection

src/client/js/components/Admin/SlackIntegration/CustomBotWithoutProxySettingsAccordion.jsx

@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
 import Accordion from '../Common/Accordion';
 import AppContainer from '../../../services/AppContainer';
 import { withUnstatedContainers } from '../../UnstatedUtils';
+import MessageBasedOnConnection from './MessageBasedOnConnection';
 import CustomBotWithoutProxySecretTokenSection from './CustomBotWithoutProxySecretTokenSection';
 import { addLogs } from './slak-integration-util';
 
@@ -15,25 +16,6 @@ export const botInstallationStep = {
   CONNECTION_TEST: 'connection-test',
 };
 
-const MessageBasedOnConnection = (props) => {
-  const { isLatestConnectionSuccess, logsValue } = props;
-  const { t } = useTranslation();
-  if (isLatestConnectionSuccess) {
-    return <p className="text-info text-center my-4">{t('admin:slack_integration.accordion.send_message_to_slack_work_space')}</p>;
-  }
-
-  if (logsValue === '') {
-    return <p></p>;
-  }
-
-  return <p className="text-danger text-center my-4">{t('admin:slack_integration.accordion.error_check_logs_below')}</p>;
-};
-
-MessageBasedOnConnection.propTypes = {
-  isLatestConnectionSuccess: PropTypes.bool.isRequired,
-  logsValue: PropTypes.string.isRequired,
-};
-
 
 const CustomBotWithoutProxySettingsAccordion = (props) => {
   const {

src/client/js/components/Admin/SlackIntegration/MessageBasedOnConnection.jsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useTranslation } from 'react-i18next';
+
+
+const MessageBasedOnConnection = (props) => {
+  const { isLatestConnectionSuccess, logsValue } = props;
+  const { t } = useTranslation();
+
+  if (isLatestConnectionSuccess) {
+    return <p className="text-info text-center my-4">{t('admin:slack_integration.accordion.send_message_to_slack_work_space')}</p>;
+  }
+
+  if (logsValue === '') {
+    return <p></p>;
+  }
+
+  return <p className="text-danger text-center my-4">{t('admin:slack_integration.accordion.error_check_logs_below')}</p>;
+};
+
+MessageBasedOnConnection.propTypes = {
+  isLatestConnectionSuccess: PropTypes.bool.isRequired,
+  logsValue: PropTypes.string.isRequired,
+};
+
+export default MessageBasedOnConnection;

src/client/js/components/Admin/SlackIntegration/WithProxyAccordions.jsx

@@ -10,6 +10,7 @@ import { toastSuccess, toastError } from '../../../util/apiNotification';
 import AppContainer from '../../../services/AppContainer';
 import Accordion from '../Common/Accordion';
 import { addLogs } from './slak-integration-util';
+import MessageBasedOnConnection from './MessageBasedOnConnection';
 
 const logger = loggerFactory('growi:SlackIntegration:WithProxyAccordionsWrapper');
 
@@ -244,19 +245,6 @@ const TestProcess = ({ apiv3Post, slackAppIntegrationId }) => {
   );
 };
 
-const MessageBasedOnConnection = (props) => {
-  const { isLatestConnectionSuccess, logsValue } = props;
-  const { t } = useTranslation();
-  if (isLatestConnectionSuccess) {
-    return <p className="text-info text-center my-4">{t('admin:slack_integration.accordion.send_message_to_slack_work_space')}</p>;
-  }
-
-  if (logsValue === '') {
-    return <p></p>;
-  }
-
-  return <p className="text-danger text-center my-4">{t('admin:slack_integration.accordion.error_check_logs_below')}</p>;
-};
 
 const WithProxyAccordions = (props) => {
   const { t } = useTranslation();