add numbering and connectionStatuses

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

@@ -12,7 +12,9 @@ import DeleteSlackBotSettingsModal from './DeleteSlackBotSettingsModal';
 const logger = loggerFactory('growi:SlackBotSettings');
 
 const CustomBotWithProxySettings = (props) => {
-  const { appContainer, slackAppIntegrations, proxyServerUri } = props;
+  const {
+    appContainer, slackAppIntegrations, proxyServerUri, connectionStatuses,
+  } = props;
   const [newProxyServerUri, setNewProxyServerUri] = useState();
   const [integrationIdToDelete, setIntegrationIdToDelete] = useState(null);
   const { t } = useTranslation();
@@ -110,7 +112,7 @@ const CustomBotWithProxySettings = (props) => {
 
       <h2 className="admin-setting-header">{t('admin:slack_integration.integration_procedure')}</h2>
       <div className="mx-3">
-        {slackAppIntegrations.map((slackAppIntegration) => {
+        {slackAppIntegrations.map((slackAppIntegration, i) => {
           const { tokenGtoP, tokenPtoG } = slackAppIntegration;
           return (
             <React.Fragment key={slackAppIntegration._id}>
@@ -124,6 +126,7 @@ const CustomBotWithProxySettings = (props) => {
                   {t('admin:slack_integration.delete')}
                 </button>
               </div>
+              <div>No.{i + 1}</div>
               <WithProxyAccordions
                 botType="customBotWithProxy"
                 slackAppIntegrationId={slackAppIntegration._id}

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

@@ -28,6 +28,7 @@ const SlackIntegration = (props) => {
   const [isDeleteConfirmModalShown, setIsDeleteConfirmModalShown] = useState(false);
   const [slackAppIntegrations, setSlackAppIntegrations] = useState();
   const [proxyServerUri, setProxyServerUri] = useState();
+  const [connectionStatuses, setConnectionStatuses] = useState(null);
 
 
   const fetchSlackIntegrationData = useCallback(async() => {
@@ -41,6 +42,8 @@ const SlackIntegration = (props) => {
         // TODO fix
         // const { workspaceName } = data.connectionStatuses[slackBotToken];
         // setSlackWSNameInWithoutProxy(workspaceName);
+        setConnectionStatuses(data.connectionStatuses);
+
       }
 
       setCurrentBotType(data.currentBotType);
@@ -146,6 +149,7 @@ const SlackIntegration = (props) => {
           slackAppIntegrations={slackAppIntegrations}
           proxyServerUri={proxyServerUri}
           fetchSlackIntegrationData={fetchSlackIntegrationData}
+          connectionStatuses={connectionStatuses}
         />
       );
       break;