|
|
@@ -17,7 +17,6 @@ import Error from "components/porter/Error";
|
|
|
import Container from "components/porter/Container";
|
|
|
import Checkbox from "components/porter/Checkbox";
|
|
|
|
|
|
-
|
|
|
type Props = RouteComponentProps & {
|
|
|
closeModal: () => void;
|
|
|
githubAppInstallationID?: number;
|
|
|
@@ -30,7 +29,7 @@ type Props = RouteComponentProps & {
|
|
|
deployPorterApp?: () => Promise<boolean>;
|
|
|
deploymentError?: string;
|
|
|
porterYamlPath?: string;
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
type Choice = "open_pr" | "copy";
|
|
|
|
|
|
@@ -53,9 +52,26 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
const [isChecked, setIsChecked] = React.useState<boolean>(false);
|
|
|
|
|
|
const submit = async () => {
|
|
|
- if (githubAppInstallationID && githubRepoOwner && githubRepoName && branch && stackName && projectId && clusterId) {
|
|
|
+ console.log(
|
|
|
+ githubAppInstallationID,
|
|
|
+ githubRepoOwner,
|
|
|
+ githubRepoName,
|
|
|
+ branch,
|
|
|
+ stackName,
|
|
|
+ projectId,
|
|
|
+ clusterId
|
|
|
+ );
|
|
|
+ if (
|
|
|
+ githubAppInstallationID &&
|
|
|
+ githubRepoOwner &&
|
|
|
+ githubRepoName &&
|
|
|
+ branch &&
|
|
|
+ stackName &&
|
|
|
+ projectId &&
|
|
|
+ clusterId
|
|
|
+ ) {
|
|
|
try {
|
|
|
- setLoading(true)
|
|
|
+ setLoading(true);
|
|
|
// this creates the dummy chart
|
|
|
var success = true;
|
|
|
if (deployPorterApp) {
|
|
|
@@ -71,7 +87,7 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
github_repo_owner: githubRepoOwner,
|
|
|
github_repo_name: githubRepoName,
|
|
|
branch,
|
|
|
- open_pr: (choice === "open_pr" || isChecked),
|
|
|
+ open_pr: choice === "open_pr" || isChecked,
|
|
|
porter_yaml_path: porterYamlPath,
|
|
|
},
|
|
|
{
|
|
|
@@ -89,37 +105,47 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
props.history.push(`/apps/${stackName}`);
|
|
|
}
|
|
|
} catch (error) {
|
|
|
- console.log(error)
|
|
|
+ console.log(error);
|
|
|
} finally {
|
|
|
- setLoading(false)
|
|
|
+ setLoading(false);
|
|
|
}
|
|
|
} else {
|
|
|
console.log("missing information");
|
|
|
}
|
|
|
- }
|
|
|
+ };
|
|
|
return (
|
|
|
<Modal closeModal={closeModal}>
|
|
|
- <Text size={16}>
|
|
|
- Continuous Integration (CI) with GitHub Actions
|
|
|
- </Text>
|
|
|
+ <Text size={16}>Continuous Integration (CI) with GitHub Actions</Text>
|
|
|
<Spacer height="15px" />
|
|
|
<Text color="helper">
|
|
|
- In order to automatically update your services every time new code is pushed to your GitHub branch, the following file must exist in your GitHub repository:
|
|
|
+ In order to automatically update your services every time new code is
|
|
|
+ pushed to your GitHub branch, the following file must exist in your
|
|
|
+ GitHub repository:
|
|
|
</Text>
|
|
|
<Spacer y={0.5} />
|
|
|
<ExpandableSection
|
|
|
noWrapper
|
|
|
expandText="[+] Show code"
|
|
|
collapseText="[-] Hide code"
|
|
|
- Header={
|
|
|
- <ModalHeader>.github/workflows/porter.yml</ModalHeader>
|
|
|
- }
|
|
|
+ Header={<ModalHeader>.github/workflows/porter.yml</ModalHeader>}
|
|
|
isInitiallyExpanded
|
|
|
spaced
|
|
|
- copy={getGithubAction(projectId, clusterId, stackName, branch, porterYamlPath)}
|
|
|
+ copy={getGithubAction(
|
|
|
+ projectId,
|
|
|
+ clusterId,
|
|
|
+ stackName,
|
|
|
+ branch,
|
|
|
+ porterYamlPath
|
|
|
+ )}
|
|
|
ExpandedSection={
|
|
|
<YamlEditor
|
|
|
- value={getGithubAction(projectId, clusterId, stackName, branch, porterYamlPath)}
|
|
|
+ value={getGithubAction(
|
|
|
+ projectId,
|
|
|
+ clusterId,
|
|
|
+ stackName,
|
|
|
+ branch,
|
|
|
+ porterYamlPath
|
|
|
+ )}
|
|
|
readOnly={true}
|
|
|
height="300px"
|
|
|
/>
|
|
|
@@ -127,15 +153,25 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
/>
|
|
|
<Spacer y={1} />
|
|
|
<Text color="helper">
|
|
|
- Porter can open a PR for you to approve and merge this file into your repository, or you can add it yourself. If you allow Porter to open a PR, you will be redirected to the PR in a new tab after submitting below.
|
|
|
+ Porter can open a PR for you to approve and merge this file into your
|
|
|
+ repository, or you can add it yourself. If you allow Porter to open a
|
|
|
+ PR, you will be redirected to the PR in a new tab after submitting
|
|
|
+ below.
|
|
|
</Text>
|
|
|
<Spacer y={1} />
|
|
|
{deployPorterApp ? (
|
|
|
<>
|
|
|
<Select
|
|
|
options={[
|
|
|
- { label: "I authorize Porter to open a PR on my behalf (recommended)", value: "open_pr" },
|
|
|
- { label: "I will copy the file into my repository myself", value: "copy" },
|
|
|
+ {
|
|
|
+ label:
|
|
|
+ "I authorize Porter to open a PR on my behalf (recommended)",
|
|
|
+ value: "open_pr",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "I will copy the file into my repository myself",
|
|
|
+ value: "copy",
|
|
|
+ },
|
|
|
]}
|
|
|
setValue={(x: string) => setChoice(x as Choice)}
|
|
|
width="100%"
|
|
|
@@ -145,9 +181,13 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
onClick={submit}
|
|
|
width={"110px"}
|
|
|
loadingText={"Submitting..."}
|
|
|
- status={loading ? "loading" : deploymentError ? (
|
|
|
- <Error message={deploymentError} />
|
|
|
- ) : undefined}
|
|
|
+ status={
|
|
|
+ loading ? (
|
|
|
+ "loading"
|
|
|
+ ) : deploymentError ? (
|
|
|
+ <Error message={deploymentError} />
|
|
|
+ ) : undefined
|
|
|
+ }
|
|
|
>
|
|
|
Deploy app
|
|
|
</Button>
|
|
|
@@ -158,26 +198,28 @@ const GithubActionModal: React.FC<Props> = ({
|
|
|
checked={isChecked}
|
|
|
toggleChecked={() => setIsChecked(!isChecked)}
|
|
|
>
|
|
|
- <Text>
|
|
|
- I authorize Porter to open a PR on my behalf
|
|
|
- </Text>
|
|
|
+ <Text>I authorize Porter to open a PR on my behalf</Text>
|
|
|
</Checkbox>
|
|
|
<Spacer y={1} />
|
|
|
<Button
|
|
|
disabled={!isChecked}
|
|
|
onClick={submit}
|
|
|
loadingText={"Submitting..."}
|
|
|
- status={loading ? "loading" : deploymentError ? (
|
|
|
- <Error message={deploymentError} />
|
|
|
- ) : undefined}
|
|
|
+ status={
|
|
|
+ loading ? (
|
|
|
+ "loading"
|
|
|
+ ) : deploymentError ? (
|
|
|
+ <Error message={deploymentError} />
|
|
|
+ ) : undefined
|
|
|
+ }
|
|
|
>
|
|
|
Open a PR for me
|
|
|
</Button>
|
|
|
</>
|
|
|
)}
|
|
|
</Modal>
|
|
|
- )
|
|
|
-}
|
|
|
+ );
|
|
|
+};
|
|
|
|
|
|
export default withRouter(GithubActionModal);
|
|
|
|
|
|
@@ -193,4 +235,4 @@ const ModalHeader = styled.div`
|
|
|
height: 40px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
-`;
|
|
|
+`;
|