WIP

dashboard/src/components/repo-selector/ActionConfEditor.tsx

@@ -16,7 +16,9 @@ type PropsType = {
   setBranch: (x: string) => void;
   reset: any;
   dockerfilePath: string;
+  procfilePath: string;
   setDockerfilePath: (x: string) => void;
+  setProcfilePath: (x: string) => void;
   folderPath: string;
   setFolderPath: (x: string) => void;
   setSelectedRegistry: (x: any) => void;
@@ -84,6 +86,7 @@ export default class ActionConfEditor extends Component<PropsType, StateType> {
               branch={branch}
               setActionConfig={setActionConfig}
               setDockerfilePath={(x: string) => this.props.setDockerfilePath(x)}
+              setProcfilePath={(x: string) => this.props.setProcfilePath(x)}
               setFolderPath={(x: string) => this.props.setFolderPath(x)}
             />
           </ExpandedWrapperAlt>
@@ -100,6 +103,36 @@ export default class ActionConfEditor extends Component<PropsType, StateType> {
         </>
       );
     }
+
+    if (this.props.procfilePath && this.props.folderPath && !this.props.dockerfilePath) {
+      return (
+        <>
+        <div>hello</div>
+          {/* <ExpandedWrapperAlt>
+            <ContentsList
+              actionConfig={actionConfig}
+              branch={branch}
+              setActionConfig={setActionConfig}
+              procfilePath={this.props.procfilePath}
+              setDockerfilePath={(x: string) => this.props.setDockerfilePath(x)}
+              setProcfilePath={(x: string) => this.props.setProcfilePath(x)}
+              setFolderPath={(x: string) => this.props.setFolderPath(x)}
+            />
+          </ExpandedWrapperAlt>
+          <Br />
+          <BackButton
+            width="145px"
+            onClick={() => {
+              setBranch("");
+            }}
+          >
+            <i className="material-icons">keyboard_backspace</i>
+            Select Branch
+          </BackButton> */}
+        </>
+      )
+    }
+
     return (
       <ActionDetails
         branch={branch}
@@ -108,6 +141,7 @@ export default class ActionConfEditor extends Component<PropsType, StateType> {
         actionConfig={actionConfig}
         setActionConfig={setActionConfig}
         dockerfilePath={this.props.dockerfilePath}
+        procfilePath={this.props.procfilePath}
         folderPath={this.props.folderPath}
         setSelectedRegistry={this.props.setSelectedRegistry}
         selectedRegistry={this.props.selectedRegistry}

dashboard/src/components/repo-selector/ActionDetails.tsx

@@ -15,6 +15,7 @@ type PropsType = {
   setActionConfig: (x: ActionConfigType) => void;
   branch: string;
   dockerfilePath: string;
+  procfilePath: string;
   folderPath: string;
   setSelectedRegistry: (x: any) => void;
   selectedRegistry: any;
@@ -29,12 +30,6 @@ type StateType = {
   loading: boolean;
 };
 
-const dummyRegistries = [
-  { id: 1, service: "ecr", url: "https://idfkasdfasdf" },
-  { id: 12, service: "ecr", url: "https://dfasdfidfkasdfasdf" },
-  { id: 11, service: "gcr", url: "https://idfkasdfasdf" },
-] as any[];
-
 export default class ActionDetails extends Component<PropsType, StateType> {
   state = {
     dockerRepo: "",
@@ -112,6 +107,7 @@ export default class ActionDetails extends Component<PropsType, StateType> {
   };
 
   render() {
+    console.log(this.props.dockerfilePath, this.props.folderPath, this.props.procfilePath)
     return (
       <>
         <DarkMatter />
@@ -174,6 +170,11 @@ export default class ActionDetails extends Component<PropsType, StateType> {
             <StatusWrapper successful={true}>
               <i className="material-icons">done</i> Source selected
             </StatusWrapper>
+          ) : (!this.props.procfilePath && !this.props.dockerfilePath) ? (
+            <StatusWrapper>
+              <i className="material-icons">error_outline</i>
+              Procfile not detected.
+            </StatusWrapper>
           ) : (
             <StatusWrapper>
               <i className="material-icons">error_outline</i>A connected

dashboard/src/components/repo-selector/ContentsList.tsx

@@ -14,8 +14,10 @@ import Loading from "../Loading";
 type PropsType = {
   actionConfig: ActionConfigType | null;
   branch: string;
+  procfilePath?: string;
   setActionConfig: (x: ActionConfigType) => void;
   setDockerfilePath: (x: string) => void;
+  setProcfilePath: (x: string) => void;
   setFolderPath: (x: string) => void;
 };
 
@@ -27,8 +29,6 @@ type StateType = {
   dockerfiles: string[];
 };
 
-const dummyDockerfiles = ["dev.Dockerfile", "prod.Dockerfile", "Dockerfile"];
-
 export default class ContentsList extends Component<PropsType, StateType> {
   state = {
     loading: true,
@@ -130,6 +130,7 @@ export default class ContentsList extends Component<PropsType, StateType> {
           </FileItem>
         );
       }
+
       return (
         <FileItem key={i} lastItem={i === contents.length - 1}>
           <img src={file} />
@@ -173,6 +174,9 @@ export default class ContentsList extends Component<PropsType, StateType> {
       if (fileName.includes("Dockerfile")) {
         dockerfiles.push(fileName);
       }
+      if (fileName.includes("Procfile")) {
+        this.props.setProcfilePath(item.Path)
+      }
     });
     if (dockerfiles.length > 0) {
       this.setState({ dockerfiles });
@@ -216,8 +220,10 @@ export default class ContentsList extends Component<PropsType, StateType> {
             })}
           </DockerfileList>
           <ConfirmButton
-            onClick={() =>
+            onClick={() => {
               this.props.setFolderPath(this.state.currentDir || "./")
+              this.props.setProcfilePath(`${this.state.currentDir}/Procfile` || `./Procfile`)
+            }
             }
           >
             No, I don't want to use a Dockerfile

dashboard/src/main/home/launch/expanded-template/LaunchTemplate.tsx

@@ -53,6 +53,7 @@ type StateType = {
   branch: string;
   repoType: string;
   dockerfilePath: string | null;
+  procfilePath: string | null;
   folderPath: string | null;
   selectedRegistry: any | null;
   env: any;
@@ -86,6 +87,7 @@ class LaunchTemplate extends Component<PropsType, StateType> {
     branch: "",
     repoType: "",
     dockerfilePath: null as string | null,
+    procfilePath: null as string | null,
     folderPath: null as string | null,
     selectedRegistry: null as any | null,
     env: {},
@@ -376,6 +378,7 @@ class LaunchTemplate extends Component<PropsType, StateType> {
       sourceType,
       dockerfilePath,
       folderPath,
+      procfilePath,
     } = this.state;
 
     if (!this.submitIsDisabled()) {
@@ -387,6 +390,14 @@ class LaunchTemplate extends Component<PropsType, StateType> {
       return "loading"
     }
 
+    if (
+      sourceType === "repo" &&
+      (!dockerfilePath && folderPath) &&
+      !procfilePath
+    ) {
+      return "Procfile not detected."
+    }
+
     if (
       sourceType === "repo" &&
       (dockerfilePath || folderPath) &&
@@ -588,7 +599,7 @@ class LaunchTemplate extends Component<PropsType, StateType> {
     } else if (this.state.sourceType === "registry") {
       return (
         <StyledSourceBox>
-          <CloseButton onClick={() => this.setState({ sourceType: "" })}>
+          <CloseButton onClick={() => this.setState({ sourceType: "", selectedImageUrl: "", selectedTag: "" })}>
             <CloseButtonImg src={close} />
           </CloseButton>
           <Subtitle>
@@ -668,6 +679,10 @@ class LaunchTemplate extends Component<PropsType, StateType> {
             setDockerfilePath={(x: string) =>
               this.setState({ dockerfilePath: x })
             }
+            setProcfilePath={(x: string) => {
+              this.setState({ procfilePath: x })
+            }}
+            procfilePath={this.state.procfilePath}
             dockerfilePath={this.state.dockerfilePath}
             folderPath={this.state.folderPath}
             setFolderPath={(x: string) => this.setState({ folderPath: x })}