feat(deploy): save credentials on overlay close

Closes #2860
camunda · Apr 4, 2022 · 5557425 · 5557425
1 parent f46e7d1
commit 5557425
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 19 deletions.
diff --git a/client/src/plugins/zeebe-plugin/deployment-plugin/DeploymentPlugin.js b/client/src/plugins/zeebe-plugin/deployment-plugin/DeploymentPlugin.js
@@ -262,14 +262,19 @@ export default class DeploymentPlugin extends PureComponent {
 
     const p = pDefer();
 
-    const onClose = (config) => {
+    const onClose = (config, userAction) => {
 
       if (options.onClose) {
         options.onClose();
       }
 
       this.closeOverlay();
 
+      if (userAction === 'cancel') {
+        this.saveConfig(tab, config);
+        return p.resolve(null);
+      }
+
       return p.resolve(config);
     };
 
@@ -531,13 +536,14 @@ export default class DeploymentPlugin extends PureComponent {
     this.setState({ overlayState: null });
   }
 
-  onIconClicked = async () => {
+  onIconClicked = () => {
     const {
       overlayState
     } = this.state;
 
-    if (overlayState && !overlayState.isStart)
+    if (overlayState && !overlayState.isStart) {
       this.closeOverlay();
+    }
 
     else this.deploy();
   }

diff --git a/client/src/plugins/zeebe-plugin/deployment-plugin/DeploymentPluginOverlay.js b/client/src/plugins/zeebe-plugin/deployment-plugin/DeploymentPluginOverlay.js
@@ -68,7 +68,8 @@ export default class DeploymentPluginOverlay extends React.PureComponent {
     super(props);
 
     this.state = {
-      connectionState: { type: CONNECTION_STATE.INITIAL }
+      connectionState: { type: CONNECTION_STATE.INITIAL },
+      configValues: {}
     };
 
     const { validator } = props;
@@ -143,6 +144,16 @@ export default class DeploymentPluginOverlay extends React.PureComponent {
 
   scheduleConnectionCheck = formValues => {
     this.connectionChecker.check(formValues.endpoint);
+
+    const { endpoint } = formValues;
+
+    // Extract clusterId and clusterRegion as required by zeebeAPI for camundaCloud
+    if (endpoint.targetType === CAMUNDA_CLOUD && endpoint.camundaCloudClusterUrl) {
+      endpoint.camundaCloudClusterId = extractClusterId(endpoint.camundaCloudClusterUrl);
+      endpoint.camundaCloudClusterRegion = extractClusterRegion(endpoint.camundaCloudClusterUrl);
+    }
+
+    this.setState({ configValues: formValues });
   }
 
   handleConnectionCheckResult = result => {
@@ -194,7 +205,7 @@ export default class DeploymentPluginOverlay extends React.PureComponent {
       anchor
     } = this.props;
 
-    const onClose = () => closeOverlay(null);
+    const onClose = () => closeOverlay(this.state.configValues, 'cancel');
 
     const {
       validatorFunctionsByFieldNames
@@ -324,14 +335,11 @@ export default class DeploymentPluginOverlay extends React.PureComponent {
                             </React.Fragment>
                           )
                         }
-                        {
-                          (form.values.endpoint.authType !== AUTH_TYPES.NONE || form.values.endpoint.targetType === CAMUNDA_CLOUD) &&
-                            <Field
-                              name={ 'endpoint.rememberCredentials' }
-                              component={ ToggleSwitch }
-                              switcherLabel={ REMEMBER_CREDENTIALS }
-                            />
-                        }
+                        <Field
+                          name={ 'endpoint.rememberCredentials' }
+                          component={ ToggleSwitch }
+                          switcherLabel={ REMEMBER_CREDENTIALS }
+                        />
                       </div>
                     </fieldset>
                     <Section.Actions>
@@ -365,7 +373,8 @@ export default class DeploymentPluginOverlay extends React.PureComponent {
   * @return {string} camundaCloudClusterId
   */
 function extractClusterId(camundaCloudClusterUrl) {
-  return camundaCloudClusterUrl.match(/([a-z\d]+-){2,}[a-z\d]+/g)[0];
+  const matches = camundaCloudClusterUrl.match(/([a-z\d]+-){2,}[a-z\d]+/g);
+  return matches ? matches[0] : null;
 }
 
 
@@ -376,5 +385,6 @@ function extractClusterId(camundaCloudClusterUrl) {
  * @return {type} camundaCloudClusterRegion
  */
 function extractClusterRegion(camundaCloudClusterUrl) {
-  return camundaCloudClusterUrl.match(/(?<=\.)[a-z]+-[\d]+/g)[0];
+  const matches = camundaCloudClusterUrl.match(/(?<=\.)[a-z]+-[\d]+/g);
+  return matches ? matches[0] : null;
 }
diff --git a/client/src/plugins/zeebe-plugin/deployment-plugin/__tests__/DeploymentPluginSpec.js b/client/src/plugins/zeebe-plugin/deployment-plugin/__tests__/DeploymentPluginSpec.js
@@ -263,6 +263,20 @@ describe('<DeploymentPlugin> (Zeebe)', () => {
   });
 
 
+  it('should save tab on close', async () => {
+
+    // given
+    const config = { set: sinon.spy() };
+    const { instance } = createDeploymentPlugin({ config, userAction: 'cancel' });
+
+    // when
+    await instance.deploy();
+
+    // then
+    expect(config.set).to.have.been.calledOnce;
+  });
+
+
   describe('ui', () => {
 
     const BUTTON_SELECTOR = '[title="Deploy current diagram"]';
@@ -1328,13 +1342,11 @@ class TestDeploymentPlugin extends DeploymentPlugin {
     } = this.props;
 
     if (overlayState) {
-      const action = userAction || 'deploy';
-
       if (userActionSpy) {
         userActionSpy();
       }
 
-      const config = action !== 'cancel' && {
+      const config = {
         endpoint: {
           ...overlayState.config.endpoint,
           ...endpoint
@@ -1346,7 +1358,7 @@ class TestDeploymentPlugin extends DeploymentPlugin {
       };
 
       if (!keepOpen) {
-        overlayState.onClose(config);
+        overlayState.onClose(config, userAction);
       }
     }
   }