Feature/approve org requests

.travis.yml

@@ -9,7 +9,7 @@ jdk:
   - oraclejdk8
 env:
   global:
-    - WEBSERVICE_VERSION="1.6.0-alpha.3"
+    - WEBSERVICE_VERSION="1.6.0-alpha.4"
 addons:
   firefox: "latest"
   postgresql: "9.6"

cypress/integration/group1/dropdown.ts

@@ -13,11 +13,11 @@
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-import { setTokenUserViewPort } from '../../support/commands';
+import { setTokenUserViewPortCurator } from '../../support/commands';
 
 describe('Dropdown test', () => {
   // TODO: GitLab tests are commented out
-  setTokenUserViewPort();
+  setTokenUserViewPortCurator();
 
   beforeEach(() => {
     cy
@@ -27,6 +27,7 @@ describe('Dropdown test', () => {
         url: /extended/,
         response: { 'canChangeUsername': true }
       });
+
     cy.visit('');
 
     // Select dropdown
@@ -65,6 +66,121 @@ describe('Dropdown test', () => {
       everythingOk();
     });
   });
+
+  describe('Go to requests page', ()  => {
+
+    beforeEach(() => {
+      // Pending orgs starts with two
+      const pendingOrganizations = [
+        { id: 1000, name: 'OrgOne', status: 'PENDING' },
+        { id: 1001, name: 'OrgTwo', status: 'PENDING' }
+      ];
+
+      cy
+        .server()
+        .route({
+          method: 'GET',
+          url: '/organisations/all?type=pending',
+          response: pendingOrganizations
+        });
+
+      // Logged in user has two memberships, one is not accepted
+      const memberships = [
+        {id: 1, role: 'MAINTAINER', accepted: false, organisation: { id: 1000, status: 'PENDING', name: 'orgOne'}},
+        {id: 2, role: 'MAINTAINER', accepted: true, organisation: { id: 1001, status: 'PENDING', name: 'orgTwo'}}
+      ];
+      cy
+        .server()
+        .route({
+          method: 'GET',
+          url: '/users/user/memberships',
+          response: memberships
+      });
+      // Choose dropdown
+      cy
+        .get('#dropdown-accounts')
+        .click();
+      cy.contains('Requests').click();
+    });
+
+    it('Should have two pending orgs', () => {
+      // Endpoint should return only one pending organisation after approval
+      const pendingOrganizations = [{ id: 1001, name: 'OrgTwo', status: 'PENDING' }];
+      cy
+        .server()
+        .route({
+          method: 'GET',
+          url: '/organisations/all?type=pending',
+          response: pendingOrganizations
+        });
+
+      // Stub approve response
+      cy
+      .server()
+      .route({
+        method: 'POST',
+        url: '/organisations/1000/approve',
+        response: []
+      });
+
+      // Ensure that there are two orgs
+      cy.get('#pending-org-card-0').should('be.visible');
+      cy.get('#pending-org-card-1').should('be.visible');
+
+      // Accept first org
+      cy.get('#reject-pending-org-0').should('be.visible');
+      cy.get('#approve-pending-org-0').should('be.visible').click();
+      cy.get('#approve-pending-org-dialog').should('be.visible').click();
+
+      // Ensure that only one org exists now
+      cy.get('#pending-org-card-0').should('be.visible');
+      cy.get('#pending-org-card-1').should('not.be.visible');
+    });
+
+    it('Should have a pending invite', () => {
+      // Stub the accept invite response
+      cy
+        .server()
+        .route({
+          method: 'POST',
+          url: '/organisations/1000/invitation?accept=true',
+          response: []
+      });
+
+      // Membership should have two accepted entries
+      const memberships = [
+        { id: 1, role: 'MAINTAINER', accepted: true, organisation: { id: 1000, status: 'PENDING',  name: 'orgOne' }},
+        { id: 2, role: 'MAINTAINER', accepted: true, organisation: { id: 1001, status: 'PENDING', name: 'orgTwo' }}
+      ];
+      cy
+        .server()
+        .route({
+          method: 'GET',
+          url: '/users/user/memberships',
+          response: memberships
+      });
+
+      // One invite should be visible
+      cy.get('#my-org-invites-card-0').should('be.visible');
+
+      // Accept org invite
+      cy.get('#reject-invite-org-0').should('be.visible');
+      cy.get('#accept-invite-org-0').should('be.visible').click();
+      cy.get('#accept-pending-org-dialog').should('be.visible').click();
+
+      // Should have two orgs in pending list
+      cy.get('#my-pending-org-card-0').should('be.visible');
+      cy.get('#my-pending-org-card-1').should('be.visible');
+    });
+
+    it('Should have a pending org request', () => {
+     // One pending org request should be visible
+     cy.get('#my-pending-org-card-0').should('be.visible');
+    });
+
+
+  });
+
   describe('Go to enabled Dockstore Account Controls', () => {
     beforeEach(() => {
       // Select dropdown accounts
@@ -85,7 +201,7 @@ describe('Dropdown test', () => {
       cy.contains('Yes, delete my account').should('be.disabled');
       cy.get('#deleteUserUsernameInput').type('potato');
       cy.contains('Yes, delete my account').should('be.disabled');
-      cy.get('#deleteUserUsernameInput').clear().type('user_A');
+      cy.get('#deleteUserUsernameInput').clear().type('user_curator');
       cy.contains('Yes, delete my account').should('not.be.disabled').click();
       cy.url().should('eq', Cypress.config().baseUrl + '/login');
     });

cypress/support/commands.ts

@@ -45,6 +45,16 @@ export function setTokenUserViewPort() {
     localStorage.setItem('ng2-ui-auth_token', 'imamafakedockstoretoken');
   });
 }
+
+export function setTokenUserViewPortCurator() {
+  beforeEach(() => {
+    // Login by adding user obj and token to local storage
+    localStorage.setItem('dockstore.ui.userObj',
+    '{\"id\": 4, \"username\": \"user_curator\", \"isAdmin\": \"false\", \"name\": \"user_curator\", \"curator\": \"true\"}');
+    localStorage.setItem('ng2-ui-auth_token', 'imamafakedockstoretoken2');
+  });
+}
+
 export function goToUnexpandedSidebarEntry(organization: string, repo: (RegExp | string)) {
   // This is needed because of a possible defect in the implementation.
   // All expansion panels are shown before any of them are expanded (after some logic of choosing which to expanded).

src/app/app.module.ts

@@ -98,6 +98,7 @@ import { StargazersModule } from './stargazers/stargazers.module';
 import { StarredEntriesComponent } from './starredentries/starredentries.component';
 import { StarringModule } from './starring/starring.module';
 import { SitemapComponent } from './sitemap/sitemap.component';
+import { RequestsModule } from './loginComponents/requests.module';
 
 export const myCustomTooltipDefaults: MatTooltipDefaultOptions = {
   showDelay: 500,
@@ -164,7 +165,8 @@ export const myCustomSnackbarDefaults: MatSnackBarConfig = {
     SearchModule,
     ApiModule.forRoot(getApiConfig),
     CustomMaterialModule,
-    RefreshAlertModule
+    RefreshAlertModule,
+    RequestsModule
   ],
   providers: [
     AccountsService,

src/app/loginComponents/accounts/accounts.component.html

@@ -15,5 +15,8 @@
         <app-controls></app-controls>
       </ng-template>
     </mat-tab>
+    <mat-tab label="Requests">
+      <requests></requests>
+    </mat-tab>
   </mat-tab-group>
 </div>

src/app/loginComponents/requests.module.ts

@@ -0,0 +1,26 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RequestsComponent, OrganizationRequestConfirmDialogComponent,
+  OrganizationInviteConfirmDialogComponent } from './requests/requests.component';
+import { CustomMaterialModule } from './../shared/modules/material.module';
+import { RouterModule } from '@angular/router';
+import { FlexLayoutModule } from '@angular/flex-layout';
+@NgModule({
+  imports: [
+    CommonModule,
+    CustomMaterialModule,
+    RouterModule,
+    FlexLayoutModule
+  ],
+  declarations: [
+    RequestsComponent,
+    OrganizationRequestConfirmDialogComponent,
+    OrganizationInviteConfirmDialogComponent
+  ], exports: [
+    RequestsComponent,
+    OrganizationRequestConfirmDialogComponent,
+    OrganizationInviteConfirmDialogComponent
+  ], entryComponents: [ OrganizationRequestConfirmDialogComponent,
+    OrganizationInviteConfirmDialogComponent],
+})
+export class RequestsModule { }

src/app/loginComponents/requests/organization-invite-confirm-dialog.html

@@ -0,0 +1,15 @@
+<h1 mat-dialog-title>{{data.approve ? 'Accept' : 'Decline'}} Invite to {{data.name}}</h1>
+
+<div mat-dialog-content>
+  <p>Are you sure you want to <strong>{{data.approve ? 'accept' : 'decline'}}</strong> the organization invite from <strong>{{data.name}}</strong>?</p>
+</div>
+<div mat-dialog-actions>
+  <div fxFlex></div>
+  <button mat-button (click)="onNoClick()">No Thanks</button>
+  <span *ngIf="data.approve; else rejectBlock">
+    <button mat-flat-button id="accept-pending-org-dialog" [mat-dialog-close]="{ 'id': data.id, 'approve': data.approve }">Accept</button>
+  </span>
+  <ng-template #rejectBlock>
+    <button mat-flat-button id="reject-pending-org-dialog" [mat-dialog-close]="{ 'id': data.id, 'approve': data.approve }">Decline</button>
+  </ng-template>
+</div>

src/app/loginComponents/requests/organization-request-confirm-dialog.html

@@ -0,0 +1,15 @@
+<h1 mat-dialog-title>{{data.approve ? 'Approve' : 'Reject'}} Organization</h1>
+
+<div mat-dialog-content>
+  <p>Are you sure you want to <strong>{{data.approve ? 'approve' : 'reject'}}</strong> the organization <strong>{{data.name}}</strong>?</p>
+</div>
+<div mat-dialog-actions>
+  <div fxFlex></div>
+  <button mat-button (click)="onNoClick()">No Thanks</button>
+  <span *ngIf="data.approve; else rejectBlock">
+    <button mat-flat-button id="approve-pending-org-dialog" [mat-dialog-close]="{ 'id': data.id, 'approve': data.approve }">Approve</button>
+  </span>
+  <ng-template #rejectBlock>
+    <button mat-flat-button id="reject-pending-org-dialog" [mat-dialog-close]="{ 'id': data.id, 'approve': data.approve }">Reject</button>
+  </ng-template>
+</div>