Implemented save status and removed useless props from revision section

dashboard/src/main/home/cluster-dashboard/expanded-chart/ExpandedJobChart.tsx

@@ -46,6 +46,7 @@ export const ExpandedJobChartFC: React.FC<{
   const {
     chart,
     status,
+    saveStatus,
     refreshChart,
     deleteChart,
     updateChart,
@@ -269,7 +270,7 @@ export const ExpandedJobChartFC: React.FC<{
               }
               leftTabOptions={leftTabOptions}
               rightTabOptions={rightTabOptions}
-              saveValuesStatus={"saveValuesStatus"}
+              saveValuesStatus={saveStatus}
               saveButtonText="Save Config"
               includeHiddenFields
               addendum={
@@ -334,7 +335,6 @@ const ExpandedJobHeader: React.FC<{
       }}
       forceRefreshRevisions={false}
       refreshRevisionsOff={() => {}}
-      status={""}
       shouldUpdate={
         chart.latest_version &&
         chart.latest_version !== chart.chart.metadata.version

dashboard/src/main/home/cluster-dashboard/expanded-chart/RevisionSection.tsx

@@ -18,7 +18,6 @@ type PropsType = WithAuthProps & {
   setRevision: (x: ChartType, isCurrent?: boolean) => void;
   forceRefreshRevisions: boolean;
   refreshRevisionsOff: () => void;
-  status: string;
   shouldUpdate: boolean;
   upgradeVersion: (version: string, cb: () => void) => void;
   latestVersion: string;
@@ -202,23 +201,6 @@ class RevisionSection extends Component<PropsType, StateType> {
     }
   };
 
-  renderStatus = (revision: ChartType) => {
-    if (
-      this.props.chart.version === revision.version &&
-      this.props.status == "loading"
-    ) {
-      return (
-        <div>
-          {this.props.status}
-          <LoadingGif src={loading} revision={true} />
-        </div>
-      );
-    } else if (this.props.chart.version === revision.version) {
-      return this.props.status;
-    }
-    return revision.info.status;
-  };
-
   renderRevisionList = () => {
     return this.state.revisions.map((revision: ChartType, i: number) => {
       let isCurrent = revision.version === this.state.maxVersion;

dashboard/src/shared/hooks/useChart.ts

@@ -17,6 +17,11 @@ export const useChart = (oldChart: ChartType, closeChart: () => void) => {
   const [status, setStatus] = useState<"ready" | "loading" | "deleting">(
     "loading"
   );
+
+  const [saveStatus, setSaveStatus] = useState<
+    "loading" | "successful" | string
+  >("");
+
   const { pushFiltered, getQueryParam, pushQueryParams } = useRouting();
 
   useEffect(() => {
@@ -123,6 +128,7 @@ export const useChart = (oldChart: ChartType, closeChart: () => void) => {
       | ((chart: ChartType) => string)
       | ((chart: ChartType, oldChart?: ChartType) => string)
   ) => {
+    setSaveStatus("loading");
     const values = processValues(chart, oldChart);
 
     const oldSyncedEnvGroups = oldChart.config?.container?.env?.synced || [];
@@ -211,7 +217,8 @@ export const useChart = (oldChart: ChartType, closeChart: () => void) => {
         }
       );
 
-      await refreshChart();
+      setSaveStatus("successful");
+      setTimeout(() => setSaveStatus(""), 500);
     } catch (err) {
       let parsedErr = err?.response?.data?.error;
 
@@ -219,6 +226,7 @@ export const useChart = (oldChart: ChartType, closeChart: () => void) => {
         parsedErr = err;
       }
       setCurrentError(parsedErr);
+      setSaveStatus("Couldn't process the request.");
       // throw new Error(parsedErr);
     }
   };
@@ -277,6 +285,7 @@ export const useChart = (oldChart: ChartType, closeChart: () => void) => {
   return {
     chart,
     status,
+    saveStatus,
     upgradeChart,
     deleteChart,
     updateChart,