Merge branch 'stacks-v1' of github.com:porter-dev/porter into stacks-v1

api/server/handlers/stacks/create_porter_app.go

@@ -58,11 +58,12 @@ func (c *CreatePorterAppHandler) ServeHTTP(w http.ResponseWriter, r *http.Reques
 		GitRepoID: request.GitRepoID,
 		GitBranch: request.GitBranch,
 
-		BuildContext: request.BuildContext,
-		Builder:      request.Builder,
-		Buildpacks:   request.Buildpacks,
-		Dockerfile:   request.Dockerfile,
-		ImageRepoURI: request.ImageRepoURI,
+		BuildContext:   request.BuildContext,
+		Builder:        request.Builder,
+		Buildpacks:     request.Buildpacks,
+		Dockerfile:     request.Dockerfile,
+		ImageRepoURI:   request.ImageRepoURI,
+		PullRequestURL: request.PullRequestURL,
 	}
 
 	porterApp, err := c.Repo().PorterApp().UpdatePorterApp(app)

api/types/porter_app.go

@@ -15,35 +15,38 @@ type PorterApp struct {
 	GitBranch string `json:"git_branch,omitempty"`
 
 	// Build settings (optional)
-	BuildContext string `json:"build_context,omitempty"`
-	Builder      string `json:"builder,omitempty"`
-	Buildpacks   string `json:"build_packs,omitempty"`
-	Dockerfile   string `json:"dockerfile,omitempty"`
+	BuildContext   string `json:"build_context,omitempty"`
+	Builder        string `json:"builder,omitempty"`
+	Buildpacks     string `json:"build_packs,omitempty"`
+	Dockerfile     string `json:"dockerfile,omitempty"`
+	PullRequestURL string `json:"pull_request_url,omitempty"`
 }
 
 // swagger:model
 type CreatePorterAppRequest struct {
-	Name         string `json:"name" form:"required"`
-	ClusterID    uint   `json:"cluster_id"`
-	ProjectID    uint   `json:"project_id"`
-	RepoName     string `json:"repo_name"`
-	GitBranch    string `json:"git_branch"`
-	GitRepoID    uint   `json:"git_repo_id"`
-	BuildContext string `json:"build_context"`
-	Builder      string `json:"builder"`
-	Buildpacks   string `json:"buildpacks"`
-	Dockerfile   string `json:"dockerfile"`
-	ImageRepoURI string `json:"image_repo_uri"`
+	Name           string `json:"name" form:"required"`
+	ClusterID      uint   `json:"cluster_id"`
+	ProjectID      uint   `json:"project_id"`
+	RepoName       string `json:"repo_name"`
+	GitBranch      string `json:"git_branch"`
+	GitRepoID      uint   `json:"git_repo_id"`
+	BuildContext   string `json:"build_context"`
+	Builder        string `json:"builder"`
+	Buildpacks     string `json:"buildpacks"`
+	Dockerfile     string `json:"dockerfile"`
+	ImageRepoURI   string `json:"image_repo_uri"`
+	PullRequestURL string `json:"pull_request_url"`
 }
 
 type UpdatePorterAppRequest struct {
-	RepoName     string `json:"repo_name"`
-	GitBranch    string `json:"git_branch"`
-	BuildContext string `json:"build_context"`
-	Builder      string `json:"builder"`
-	Buildpacks   string `json:"buildpacks"`
-	Dockerfile   string `json:"dockerfile"`
-	ImageRepoURI string `json:"image_repo_uri"`
+	RepoName       string `json:"repo_name"`
+	GitBranch      string `json:"git_branch"`
+	BuildContext   string `json:"build_context"`
+	Builder        string `json:"builder"`
+	Buildpacks     string `json:"buildpacks"`
+	Dockerfile     string `json:"dockerfile"`
+	ImageRepoURI   string `json:"image_repo_uri"`
+	PullRequestURL string `json:"pull_request_url"`
 }
 
 type ListPorterAppResponse []*PorterApp

dashboard/src/components/Banner.tsx

@@ -40,15 +40,16 @@ const StyledBanner = styled.div<{
   color?: string;
   noMargin?: boolean;
 }>`
-  height: 40px;
+  min-height: 40px;
   width: 100%;
   margin: ${(props) => (props.noMargin ? "5px 0 10px" : "")};
   font-size: 13px;
   font-family: "Work Sans", sans-serif;
   display: flex;
+  line-height: 1.5;
   border: 1px solid ${(props) => props.color || "#ffffff00"};
   border-radius: 8px;
-  padding: 14px;
+  padding: 10px 14px;
   color: ${(props) => props.color || "#ffffff"};
   align-items: center;
   background: #ffffff11;

dashboard/src/components/porter/ConfirmOverlay.tsx

@@ -49,7 +49,7 @@ const StyledConfirmOverlay = styled.div`
   font-size: 18px;
   color: white;
   flex-direction: column;
-  background: rgb(0, 0, 0, 0.73);
+  background: rgb(0, 0, 0, 0.55);
   backdrop-filter: blur(5px);
   animation: lindEnter 0.2s;
   animation-fill-mode: forwards;

dashboard/src/main/home/app-dashboard/expanded-app/AppEvents.tsx

@@ -0,0 +1,46 @@
+import Loading from "components/Loading";
+import Fieldset from "components/porter/Fieldset";
+import Link from "components/porter/Link";
+import Spacer from "components/porter/Spacer";
+import Text from "components/porter/Text";
+import React, { useEffect, useState } from "react";
+import styled from "styled-components";
+
+type Props = {
+  repoName: string; 
+  branchName: string;
+};
+
+const AppEvents: React.FC<Props> = ({
+  repoName,
+  branchName,
+}) => {
+  const [isExpanded, setIsExpanded] = useState(false);
+
+  useEffect(() => {
+    // Do something
+  }, []);
+
+  return (
+    <StyledAppEvents>
+      <Fieldset>
+        <Text size={16}>
+          Approval required for Porter GitHub Action
+        </Text>
+        <Spacer y={0.5} />
+        <Text color="helper">
+          We've opened a PR to add the Porter GitHub Action to the {branchName} branch of {repoName}.
+        </Text>
+        <Spacer y={0.5} />
+        <Text color="helper">
+          <Link to="/">Merge Porter PR</Link>
+        </Text>
+      </Fieldset>
+    </StyledAppEvents>
+  );
+};
+
+export default AppEvents;
+
+const StyledAppEvents = styled.div`
+`;

dashboard/src/main/home/app-dashboard/expanded-app/ExpandedApp.tsx

@@ -9,6 +9,7 @@ import web from "assets/web.png";
 import box from "assets/box.png";
 import github from "assets/github.png";
 import pr_icon from "assets/pull_request_icon.svg";
+import loadingImg from "assets/loading.gif";
 
 import api from "shared/api";
 import { Context } from "shared/Context";
@@ -29,10 +30,12 @@ import Button from "components/porter/Button";
 import Services from "../new-app-flow/Services";
 import { Service } from "../new-app-flow/serviceTypes";
 import ConfirmOverlay from "components/porter/ConfirmOverlay";
+import Fieldset from "components/porter/Fieldset";
+import Banner from "components/Banner";
+import AppEvents from "./AppEvents";
 import { createFinalPorterYaml } from "../new-app-flow/schema";
 import EnvGroupArray, { KeyValueType } from "main/home/cluster-dashboard/env-groups/EnvGroupArray";
 import { PorterYamlSchema } from "../new-app-flow/schema";
-import Fieldset from "components/porter/Fieldset";
 
 type Props = RouteComponentProps & {};
 
@@ -50,6 +53,7 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
   );
   const [rawYaml, setRawYaml] = useState<string>("");
   const [isLoading, setIsLoading] = useState(true);
+  const [deleting, setDeleting] = useState(false);
   const [appData, setAppData] = useState(null);
   const [error, setError] = useState(null);
   const [forceRefreshRevisions, setForceRefreshRevisions] = useState<boolean>(
@@ -118,7 +122,8 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
   };
 
   const deletePorterApp = async () => {
-    setIsLoading(true);
+    setShowDeleteOverlay(false);
+    setDeleting(true);
     const { appName } = props.match.params as any;
     try {
       const res = await api.deletePorterApp(
@@ -139,11 +144,10 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
           namespace: `porter-stack-${appName}`,
         }
       );
-      console.log(res);
-      setIsLoading(false);
+      props.history.push("/apps");
     } catch (err) {
       setError(err);
-      setIsLoading(false);
+      setDeleting(false);
     }
   };
 
@@ -463,6 +467,13 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
             </Button>
           </>
         );
+      case "events":
+        return (
+          <AppEvents
+            repoName={appData.app.repo_name}
+            branchName={appData.app.git_branch}
+          />
+        );
       case "environment-variables":
         return (
           <>
@@ -557,53 +568,76 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
             Last deployed {getReadableDate(appData.chart.info.last_deployed)}
           </Text>
           <Spacer y={1} />
-          <DarkMatter />
-          <RevisionSection
-            showRevisions={showRevisions}
-            toggleShowRevisions={() => {
-              setShowRevisions(!showRevisions);
-            }}
-            chart={appData.chart}
-            refreshChart={() => getChartData(appData.chart)}
-            setRevision={setRevision}
-            forceRefreshRevisions={forceRefreshRevisions}
-            refreshRevisionsOff={() => setForceRefreshRevisions(false)}
-            shouldUpdate={
-              appData.chart.latest_version &&
-              appData.chart.latest_version !==
-              appData.chart.chart.metadata.version
-            }
-            latestVersion={appData.chart.latest_version}
-            upgradeVersion={appUpgradeVersion}
-          />
-          <DarkMatter antiHeight="-18px" />
-          <Spacer y={1} />
-          <TabSelector
-            options={
-              appData.app.git_repo_id
-                ? [
-                  { label: "Events", value: "events" },
-                  { label: "Logs", value: "logs" },
-                  { label: "Metrics", value: "metrics" },
-                  { label: "Overview", value: "overview" },
-                  { label: "Environment variables", value: "environment-variables" },
-                  { label: "Build settings", value: "build-settings" },
-                  { label: "Settings", value: "settings" },
-                ]
-                : [
-                  { label: "Events", value: "events" },
-                  { label: "Logs", value: "logs" },
-                  { label: "Metrics", value: "metrics" },
-                  { label: "Overview", value: "overview" },
-                  { label: "Environment variables", value: "environment-variables" },
-                  { label: "Settings", value: "settings" },
-                ]
-            }
-            currentTab={tab}
-            setCurrentTab={setTab}
-          />
-          <Spacer y={1} />
-          {renderTabContents()}
+          {deleting ? (
+            <Fieldset>
+              <Text size={16}>
+                <Spinner src={loadingImg} /> Deleting "
+                {appData.app.name}"
+              </Text>
+              <Spacer y={0.5} />
+              <Text color="helper">
+                You will be automatically redirected after deletion is complete.
+              </Text>
+            </Fieldset>
+          ) : (
+            <>
+              {true ? (
+                <Banner type="warning">
+                  Your application won't be available until you approve and merge this PR in your GitHub repository.
+                </Banner>
+              ) : (
+                <>
+                  <DarkMatter />
+                  <RevisionSection
+                    showRevisions={showRevisions}
+                    toggleShowRevisions={() => {
+                      setShowRevisions(!showRevisions);
+                    }}
+                    chart={appData.chart}
+                    refreshChart={() => getChartData(appData.chart)}
+                    setRevision={setRevision}
+                    forceRefreshRevisions={forceRefreshRevisions}
+                    refreshRevisionsOff={() => setForceRefreshRevisions(false)}
+                    shouldUpdate={
+                      appData.chart.latest_version &&
+                      appData.chart.latest_version !==
+                      appData.chart.chart.metadata.version
+                    }
+                    latestVersion={appData.chart.latest_version}
+                    upgradeVersion={appUpgradeVersion}
+                  />
+                  <DarkMatter antiHeight="-18px" />
+                </>
+              )}
+              <Spacer y={1} />
+              <TabSelector
+                options={
+                  appData.app.git_repo_id
+                    ? [
+                      { label: "Events", value: "events" },
+                      { label: "Logs", value: "logs" },
+                      { label: "Metrics", value: "metrics" },
+                      { label: "Overview", value: "overview" },
+                      { label: "Environment variables", value: "environment-variables" },
+                      { label: "Build settings", value: "build-settings" },
+                      { label: "Settings", value: "settings" },
+                    ]
+                    : [
+                      { label: "Events", value: "events" },
+                      { label: "Logs", value: "logs" },
+                      { label: "Metrics", value: "metrics" },
+                      { label: "Overview", value: "overview" },
+                      { label: "Environment variables", value: "environment-variables" },
+                      { label: "Settings", value: "settings" },
+                    ]
+                }
+                currentTab={tab}
+                setCurrentTab={setTab}
+              />
+              <Spacer y={1} />
+              {renderTabContents()}
+            </>
+          )}
         </StyledExpandedApp>
       )}
       {showDeleteOverlay && (
@@ -623,6 +657,13 @@ const ExpandedApp: React.FC<Props> = ({ ...props }) => {
 
 export default withRouter(ExpandedApp);
 
+const Spinner = styled.img`
+  width: 15px;
+  height: 15px;
+  margin-right: 12px;
+  margin-bottom: -2px;
+`;
+
 const DarkMatter = styled.div<{ antiHeight?: string }>`
   width: 100%;
   margin-top: ${(props) => props.antiHeight || "-20px"};

internal/models/porter_app.go

@@ -22,26 +22,28 @@ type PorterApp struct {
 	RepoName  string
 	GitBranch string
 
-	BuildContext string
-	Builder      string
-	Buildpacks   string
-	Dockerfile   string
+	BuildContext   string
+	Builder        string
+	Buildpacks     string
+	Dockerfile     string
+	PullRequestURL string
 }
 
 // ToPorterAppType generates an external types.PorterApp to be shared over REST
 func (a *PorterApp) ToPorterAppType() *types.PorterApp {
 	return &types.PorterApp{
-		ID:           a.ID,
-		ProjectID:    a.ProjectID,
-		ClusterID:    a.ClusterID,
-		Name:         a.Name,
-		ImageRepoURI: a.ImageRepoURI,
-		GitRepoID:    a.GitRepoID,
-		RepoName:     a.RepoName,
-		GitBranch:    a.GitBranch,
-		BuildContext: a.BuildContext,
-		Builder:      a.Builder,
-		Buildpacks:   a.Buildpacks,
-		Dockerfile:   a.Dockerfile,
+		ID:             a.ID,
+		ProjectID:      a.ProjectID,
+		ClusterID:      a.ClusterID,
+		Name:           a.Name,
+		ImageRepoURI:   a.ImageRepoURI,
+		GitRepoID:      a.GitRepoID,
+		RepoName:       a.RepoName,
+		GitBranch:      a.GitBranch,
+		BuildContext:   a.BuildContext,
+		Builder:        a.Builder,
+		Buildpacks:     a.Buildpacks,
+		Dockerfile:     a.Dockerfile,
+		PullRequestURL: a.PullRequestURL,
 	}
 }