Contributor Console Corporate CLA flow when there is a signed CLA Step 3

src/app/core/models/cla-manager.ts

@@ -0,0 +1,18 @@
+export class CLAManagerModel {
+    approved_on: Date;
+    cla_group_name: string;
+    email: string;
+    lf_username: string;
+    name: string;
+    organization_name: string;
+    organization_sfid: string;
+    project_id: string;
+    project_name: string;
+    project_sfid: string;
+    user_sfid: string;
+    hasChecked: boolean;
+}
+
+export class CLAManagersModel {
+    list: CLAManagerModel[];
+}

src/app/core/services/cla-contributor.service.ts

@@ -10,10 +10,10 @@ import { UserModel } from '../models/user';
 import { AlertService } from 'src/app/shared/services/alert.service';
 import { ActiveSignatureModel } from '../models/active-signature';
 import { IndividualRequestSignatureModel } from '../models/individual-request-signature';
-import { ProjectCompanySingatureModel } from '../models/project-company-signature';
 import { OrganizationModel, OrganizationListModel } from '../models/organization';
 import { InviteCompanyModel } from '../models/invite-company';
 import { AddCompanyModel } from '../models/add-company';
+import { CLAManagersModel } from '../models/cla-manager';
 
 @Injectable({
   providedIn: 'root'
@@ -62,26 +62,31 @@ export class ClaContributorService {
     return this.httpClient.post<any>(url, data);
   }
 
-  requestToBeOnCompanyApprovedList(companyId: string, projectId: string, data: any): Observable<any> {
-    const url = this.baseURL + 'v3/company/' + companyId + '/ccla-whitelist-requests/' + projectId;
-    return this.httpClient.post<any>(url, data);
+  getLastIndividualSignature(userId: string, projectId: string,): Observable<any> {
+    const url = this.baseURL + 'v2/user/' + userId + '/project/' + projectId + '/last-signature';
+    return this.httpClient.get<InviteCompanyModel>(url);
   }
 
   inviteManager(userLFID: string, data: any): Observable<InviteCompanyModel> {
     const url = this.v4BaseUrl + 'v4/user/' + userLFID + '/invite-company-admin';
     return this.httpClient.post<InviteCompanyModel>(url, data);
   }
 
-  getProjectCompanySignature(projectId: string, companyId: string): Observable<ProjectCompanySingatureModel> {
-    const url = this.baseURL + 'v3/signatures/project/' + projectId + '/company/' + companyId;
-    return this.httpClient.get<ProjectCompanySingatureModel>(url);
+  getProjectCLAManagers(projectId: string, companyId: string): Observable<CLAManagersModel> {
+    const url = this.v4BaseUrl + 'v4/company/' + companyId + '/cla-group/' + projectId + '/cla-managers';
+    return this.httpClient.get<CLAManagersModel>(url);
   }
 
   addCompany(userId: string, data: any): Observable<AddCompanyModel> {
     const url = this.v4BaseUrl + 'v4/user/' + userId + '/company';
     return this.httpClient.post<AddCompanyModel>(url, data);
   }
 
+  notifyCLAMangers(data: any): Observable<any> {
+    const url = this.v4BaseUrl + 'v4/notify-cla-managers';
+    return this.httpClient.post<any>(url, data);
+  }
+
   handleError(errorObj: any) {
     const errors = errorObj.error.errors;
     if (errors) {

src/app/modules/corporate-contributor/component/add-company-modal/add-company-modal.component.html

@@ -17,7 +17,7 @@
                             Organization name should be atleast 2 characters
                         </div>
                         <div [hidden]="!form.controls.companyName.errors.maxlength" class="error">
-                            Organization name should not be exceed 60 characters
+                            Organization name should not exceed 60 characters
                         </div>
                         <div [hidden]="!form.controls.companyName.errors.pattern" class="error">
                             Organization name is invalid
@@ -40,8 +40,12 @@
                         </div>
                         <div class="col info pad-left-5">
                             You will receive an email from the Linux Foundation with instructions on how to setup a
+<<<<<<< HEAD
+                            detailed profile for your company
+=======
                             detailed profile for your Organization
 
+>>>>>>> 056edc2eee323ce8525d1b781c94bd618ad11833
                         </div>
                     </div>
                 </div>

src/app/modules/corporate-contributor/container/cla-request-authorization/cla-request-authorization.component.html

@@ -15,26 +15,39 @@
                 </div>
 
                 <div class="col-12 body">
-
                     <div class="row justify-content-center align-items-center">
-                        <div class="col-8">
-                            <table>
-                                <tr class="header">
-                                    <th class="left-border">CLA Manager(s)</th>
-                                    <th class="right-border">Action</th>
-                                </tr>
-                                <tr class="table-border" *ngFor="let manager of managers;let i=index;">
-                                    <td>{{manager.username}}</td>
-                                    <td>
-                                        <span class="request"
-                                            (click)="onClickRequestAuthorization(successModal,manager)">Request
-                                            Authorization</span>
-                                    </td>
-                                </tr>
-                                <tr *ngIf="managers.length <=0">
-                                    <td colspan="2">{{claManagerError}}</td>
-                                </tr>
-                            </table>
+                        <div class="col-8 cla-managers-container">
+                            <div class="row justify-content-center align-items-center">
+                                <div class="col-12 header">CLA Manager(s) for your Organization
+                                </div>
+                                <div class="col-12 error" *ngIf="!managers.list">{{claManagerError}}</div>
+                                <div *ngIf="managers.list" class="col-12 manager-list">
+                                    <div class="item">
+                                        <app-checkbox [checked]="hasSelectAll" text="Select All"
+                                            (checkboxEmitter)="onClickSelectAll($event)">
+                                        </app-checkbox>
+                                    </div>
+                                    <div class="separator"></div>
+                                    <div class="scrollable">
+                                        <div *ngFor="let manager of managers.list" class="item">
+                                            <app-checkbox [checked]="manager.hasChecked" [text]="manager.name"
+                                                (checkboxEmitter)="onClickCheckbox($event,manager)">
+                                            </app-checkbox>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="col-12 buttons">
+                        <div class="row justify-content-center align-items-center">
+                            <div class="col-auto">
+                                <button tabindex="-1" type="button" class="btn active"
+                                    (click)="onClickRequestAuthorization(successModal)">
+                                    Request Authorization
+                                </button>
+                            </div>
                         </div>
                     </div>
 
@@ -46,7 +59,7 @@
                                 </button>
                             </div>
                             <div class="col-xs-6 col-sm-6 col-md-4 col-lg-3">
-                                <button tabindex="-1" type="button" class="btn active" (click)="exitEasyCLA()">
+                                <button tabindex="-1" type="button" class="btn" (click)="exitEasyCLA()">
                                     Exit EasyCLA
                                 </button>
                             </div>
@@ -71,11 +84,11 @@
                 <p class="col-11 success-message">{{message}}</p>
                 <div class="col-4">
                     <button tabindex="-1" type="button" class="success-btn" (click)="closeModal()">
-                       Go Back
+                        Go Back
                     </button>
                 </div>
             </div>
 
         </div>
     </div>
-</ng-template>
+</ng-template>

src/app/modules/corporate-contributor/container/cla-request-authorization/cla-request-authorization.component.scss

@@ -27,35 +27,40 @@
     color: #8492a6;
     padding: 25px;
 
-    table {
-      width: 100%;
-      tr {
+    .cla-managers-container {
+      border: 1px solid #bdbdbd;
+      border-radius: 10px;
+
+      .header {
+        font-size: 14px;
         height: 40px;
-        &.table-border {
-          border: 1px solid #bdbdbd;
+        background: #0099cc;
+        border: 0px solid #0099cc;
+        color: #ffffff;
+        border-radius: 5px;
+        text-align: left;
+        width: 100%;
+      }
+
+      .error {
+        padding: 10px 0 10px 14px;
+        text-align: left;
+        font-size: 12px;
+      }
+
+      .manager-list {
+        margin-bottom: 10px;
+        .separator {
+          border: 1px solid #e0e0e0;
+          margin-top: 10px;
+          width: 100%;
         }
-        th {
-          color: #fff;
-          background: #0099cc;
-          font-size: 14px;
-          font-weight: bold;
-          &.right-border {
-            border-top-right-radius: 10px;
-          }
-          &.left-border {
-            border-top-left-radius: 10px;
-          }
+        .item {
+          padding-top: 10px;
         }
-        td {
-          text-align: center;
-          color: #333333;
-          font-size: 12px;
-          .request {
-            cursor: pointer;
-            color: #0099cc;
-            text-decoration: underline;
-            font-weight: bold;
-          }
+        .scrollable {
+          height: 90px;
+          overflow-y: auto;
         }
       }
     }