change: add branches and pullrequests during org project creation (#276)

* add branches and pullrequests * textboxes for branches and prs * add tooltips * reduce spacing, add default indicator * fix pr/branches text * format tooltips as lists * cypress deployment tests * remove only * format * org project tests
uselagoon · Jul 4, 2024 · ef6950b · ef6950b
1 parent 2be4445
commit ef6950b
Show file tree

Hide file tree

Showing 9 changed files with 106 additions and 10 deletions.
diff --git a/cypress/e2e/organizations/overview.cy.ts b/cypress/e2e/organizations/overview.cy.ts
@@ -23,7 +23,7 @@ describe('Organization overview page', () => {
     overview.doQuotaFieldCheck();
   });
 
-  it.only('Changes org friendly name/description', () => {
+  it('Changes org friendly name/description', () => {
     registerIdleHandler('idle');
 
     overview.changeOrgFriendlyname(testData.organizations.overview.friendlyName);

diff --git a/cypress/e2e/rbac/developer.cy.ts b/cypress/e2e/rbac/developer.cy.ts
@@ -114,7 +114,7 @@ describe('DEVELOPER permission test suites', () => {
       environmentOverview.doDeleteEnvironmentError('main');
     });
 
-    it('Deletes stating environment', () => {
+    it('Deletes staging environment', () => {
       cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging`);
 
       cy.intercept('POST', Cypress.env('api'), req => {
@@ -147,7 +147,7 @@ describe('DEVELOPER permission test suites', () => {
     });
 
     it('Fails to cancel any deployment - no permission to CANCEL for DEVELOPER', () => {
-      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging/deployments`);
+      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-main/deployments`);
 
       registerIdleHandler('idle');
 

diff --git a/cypress/e2e/rbac/guest.cy.ts b/cypress/e2e/rbac/guest.cy.ts
@@ -146,7 +146,7 @@ describe('GUEST permission test suites', () => {
     });
 
     it('Fails to do cancel a deployment - no permission for GUEST', () => {
-      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging/deployments`);
+      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-main/deployments`);
       registerIdleHandler('idle');
 
       cy.intercept('POST', Cypress.env('api'), req => {

diff --git a/cypress/e2e/rbac/maintainer.cy.ts b/cypress/e2e/rbac/maintainer.cy.ts
@@ -136,7 +136,7 @@ describe('MAINTAINER permission test suites', () => {
       environmentOverview.doDeleteEnvironmentError('main');
     });
 
-    it('Deletes stating environment', () => {
+    it('Deletes staging environment', () => {
       cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging`);
 
       cy.intercept('POST', Cypress.env('api'), req => {
@@ -169,7 +169,7 @@ describe('MAINTAINER permission test suites', () => {
     });
 
     it('Cancels a staging deployment', () => {
-      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging/deployments`);
+      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-main/deployments`);
 
       registerIdleHandler('idle');
 

diff --git a/cypress/e2e/rbac/reporter.cy.ts b/cypress/e2e/rbac/reporter.cy.ts
@@ -143,7 +143,7 @@ describe('REPORTER permission test suites', () => {
     });
 
     it('Fails to do cancel a deployment - no permission for REPORTER', () => {
-      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-staging/deployments`);
+      cy.visit(`${Cypress.env('url')}/projects/lagoon-demo/lagoon-demo-main/deployments`);
 
       registerIdleHandler('idle');
 
@@ -168,6 +168,8 @@ describe('REPORTER permission test suites', () => {
       cy.waitForNetworkIdle('@idle', 500);
 
       deployment.navigateToRunningDeployment();
+
+      cy.waitForNetworkIdle('@idle', 500);
       deployment.doFailedCancelDeployment();
     });
   });

diff --git a/cypress/support/actions/organizations/ProjectsActions.ts b/cypress/support/actions/organizations/ProjectsActions.ts
@@ -17,7 +17,7 @@ export default class ProjectsActions {
 
     projects.selectTarget();
 
-    projects.getAddConfirm().click();
+    projects.getAddConfirm().click({ force: true });
 
     cy.wait('@gqladdProjectToOrganizationMutation');
 
@@ -32,7 +32,7 @@ export default class ProjectsActions {
 
     projects.selectTarget();
 
-    projects.getAddConfirm().click();
+    projects.getAddConfirm().click({ force: true });
 
     cy.wait('@gqladdProjectToOrganizationMutation').then(interception => {
       expect(interception.response?.statusCode).to.eq(200);

diff --git a/src/components/Organizations/NewProject/StyledNewProject.tsx b/src/components/Organizations/NewProject/StyledNewProject.tsx
@@ -20,6 +20,9 @@ export const StyledNewProject = styled.div`
 
   .form-box {
     margin-bottom: 1rem;
+    &.spacetop {
+      margin-top: 1rem;
+    }
   }
 
   .docs-link {

diff --git a/src/components/Organizations/NewProject/index.js b/src/components/Organizations/NewProject/index.js
@@ -72,6 +72,9 @@ const OrgNewProject = ({
   refresh,
 }) => {
   const [addUserToProject, setAddUserToProject] = React.useState(true);
+  const [pullRequests, setPullRequests] = React.useState('');
+  const [branches, setBranches] = React.useState('');
+
   return (
     <StyledNotificationWrapper>
       <div className="margins">
@@ -95,6 +98,8 @@ const OrgNewProject = ({
                   setProjectName({ target: { value: '' } });
                   setGitURL({ target: { value: '' } });
                   setProdEnv({ target: { value: '' } });
+                  setPullRequests('');
+                  setBranches('');
                   setSelectedDeployTarget({ target: { value: '' } });
                   closeModal();
                 });
@@ -174,6 +179,74 @@ const OrgNewProject = ({
                         />
                       </RoleSelect>
                     </label>
+
+                    <div className="form-box spacetop">
+                      <label>
+                        Branches{' '}
+                        <Tooltip
+                          overlayClassName="orgTooltip lg"
+                          title={
+                            <>
+                              <b>[Default: true]</b>
+                              <br />
+                              <span> Which branches should be deployed, can be one of:</span>
+                              <ul className="tooltiplist">
+                                <li>true - all branches are deployed </li>
+
+                                <li>false - no branches are deployed</li>
+
+                                <li>
+                                  regex of all branches that can be deployed (including production), example:
+                                  '^(main|staging)$'
+                                </li>
+                              </ul>
+                            </>
+                          }
+                          placement="right"
+                        >
+                          <InfoCircleOutlined style={{ fontSize: '1rem' }} />
+                        </Tooltip>
+                        <input
+                          type="text"
+                          placeholder="Branches"
+                          value={branches}
+                          onChange={({ target: { value } }) => setBranches(value)}
+                        />
+                      </label>
+                    </div>
+
+                    <div className="form-box">
+                      <label>
+                        Pull requests{' '}
+                        <Tooltip
+                          overlayClassName="orgTooltip lg"
+                          title={
+                            <>
+                              <b>[Default: true]</b>
+                              <br />
+                              <span> Which pull requests should be deployed, can be one of:</span>
+                              <ul className="tooltiplist">
+                                <li>true - all pull requests are deployed </li>
+
+                                <li>false - no pull requests are deployed</li>
+
+                                <li>regex of all Pull Request titles that can be deployed, example: '[BUILD]'</li>
+                              </ul>
+                            </>
+                          }
+                          placement="right"
+                        >
+                          <InfoCircleOutlined style={{ fontSize: '1rem' }} />
+                        </Tooltip>
+                        <input
+                          placeholder="Pull requests"
+                          type="text"
+                          value={pullRequests}
+                          onChange={({ target: { value } }) => setPullRequests(value)}
+                        />
+                      </label>
+                    </div>
+
                     <Checkbox>
                       <input
                         type="checkbox"
@@ -182,6 +255,7 @@ const OrgNewProject = ({
                       />
                       <span>Add my user to this project</span>
                     </Checkbox>
+
                     <div className="docs-link">
                       <div className="info-icon">
                         <Image src={info} alt="" />
@@ -219,7 +293,7 @@ const OrgNewProject = ({
                             inputGitURL.indexOf(' ') > 0 ||
                             inputProdEnv === '' ||
                             inputProdEnv.indexOf(' ') > 0 ||
-                            selectedDeployTarget === undefined
+                            selectedDeployTarget == undefined
                           }
                           action={() => {
                             addGroupProject({
@@ -230,6 +304,8 @@ const OrgNewProject = ({
                                 productionEnvironment: inputProdEnv,
                                 organization: parseInt(organizationId, 10),
                                 addOrgOwner: addUserToProject,
+                                ...(pullRequests ? { pullRequests } : {}),
+                                ...(branches ? { branches } : {}),
                               },
                             });
                           }}

diff --git a/src/layouts/GlobalStyles/index.tsx b/src/layouts/GlobalStyles/index.tsx
@@ -41,6 +41,21 @@ body {
   .ant-tooltip-content .ant-tooltip-inner{
   color: ${props => (props.theme.colorScheme === 'dark' ? '#000' : '#fff')};
   background: ${props => (props.theme.colorScheme === 'dark' ? '#fff' : '#000')};
+
+  .tooltiplist{
+    margin-left: 0.812rem;
+    li{
+      margin-bottom: initial;
+      padding-left: 0;
+      list-style: disc;
+    }
+  }
+  }
+  &.lg{
+      .ant-tooltip-content{
+        width:max-content;
+      }
+
   }
 }
 .componentTooltip {