Added handlers on parent component

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

@@ -54,9 +54,21 @@ const CustomBotWithoutProxySecretTokenSection = (props) => {
   //   }
   // }
 
-  const updateHandler = () => {
-    if (props.updateHandler != null){
-      props.updateHandler();
+  const updateSecretTokenHandler = () => {
+    if (props.updateSecretTokenHandler != null){
+      props.updateSecretTokenHandler();
+    }
+  }
+
+  const onChangeSigningSecretHandler = (signingSecretInput) => {
+    if (props.onChangeSigningSecretHandler != null) {
+      props.onChangeSigningSecretHandler(signingSecretInput);
+    }
+  }
+
+  const onChangeBotTokenHandler = (botTokenInput) => {
+    if (props.onChangeBotTokenHandler != null) {
+      props.onChangeBotTokenHandler(botTokenInput);
     }
   }
 
@@ -79,7 +91,7 @@ const CustomBotWithoutProxySecretTokenSection = (props) => {
                 className="form-control"
                 type="text"
                 value={slackSigningSecret || ''}
-                onChange={e => setSlackSigningSecret(e.target.value)}
+                onChange={e => onChangeSigningSecretHandler(e.target.value)}
               />
             </td>
             <td>
@@ -101,15 +113,15 @@ const CustomBotWithoutProxySecretTokenSection = (props) => {
               <input
                 className="form-control"
                 type="text"
-                value={slackBotToken || ''}
-                onChange={e => setSlackBotToken(e.target.value)}
+                value={props.slackBotToken || ''}
+                onChange={e => onChangeBotTokenHandler(e.target.value)}
               />
             </td>
             <td>
               <input
                 className="form-control"
                 type="text"
-                value={slackBotTokenEnv || ''}
+                value={props.slackBotTokenEnv || ''}
                 readOnly
               />
               <p className="form-text text-muted">
@@ -121,7 +133,7 @@ const CustomBotWithoutProxySecretTokenSection = (props) => {
         </tbody>
       </table>
 
-      <AdminUpdateButtonRow onClick={updateHandler} disabled={false} />
+      <AdminUpdateButtonRow onClick={updateSecretTokenHandler} disabled={false} />
     </div>
   );
 };

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

@@ -51,7 +51,7 @@ const CustomBotWithoutProxySettingsAccordion = (props) => {
     setOpenAccordionIndexes(accordionIndexes);
   };
 
-  const updateHandler = async() => {
+  const updateSecretTokenHandler = async() => {
     try {
       await appContainer.apiv3.put('/slack-integration/custom-bot-without-proxy', {
         slackSigningSecret,
@@ -66,6 +66,15 @@ const CustomBotWithoutProxySettingsAccordion = (props) => {
     }
   }
 
+  const onChangeSigningSecretHandler = (signingSecretInput) => {
+    setSlackSigningSecret(signingSecretInput);
+
+  }
+
+  const onChangeBotTokenHandler = (botTokenInput) => {
+    setSlackBotToken(botTokenInput);
+  }
+
   const onTestConnectionHandler = async () => {
     setConnectionErrorCode(null);
     setConnectionErrorMessage(null);
@@ -167,7 +176,11 @@ const CustomBotWithoutProxySettingsAccordion = (props) => {
         </div>
         <Collapse isOpen={openAccordionIndexes.has(2)}>
           <CustomBotWithoutProxySecretTokenSection
-            updateHandler={updateHandler}
+            updateSecretTokenHandler={updateSecretTokenHandler}
+            onChangeSigningSecretHandler={onChangeSigningSecretHandler}
+            onChangeBotTokenHandler={onChangeBotTokenHandler}
+            slackSigningSecretEnv={slackSigningSecretEnv}
+            slackBotTokenEnv={slackBotTokenEnv}
           />
         </Collapse>
       </div>