Merge pull request #287 from porter-dev/beta.3.cicd

Beta.3.cicd to staging

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

@@ -66,7 +66,7 @@ export default class ActionConfEditor extends Component<PropsType, StateType> {
             this.setState({ loading: false, error: false });
           }
         })
-        .catch((err) => this.setState({ loading: false, error: true }));
+        .catch((_) => this.setState({ loading: false, error: true }));
     } else {
       let grid = this.props.userId;
       api

dashboard/src/main/home/Home.tsx

@@ -125,38 +125,40 @@ class Home extends Component<PropsType, StateType> {
       .catch(console.log);
   };
 
-  provisionDOCR = (integrationId: number, tier: string, callback?: any) => {
+  provisionDOCR = async (
+    integrationId: number,
+    tier: string,
+    callback?: any
+  ) => {
     console.log("Provisioning DOCR...");
-    return api
-      .createDOCR(
-        "<token>",
-        {
-          do_integration_id: integrationId,
-          docr_name: this.props.currentProject.name,
-          docr_subscription_tier: tier,
-        },
-        {
-          project_id: this.props.currentProject.id,
-        }
-      )
-      .then(() => callback());
+    await api.createDOCR(
+      "<token>",
+      {
+        do_integration_id: integrationId,
+        docr_name: this.props.currentProject.name,
+        docr_subscription_tier: tier,
+      },
+      {
+        project_id: this.props.currentProject.id,
+      }
+    );
+    return callback();
   };
 
-  provisionDOKS = (integrationId: number, region: string) => {
+  provisionDOKS = async (integrationId: number, region: string) => {
     console.log("Provisioning DOKS...");
-    return api
-      .createDOKS(
-        "<token>",
-        {
-          do_integration_id: integrationId,
-          doks_name: this.props.currentProject.name,
-          do_region: region,
-        },
-        {
-          project_id: this.props.currentProject.id,
-        }
-      )
-      .then(() => this.props.history.push("dashboard?tab=provisioner"));
+    await api.createDOKS(
+      "<token>",
+      {
+        do_integration_id: integrationId,
+        doks_name: this.props.currentProject.name,
+        do_region: region,
+      },
+      {
+        project_id: this.props.currentProject.id,
+      }
+    );
+    return this.props.history.push("dashboard?tab=provisioner");
   };
 
   checkDO = () => {

dashboard/src/main/home/cluster-dashboard/ClusterDashboard.tsx

@@ -109,8 +109,8 @@ class ClusterDashboard extends Component<PropsType, StateType> {
         <LineBreak />
 
         <ControlRow>
-          <Button onClick={() => this.props.history.push("templates")}>
-            <i className="material-icons">add</i> Deploy Template
+          <Button onClick={() => this.props.history.push("launch")}>
+            <i className="material-icons">add</i> Launch Template
           </Button>
           <SortFilterWrapper>
             <SortSelector

dashboard/src/main/home/integrations/Integrations.tsx

@@ -128,7 +128,8 @@ export default class Integrations extends Component<PropsType, StateType> {
               return (
                 <Credential key={i}>
                   <i className="material-icons">admin_panel_settings</i>{" "}
-                  {item.name}
+                  {/* TODO: handle different types of items (ie. registry vs repo) */}
+                  {item.name || item.repo_entity}
                 </Credential>
               );
             })}

dashboard/src/main/home/launch/Launch.tsx

@@ -44,7 +44,7 @@ export default class Templates extends Component<PropsType, StateType> {
           this.state.porterTemplates.sort((a, b) =>
             a.name === "docker" ? -1 : b.name === "docker" ? 1 : 0
           );
-          // TODO: properly find "docker" template instead of relying on first
+          // TODO: properly find "docker" template instead of relying on first entry
           this.setState({
             loading: false,
             currentTemplate: this.state.porterTemplates[0],

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

@@ -131,5 +131,5 @@ const LoadingWrapper = styled.div`
 const StyledExpandedTemplate = styled.div`
   width: calc(90% - 150px);
   min-width: 300px;
-  padding-top: 10px;
+  padding-top: 30px;
 `;

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

@@ -129,6 +129,8 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
         }
       )
       .then((_) => {
+        console.log("ST");
+        console.log(this.state.sourceType);
         if (this.state.sourceType === "repo") {
           this.createGHAction(name, this.state.selectedNamespace);
         }
@@ -220,20 +222,29 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
         this.setState({ saveValuesStatus: "successful" }, () => {
           // redirect to dashboard with namespace
         });
-        posthog.capture("Deployed template", {
-          name: this.props.currentTemplate.name,
-          namespace: this.state.selectedNamespace,
-          values: values,
-        });
+        try {
+          posthog.capture("Deployed template", {
+            name: this.props.currentTemplate.name,
+            namespace: this.state.selectedNamespace,
+            values: values,
+          });
+        } catch (error) {
+          console.log(error);
+        }
       })
       .catch((err) => {
         this.setState({ saveValuesStatus: "error" });
-        posthog.capture("Failed to deploy template", {
-          name: this.props.currentTemplate.name,
-          namespace: this.state.selectedNamespace,
-          values: values,
-          error: err,
-        });
+
+        try {
+          posthog.capture("Failed to deploy template", {
+            name: this.props.currentTemplate.name,
+            namespace: this.state.selectedNamespace,
+            values: values,
+            error: err,
+          });
+        } catch (error) {
+          console.log(error);
+        }
       });
   };
 
@@ -351,7 +362,7 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
     );
   };
 
-  renderTabRegion = () => {
+  renderSettingsRegion = () => {
     if (this.state.tabOptions.length > 0) {
       return (
         <>
@@ -392,7 +403,7 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
   };
 
   // Display if current template uses source (image or repo)
-  renderSourceSelector = () => {
+  renderSourceSelectorContent = () => {
     let { currentProject } = this.context;
 
     if (this.props.form?.hasSource) {
@@ -429,22 +440,6 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
               >
                 log in with GitHub
               </A>{" "}
-              or
-              <Highlight
-                onClick={() =>
-                  this.setState({
-                    sourceType: "registry",
-                    actionConfig: {
-                      git_repo: "",
-                      image_repo_uri: "",
-                      git_repo_id: 0,
-                      dockerfile_path: "",
-                    } as ActionConfigType,
-                  })
-                }
-              >
-                link an image registry
-              </Highlight>
               .<Required>*</Required>
             </Subtitle>
             <ActionConfEditor
@@ -468,6 +463,25 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
     }
   };
 
+  renderSourceSelector = () => {
+    return (
+      <>
+        <TabRegion
+          options={[
+            { label: "Registry", value: "registry" },
+            { label: "Github", value: "repo" },
+          ]}
+          currentTab={this.state.sourceType}
+          setCurrentTab={(x) => this.setState({ sourceType: x })}
+        >
+          <StyledSourceBox>
+            {this.renderSourceSelectorContent()}
+          </StyledSourceBox>
+        </TabRegion>
+      </>
+    );
+  };
+
   render() {
     let { name, icon } = this.props.currentTemplate;
     let { currentTemplate } = this.props;
@@ -541,7 +555,7 @@ export default class LaunchTemplate extends Component<PropsType, StateType> {
           width="100%"
         />
         {this.renderSourceSelector()}
-        {this.renderTabRegion()}
+        {this.renderSettingsRegion()}
       </StyledLaunchTemplate>
     );
   }
@@ -654,7 +668,6 @@ const ClusterSection = styled.div`
   font-family: "Work Sans", sans-serif;
   font-size: 14px;
   font-weight: 500;
-  margin-top: 20px;
   margin-bottom: 15px;
 
   > i {
@@ -721,3 +734,16 @@ const A = styled.a`
   padding-right: ${(props: { padRight?: boolean }) =>
     props.padRight ? "5px" : ""};
 `;
+
+const StyledSourceBox = styled.div`
+  width: 100%;
+  height: 100%;
+  background: #ffffff11;
+  color: #ffffff;
+  padding: 10px 35px 25px;
+  position: relative;
+  border-radius: 5px;
+  font-size: 13px;
+  overflow: auto;
+  margin-bottom: 25px;
+`;

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

@@ -297,7 +297,7 @@ const Title = styled.div`
 
 const TitleSection = styled.div`
   display: flex;
-  margin-left: -42px;
+  margin-left: 0px;
   flex-direction: row;
   height: 40px;
   justify-content: space-between;

dashboard/src/main/home/sidebar/Sidebar.tsx

@@ -2,7 +2,7 @@ import React, { Component } from "react";
 import styled from "styled-components";
 import category from "assets/category.svg";
 import integrations from "assets/integrations.svg";
-import filter from "assets/filter.svg";
+import rocket from "assets/rocket.png";
 import settings from "assets/settings.svg";
 
 import { Context } from "shared/Context";
@@ -115,16 +115,14 @@ class Sidebar extends Component<PropsType, StateType> {
             onClick={() => this.props.history.push("launch")}
             selected={currentView === "launch"}
           >
-            <Img src={filter} />
+            <Img src={rocket} />
             Launch
           </NavButton>
           <NavButton
             selected={currentView === "integrations"}
-            /* 
-            onClick={() => {
-              setCurrentView('integrations')
-            }}
-            */
+            // onClick={() => {
+            //   this.props.history.push("integrations");
+            // }}
             onClick={() => {
               setCurrentModal("IntegrationsInstructionsModal", {});
             }}

server/api/git_repo_handler.go

@@ -91,6 +91,32 @@ func (app *App) HandleListRepos(w http.ResponseWriter, r *http.Request) {
 	json.NewEncoder(w).Encode(res)
 }
 
+// HandleDeleteProjectGitRepo handles the deletion of a Github Repo via the git repo ID
+func (app *App) HandleDeleteProjectGitRepo(w http.ResponseWriter, r *http.Request) {
+	id, err := strconv.ParseUint(chi.URLParam(r, "git_repo_id"), 0, 64)
+
+	if err != nil || id == 0 {
+		app.handleErrorFormDecoding(err, ErrProjectDecode, w)
+		return
+	}
+
+	repo, err := app.Repo.GitRepo.ReadGitRepo(uint(id))
+
+	if err != nil {
+		app.handleErrorRead(err, ErrProjectDataRead, w)
+		return
+	}
+
+	err = app.Repo.GitRepo.DeleteGitRepo(repo)
+
+	if err != nil {
+		app.handleErrorRead(err, ErrProjectDataRead, w)
+		return
+	}
+
+	w.WriteHeader(http.StatusOK)
+}
+
 // HandleGetBranches retrieves a list of branch names for a specified repo
 func (app *App) HandleGetBranches(w http.ResponseWriter, r *http.Request) {
 	tok, err := app.githubTokenFromRequest(r)

server/router/router.go

@@ -939,6 +939,20 @@ func New(a *api.App) *chi.Mux {
 			),
 		)
 
+		r.Method(
+			"DELETE",
+			"/projects/{project_id}/gitrepos/{git_repo_id}",
+			auth.DoesUserHaveProjectAccess(
+				auth.DoesUserHaveGitRepoAccess(
+					requestlog.NewHandler(a.HandleDeleteProjectGitRepo, l),
+					mw.URLParam,
+					mw.URLParam,
+				),
+				mw.URLParam,
+				mw.WriteAccess,
+			),
+		)
+
 		r.Method(
 			"GET",
 			"/projects/{project_id}/gitrepos/{git_repo_id}/repos",