From 44208407e87a7f2cf2ef745260d8a9794dcb3c9c Mon Sep 17 00:00:00 2001
From: Miguel Martinez <migmartri@gmail.com>
Date: Wed, 7 Nov 2018 11:42:05 -0800
Subject: [PATCH 1/2] Show correct release name in case of error

---
 .../DeploymentForm/DeploymentForm.test.tsx    | 25 ++++++++++++++++++-
 .../DeploymentForm/DeploymentForm.tsx         | 14 ++++++++---
 2 files changed, 35 insertions(+), 4 deletions(-)

diff --git a/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx b/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
index 3b496d6d0ca..3d28789d6f3 100644
--- a/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
+++ b/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
@@ -60,13 +60,36 @@ describe("renders an error", () => {
         error={new UnprocessableEntity("wrong format!")}
       />,
     );
-    wrapper.setState({ releaseName: "my-app" });
+    wrapper.setState({ latestSubmittedReleaseName: "my-app" });
     expect(wrapper.find(ErrorSelector).exists()).toBe(true);
     expect(wrapper.find(ErrorSelector).html()).toContain(
       "Sorry! Something went wrong processing my-app",
     );
     expect(wrapper.find(ErrorSelector).html()).toContain("wrong format!");
   });
+
+  it("the error does not change if the release name changes", () => {
+    const expectedErrorMsg = "Sorry! Something went wrong processing my-app";
+
+    const wrapper = shallow(
+      <DeploymentForm
+        {...defaultProps}
+        selected={
+          {
+            version: { attributes: {} },
+            versions: [{ id: "foo", attributes: {} }],
+          } as IChartState["selected"]
+        }
+        error={new UnprocessableEntity("wrong format!")}
+      />,
+    );
+
+    wrapper.setState({ latestSubmittedReleaseName: "my-app" });
+    expect(wrapper.find(ErrorSelector).exists()).toBe(true);
+    expect(wrapper.find(ErrorSelector).html()).toContain(expectedErrorMsg);
+    wrapper.setState({ releaseName: "my-app2" });
+    expect(wrapper.find(ErrorSelector).html()).toContain(expectedErrorMsg);
+  });
 });
 
 it("renders the full DeploymentForm", () => {
diff --git a/dashboard/src/components/DeploymentForm/DeploymentForm.tsx b/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
index fc61a62a5a5..bce020d5aae 100644
--- a/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
+++ b/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
@@ -36,6 +36,10 @@ interface IDeploymentFormState {
   isDeploying: boolean;
   // deployment options
   releaseName: string;
+  // Name of the release that was submitted for creation
+  // This is different than releaseName since it is also used in the error banner
+  // and we do not want to use releaseName since it is controller by the form field.
+  latestSubmittedReleaseName: string;
   namespace: string;
   appValues?: string;
   valuesModified: boolean;
@@ -47,6 +51,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
     isDeploying: false,
     namespace: this.props.namespace,
     releaseName: "",
+    latestSubmittedReleaseName: "",
     valuesModified: false,
   };
 
@@ -102,7 +107,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
   public render() {
     const { selected, bindingsWithSecrets, chartID, chartVersion, namespace } = this.props;
     const { version, versions } = selected;
-    const { appValues, releaseName } = this.state;
+    const { appValues } = this.state;
     if (selected.error) {
       return (
         <ErrorSelector error={selected.error} resource={`Chart "${chartID}" (${chartVersion})`} />
@@ -120,7 +125,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
               namespace={namespace}
               defaultRequiredRBACRoles={{ create: this.requiredRBACRoles() }}
               action="create"
-              resource={releaseName}
+              resource={this.state.latestSubmittedReleaseName}
             />
           )}
           <div className="row">
@@ -187,8 +192,9 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
   public handleDeploy = async (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
     const { selected, deployChart, push } = this.props;
-    this.setState({ isDeploying: true });
     const { releaseName, namespace, appValues } = this.state;
+
+    this.setState({ isDeploying: true, latestSubmittedReleaseName: releaseName });
     if (selected.version) {
       const deployed = await deployChart(selected.version, releaseName, namespace, appValues);
       if (deployed) {
@@ -202,6 +208,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
   public handleReleaseNameChange = (e: React.FormEvent<HTMLInputElement>) => {
     this.setState({ releaseName: e.currentTarget.value });
   };
+
   public handleChartVersionChange = (e: React.FormEvent<HTMLSelectElement>) => {
     this.props.push(
       `/apps/ns/${this.props.namespace}/new/${this.props.chartID}/versions/${
@@ -209,6 +216,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
       }`,
     );
   };
+
   public handleValuesChange = (value: string) => {
     this.setState({ appValues: value, valuesModified: true });
   };

From 1ce8474efb08eb7bbbd2ec0cf92fd8634d32ef64 Mon Sep 17 00:00:00 2001
From: Miguel Martinez <migmartri@gmail.com>
Date: Thu, 8 Nov 2018 11:31:33 -0800
Subject: [PATCH 2/2] Apply feedback

---
 .../src/components/DeploymentForm/DeploymentForm.test.tsx     | 2 +-
 dashboard/src/components/DeploymentForm/DeploymentForm.tsx    | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx b/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
index 3d28789d6f3..811264c6cd6 100644
--- a/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
+++ b/dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx
@@ -87,7 +87,7 @@ describe("renders an error", () => {
     wrapper.setState({ latestSubmittedReleaseName: "my-app" });
     expect(wrapper.find(ErrorSelector).exists()).toBe(true);
     expect(wrapper.find(ErrorSelector).html()).toContain(expectedErrorMsg);
-    wrapper.setState({ releaseName: "my-app2" });
+    wrapper.setState({ releaseName: "another-app" });
     expect(wrapper.find(ErrorSelector).html()).toContain(expectedErrorMsg);
   });
 });
diff --git a/dashboard/src/components/DeploymentForm/DeploymentForm.tsx b/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
index bce020d5aae..a6f2b40a3a4 100644
--- a/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
+++ b/dashboard/src/components/DeploymentForm/DeploymentForm.tsx
@@ -107,7 +107,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
   public render() {
     const { selected, bindingsWithSecrets, chartID, chartVersion, namespace } = this.props;
     const { version, versions } = selected;
-    const { appValues } = this.state;
+    const { appValues, latestSubmittedReleaseName } = this.state;
     if (selected.error) {
       return (
         <ErrorSelector error={selected.error} resource={`Chart "${chartID}" (${chartVersion})`} />
@@ -125,7 +125,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
               namespace={namespace}
               defaultRequiredRBACRoles={{ create: this.requiredRBACRoles() }}
               action="create"
-              resource={this.state.latestSubmittedReleaseName}
+              resource={latestSubmittedReleaseName}
             />
           )}
           <div className="row">