use namespace and show error

vmware-tanzu · Jan 17, 2018 · 63503d5 · 63503d5
1 parent 695e9c5
commit 63503d5
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 22 deletions.
diff --git a/src/actions/index.ts b/src/actions/index.ts
@@ -35,9 +35,9 @@ export function getChart(id: string) {
   };
 }
 
-export function deployChart(chart: Chart, releaseName: string) {
+export function deployChart(chart: Chart, releaseName: string, namespace: string) {
   return (dispatch: Dispatch<StoreState>): Promise<{}> => {
-    return fetch(`/api/kube/apis/helm.bitnami.com/v1/namespaces/default/helmreleases`, {
+    return fetch(`/api/kube/apis/helm.bitnami.com/v1/namespaces/${namespace}/helmreleases`, {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({
@@ -52,12 +52,13 @@ export function deployChart(chart: Chart, releaseName: string) {
           version: chart.relationships.latestChartVersion.data.version,
         }
       }),
-    }).then(response => {
-      if (response.status !== 201) {
-        throw new Error('error deploying chart');
-      }
-      return response.json();
-    });
+    }).then(response => response.json())
+      .then(json => {
+        if (json.status === 'Failure') {
+          throw new Error(json.message);
+        }
+        return json;
+      });
   };
 }
 

diff --git a/src/components/ChartDeployButton.tsx b/src/components/ChartDeployButton.tsx
@@ -5,7 +5,7 @@ import * as Modal from 'react-modal';
 
 interface Props {
   chart: Chart;
-  deployChart: (chart: Chart, releaseName: string) => Promise<{}>;
+  deployChart: (chart: Chart, releaseName: string, namespace: string) => Promise<{}>;
   push: (location: string) => RouterAction;
 }
 
@@ -15,14 +15,16 @@ interface State {
   // deployment options
   releaseName: string;
   namespace: string;
+  error: string | null;
 }
 
 class ChartDeployButton extends React.Component<Props> {
   state: State = {
     isDeploying: false,
     modalIsOpen: false,
     releaseName: '',
-    namespace: 'default'
+    namespace: 'default',
+    error: null,
   };
 
   render() {
@@ -43,6 +45,10 @@ class ChartDeployButton extends React.Component<Props> {
           onRequestClose={this.closeModal}
           contentLabel="Modal"
         >
+          {this.state.error && 
+          <div className="container padding-v-bigger bg-action">
+            {this.state.error}
+          </div>}
           <form onSubmit={this.handleDeploy}>
             <div>
               <label htmlFor="releaseName">Name</label>
@@ -86,16 +92,11 @@ class ChartDeployButton extends React.Component<Props> {
   handleDeploy = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
     const { chart, deployChart, push } = this.props;
-    this.setState({
-      isDeploying: true,
-    });
-    deployChart(chart, this.state.releaseName)
-      .then(() => push(`/apps/${this.state.releaseName}`))
-      .catch(err => {
-      this.setState({
-        isDeploying: false,
-      });
-    });
+    this.setState({isDeploying: true});
+    const { releaseName, namespace } = this.state;
+    deployChart(chart, releaseName, namespace)
+      .then(() => push(`/apps/${releaseName}`))
+      .catch(err => this.setState({isDeploying: false, error: err.toString()}));
   }
 
   handleReleaseNameChange = (e: React.FormEvent<HTMLInputElement>) => {

diff --git a/src/components/ChartView.tsx b/src/components/ChartView.tsx
@@ -6,7 +6,7 @@ import { RouterAction } from 'react-router-redux';
 interface Props {
   chartID: string;
   getChart: (id: string) => Promise<{}>;
-  deployChart: (chart: Chart, releaseName: string) => Promise<{}>;
+  deployChart: (chart: Chart, releaseName: string, namespace: string) => Promise<{}>;
   push: (location: string) => RouterAction;
   isFetching: boolean;
   chart: Chart;

diff --git a/src/containers/ChartViewContainer.tsx b/src/containers/ChartViewContainer.tsx
@@ -27,7 +27,8 @@ function mapStateToProps({ charts }: StoreState, { match: { params } }: RoutePro
 function mapDispatchToProps(dispatch: Dispatch<StoreState>) {
   return {
     getChart: (id: string) => dispatch(actions.getChart(id)),
-    deployChart: (chart: Chart, releaseName: string) => dispatch(actions.deployChart(chart, releaseName)),
+    deployChart: (chart: Chart, releaseName: string, namespace: string) =>
+      dispatch(actions.deployChart(chart, releaseName, namespace)),
     push: (location: string) => dispatch(push(location)),
   };
 }