#19: add revision info in manage my model

src/app/features/model-details/model-details.component.ts

@@ -260,7 +260,6 @@ export class ModelDetailsComponent implements OnInit {
       this.solutionId = params['solutionId'];
       this.revisionId = params['revisionId'];
       this.updateRating();
-
       this.getComments(this.solutionId, this.revisionId);
     });
   }
@@ -270,6 +269,7 @@ export class ModelDetailsComponent implements OnInit {
       (revision: PublicSolutionDetailsRevisionModel) => ({
         version: revision.version,
         revisionId: revision.revisionId,
+        onBoarded: revision.onboarded,
       }),
     );
   }
@@ -284,13 +284,11 @@ export class ModelDetailsComponent implements OnInit {
     this.sharedDataService.versionId = versionId;
   }
 
-  setRevisionInService(revision: {
-    version: string;
-    revisionId: string;
-  }): void {
+  setRevisionInService(revision: Revision): void {
     this.sharedDataService.selectedRevision = {
       version: revision.version,
       revisionId: revision.revisionId,
+      onBoarded: revision.onBoarded,
     };
   }
 
@@ -609,9 +607,8 @@ export class ModelDetailsComponent implements OnInit {
 
   OnlClickManageMyModel() {
     this.router.navigate([
-      '/dashboard/manageMyModel/solutionId',
+      '/dashboard/manageMyModel/',
       this.solutionId,
-      'revisionId',
       this.revisionId,
     ]);
   }

src/app/shared/components/model-management/model-management.component.html

 <mat-sidenav-container>
   <mat-sidenav mode="side" opened>
     <div class="workflow-left-header workflow-header">MANAGEMENT OPTIONS</div>
+    <div
+      style="
+        display: flex;
+        flex-direction: column !important;
+        justify-content: center !important;
+        margin-left: 16px;
+      "
+    >
+      <div>
+        <span class="tab-box" style="font-size: 14px">On - Boarding</span>
+      </div>
+      <div>
+        <span class="version-on-boarded" *ngIf="selectedRevision?.onBoarded"
+          >Completed on
+          {{ selectedRevision.onBoarded | date: "MM/dd/yyyy, h:mm:ss a" }}</span
+        >
+      </div>
+    </div>
     <nav mat-tab-nav-bar class="margin: 20px 0 20px 0;" [tabPanel]="tabPanel">
-      <a mat-tab-link routerLink="onBoarding" routerLinkActive="is-active">
-        <span
-          class="launcherimg managelefticon tabs-left"
-          [ngClass]="
-            isActive(
-              '/dashboard/manageMyModel/solutionId/' +
-                solutionId +
-                '/revisionId/' +
-                revisionId +
-                '/onBoarding'
-            )
-              ? 'launcherimg-active'
-              : 'launcherimg-inactive'
-          "
-        ></span
-        ><span class="tab-box" style="font-size: 14px">On - Boarding</span></a
-      >
       <a mat-tab-link routerLink="shareWithTeam" routerLinkActive="is-active">
         <mat-icon fontIcon="share"></mat-icon
         ><span
@@ -33,9 +34,8 @@
           class="managelefticon tabs-left authorsimg"
           [ngClass]="
             isActive(
-              '/dashboard/manageMyModel/solutionId/' +
+              '/dashboard/manageMyModel/' +
                 solutionId +
-                '/revisionId/' +
                 revisionId +
                 '/publisherAuthors'
             )
@@ -52,9 +52,8 @@
           class="managelefticon tabs-left companyimg"
           [ngClass]="
             isActive(
-              '/dashboard/manageMyModel/solutionId/' +
+              '/dashboard/manageMyModel/' +
                 solutionId +
-                '/revisionId/' +
                 revisionId +
                 '/publishModel'
             )
@@ -66,22 +65,6 @@
           >Publish to Marketplace</span
         ></a
       >
-      <a mat-tab-link routerLink="viewDownloads" routerLinkActive="is-active"
-        ><mat-icon fontIcon="file_download"></mat-icon
-        ><span
-          class="tab-box"
-          style="font-size: 14px; margin-left: 15px !important"
-          >View downloads</span
-        ></a
-      >
-      <a mat-tab-link routerLink="replyToComments" routerLinkActive="is-active"
-        ><mat-icon fontIcon="reply"></mat-icon
-        ><span
-          class="tab-box"
-          style="font-size: 14px; margin-left: 15px !important"
-          >Reply to Comments</span
-        ></a
-      >
       <a mat-tab-link routerLink="deleteModel" routerLinkActive="is-active"
         ><mat-icon fontIcon="delete"></mat-icon
         ><span

src/app/shared/components/model-management/model-management.component.scss

@@ -15,7 +15,7 @@ mat-sidenav {
 
 mat-sidenav-content {
   height: 87vh;
-  overflow: auto;
+  overflow: hidden;
 }
 ::ng-deep .mat-drawer-inner-container {
   overflow: hidden !important;
@@ -33,6 +33,7 @@ mat-sidenav-content {
   padding-left: 8px !important;
   padding-right: 0px !important;
   width: 100% !important;
+  color: #671c9d !important;
 }
 
 .is-active {
@@ -46,6 +47,15 @@ mat-sidenav-content {
   span {
     color: #671c9d !important;
   }
+
+  .version-on-boarded {
+    margin: 0 !important;
+    padding: 0 !important;
+    font-size: 12px !important;
+    font-weight: 500 !important;
+    line-height: 16px !important;
+    color: green !important;
+  }
   mat-icon {
     color: #671c9d !important;
   }
@@ -125,3 +135,16 @@ mat-sidenav-content {
   width: 35px;
   line-height: 48px;
 }
+
+.version-on-boarded {
+  margin: 0 !important;
+  padding: 0 !important;
+  font-size: 12px !important;
+  line-height: 16px !important;
+  color: green !important;
+}
+
+.tab-box {
+  color: #681d9e;
+  font-weight: 700 !important;
+}

src/app/shared/components/model-management/model-management.component.ts

@@ -4,6 +4,14 @@ import { MatSidenavModule } from '@angular/material/sidenav';
 import { MatTabsModule } from '@angular/material/tabs';
 import { MatIconModule } from '@angular/material/icon';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
+import {
+  PublicSolutionDetailsModel,
+  PublicSolutionDetailsRevisionModel,
+  Revision,
+} from '../../models';
+import { Subscription } from 'rxjs';
+import { SharedDataService } from 'src/app/core/services/shared-data/shared-data.service';
+import { PublicSolutionsService } from 'src/app/core/services/public-solutions.service';
 
 @Component({
   selector: 'gp-model-management',
@@ -21,27 +29,52 @@ import { ActivatedRoute, Router, RouterModule } from '@angular/router';
 export class ModelManagementComponent implements OnInit {
   solutionId!: string;
   revisionId!: string;
+  selectedRevision!: Revision;
+  selectedRevisionSubscription!: Subscription;
 
   constructor(
     private router: Router,
     private activatedRoute: ActivatedRoute,
+    private sharedDataService: SharedDataService,
+    private publicSolutionsService: PublicSolutionsService,
   ) {}
   ngOnInit(): void {
     this.activatedRoute.params.subscribe((params) => {
       this.solutionId = params['solutionId'];
       this.revisionId = params['revisionId'];
+      this.loadData(this.solutionId, this.revisionId);
     });
   }
 
   isActive(modelRoute: string): boolean {
-    /* console.log('solutionId', this.solutionId);
-    console.log('revisionId', this.revisionId);*/
-    console.log(
-      'isActive',
-      this.router.routerState.snapshot.url === modelRoute,
-    );
-    console.log('routerState', this.router.routerState.snapshot.url);
-    console.log('modelRoute', modelRoute);
     return this.router.routerState.snapshot.url === modelRoute;
   }
+
+  loadData(solutionId: string, revisionId: string) {
+    this.publicSolutionsService
+      .getSolutionDetails(solutionId, revisionId)
+      .subscribe((res) => {
+        const revisionsList = this.getRevisionsList(res);
+        this.selectedRevision = revisionsList[0];
+        this.setRevisionInService(this.selectedRevision);
+      });
+  }
+
+  getRevisionsList(solution: PublicSolutionDetailsModel): Revision[] {
+    return solution.revisions.map(
+      (revision: PublicSolutionDetailsRevisionModel) => ({
+        version: revision.version,
+        revisionId: revision.revisionId,
+        onBoarded: revision.onboarded,
+      }),
+    );
+  }
+
+  setRevisionInService(revision: Revision): void {
+    this.sharedDataService.selectedRevision = {
+      version: revision.version,
+      revisionId: revision.revisionId,
+      onBoarded: revision.onBoarded,
+    };
+  }
 }