Merge pull request #1009 from porter-dev/job-rerun-hotfix

Job rerun hotfix

dashboard/src/components/porter-form/PorterFormContextProvider.tsx

@@ -30,6 +30,7 @@ interface ContextProps {
   onSubmit: () => void;
   dispatchAction: (event: PorterFormAction) => void;
   validationInfo: PorterFormValidationInfo;
+  getSubmitValues: () => PorterFormVariableList;
   isReadOnly?: boolean;
 }
 
@@ -376,7 +377,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
   using functions for each input to finalize the variables
   This can take care of things like appending units to strings
  */
-  const onSubmitWrapper = () => {
+  const getSubmitValues = () => {
     // we start off with a base list of the current variables for fields
     // that don't need any processing on top (for example: checkbox)
     // the assign here is important because that way state.variable isn't mutated
@@ -411,7 +412,12 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
       )
     );
     if (props.doDebug) console.log(Object.assign.apply({}, varList));
-    props.onSubmit(Object.assign.apply({}, varList));
+
+    return Object.assign.apply({}, varList);
+  };
+
+  const onSubmitWrapper = () => {
+    props.onSubmit(getSubmitValues());
   };
 
   if (props.doDebug) {
@@ -434,6 +440,7 @@ export const PorterFormContextProvider: React.FC<Props> = (props) => {
           error: isValidated ? null : "Missing required fields",
         },
         onSubmit: onSubmitWrapper,
+        getSubmitValues,
       }}
     >
       {props.children}

dashboard/src/components/porter-form/field-components/Input.tsx

@@ -50,8 +50,6 @@ const Input: React.FC<InputField> = ({
     return <></>;
   }
 
-  console.log(value);
-
   const curValue =
     settings?.type == "number"
       ? !isNaN(parseFloat(variables[variable]))

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

@@ -11,12 +11,10 @@ import { Context } from "shared/Context";
 import api from "shared/api";
 
 import SaveButton from "components/SaveButton";
-import Loading from "components/Loading";
 import TitleSection from "components/TitleSection";
-import JobList from "./jobs/JobList";
+import TempJobList from "./jobs/TempJobList";
 import SettingsSection from "./SettingsSection";
 import PorterFormWrapper from "components/porter-form/PorterFormWrapper";
-import { PlaceHolder } from "brace";
 import { withAuth, WithAuthProps } from "shared/auth/AuthorizationHoc";
 
 type PropsType = WithAuthProps & {
@@ -419,25 +417,6 @@ class ExpandedJobChart extends Component<PropsType, StateType> {
   };
 
   renderTabContents = (currentTab: string, submitValues?: any) => {
-    let saveButton = (
-      <ButtonWrapper>
-        <SaveButton
-          onClick={() => this.handleSaveValues(submitValues, true)}
-          status={this.state.saveValuesStatus}
-          makeFlush={true}
-          clearPosition={true}
-          rounded={true}
-          statusPosition="right"
-        >
-          <i className="material-icons">play_arrow</i> Run Job
-        </SaveButton>
-      </ButtonWrapper>
-    );
-
-    if (!this.props.isAuthorized("job", "", ["get", "update", "create"])) {
-      saveButton = null;
-    }
-
     switch (currentTab) {
       case "jobs":
         if (this.state.imageIsPlaceholder) {
@@ -455,12 +434,12 @@ class ExpandedJobChart extends Component<PropsType, StateType> {
         }
         return (
           <TabWrapper>
-            {saveButton}
-            <JobList
+            <TempJobList
+              handleSaveValues={this.handleSaveValues}
               jobs={this.state.jobs}
-              setJobs={(jobs: any) => {
-                this.setState({ jobs });
-              }}
+              setJobs={(jobs: any) => this.setState({ jobs })}
+              isAuthorized={this.props.isAuthorized}
+              saveValuesStatus={this.state.saveValuesStatus}
             />
           </TabWrapper>
         );
@@ -616,10 +595,9 @@ class ExpandedJobChart extends Component<PropsType, StateType> {
                     this.state.imageIsPlaceholder ||
                     !this.props.isAuthorized("job", "", ["get", "update"])
                   }
-                  onSubmit={(formValues) => {
-                    console.log(formValues);
-                    this.handleSaveValues(formValues, false);
-                  }}
+                  onSubmit={(formValues) =>
+                    this.handleSaveValues(formValues, false)
+                  }
                   leftTabOptions={this.state.leftTabOptions}
                   rightTabOptions={this.state.rightTabOptions}
                   saveValuesStatus={this.state.saveValuesStatus}

dashboard/src/main/home/cluster-dashboard/expanded-chart/jobs/TempJobList.tsx

@@ -0,0 +1,55 @@
+import React, { useContext, useState } from "react";
+import styled from "styled-components";
+
+import { PorterFormContext } from "components/porter-form/PorterFormContextProvider";
+import JobList from "./JobList";
+import SaveButton from "components/SaveButton";
+
+interface Props {
+  isAuthorized: any;
+  saveValuesStatus: string;
+  setJobs: any;
+  jobs: any;
+  handleSaveValues: any;
+}
+
+/**
+ * Temporary functional component for allowing job rerun button to consume
+ * form context (until ExpandedJobChart is migrated to FC)
+ */
+const TempJobList: React.FC<Props> = (props) => {
+  const { getSubmitValues } = useContext(PorterFormContext);
+  const [searchInput, setSearchInput] = useState("");
+
+  let saveButton = (
+    <ButtonWrapper>
+      <SaveButton
+        onClick={() => props.handleSaveValues(getSubmitValues(), true)}
+        status={props.saveValuesStatus}
+        makeFlush={true}
+        clearPosition={true}
+        rounded={true}
+        statusPosition="right"
+      >
+        <i className="material-icons">play_arrow</i> Run Job
+      </SaveButton>
+    </ButtonWrapper>
+  );
+
+  if (!props.isAuthorized("job", "", ["get", "update", "create"])) {
+    saveButton = null;
+  }
+
+  return (
+    <>
+      {saveButton}
+      <JobList jobs={props.jobs} setJobs={props.setJobs} />
+    </>
+  );
+};
+
+export default TempJobList;
+
+const ButtonWrapper = styled.div`
+  margin: 5px 0 35px;
+`;