Merge branch 'cbrelease-4.8.16.1' into ati-cti-mdo-enhancement

library/ws-widget/collection/src/lib/_common/certificate-dialog/certificate-dialog.component.html

@@ -8,7 +8,7 @@
     <mat-card-content class="certificate-img-content">
         <img #certificate [src]="url| pipeSafeSanitizer: 'url'" alt="Certificate" role="image" class="certificate-banner-image">
     </mat-card-content>
-    <mat-card-actions class="flex flex-row-reverse">
+    <mat-card-actions class="flex flex-row-reverse gap-4">
         <!-- <ws-widget-svg-to-pdf></ws-widget-svg-to-pdf> -->
         <a mat-button (click)="shareCert()" class="ws-mat-accent-border-active mat-accent btn-custom">
             <mat-icon class="mat-icon material-icons-outlined download_icon margin-right-xs">share</mat-icon>

library/ws-widget/collection/src/lib/_common/content-toc/app-toc-about/app-toc-about.component.html

@@ -202,7 +202,7 @@
         <ng-container *ngIf="!skeletonLoader">
             <div class="mat-subheading-1 font-bold">{{ 'apptocsinglepage.summary' | translate }}</div>
             <div [ngClass]="{'mob-desc-ellipsis': summary.ellipsis && isMobile, 'desc-ellipsis': summary.ellipsis && !isMobile}" #summaryElem>
-                <span class="mob-text">{{ handleCapitalize(content?.description) }}</span>
+                <span class="mob-text" [innerHtml]="handleCapitalize(content?.description)"></span>
                 <div class="ws-mat-default-text font-bold cursor-pointer text-sm" *ngIf="summary.viewLess" (click)="summary.ellipsis = !summary.ellipsis; summary.viewLess = !summary.viewLess">&nbsp;{{ 'apptocsinglepage.viewLess' | translate }}</div>
             </div>
             <div class="ws-mat-default-text font-bold text-sm" *ngIf="summary.ellipsis">
@@ -322,7 +322,7 @@
         <ws-widget-skeleton-loader [width]="'100%'" [height]="'72px'"
             [bindingClass]="'rounded'"></ws-widget-skeleton-loader>
     </ng-container>
-    <ng-container *ngIf="!skeletonLoader">
+    <ng-container *ngIf="!skeletonLoader && !forPreview">
         <div class="flex flex-col sm:flex-row items-center discussion-div">
             <div class="flex-1 forum-content">
                 <div class="flex flex-col sm:flex-row gap-5 items-center">

library/ws-widget/collection/src/lib/_common/content-toc/app-toc-about/app-toc-about.component.ts

@@ -257,6 +257,7 @@ export class AppTocAboutComponent implements OnInit, OnChanges, AfterViewInit, O
         }
       }
     }
+    this.forPreview = window.location.href.includes('/public/') || window.location.href.includes('&preview=true')
   }
 
   getSubThemes(): any[] {

library/ws-widget/collection/src/lib/_common/tips-for-learner/tips-for-learner-card/tips-for-learner-card.component.html

@@ -9,7 +9,7 @@ <h3>Tips for Learners</h3>
         <div class="ml-4 pl-2 view-more ws-mat-default-text ng-star-inserted">
             <a class="flex ws-mat-default-text items-center justify-center mat-body-1 cursor-pointer"
                 (click)="showAllTips()">
-                <span class="ws-mat-default-text">{{ 'msg.showAll' | translate }}</span>
+                <span class="ws-mat-default-text">{{ 'career.readMore' | translate }}</span>
                 <mat-icon class="ws-mat-default-text" color="accent" role="img"
                     aria-hidden="true">navigate_next</mat-icon>
             </a>
@@ -23,8 +23,8 @@ <h3>Tips for Learners</h3>
         <div class="tip-data">
             <p>{{randomlearnAdvisoryObj?.content}}</p>
         </div>
-        <div class="tip-count">
+        <!-- <div class="tip-count">
             {{randomlearnAdvisoryObj?.id}}/{{learnAdvisoryData?.length}}
-        </div>
+        </div> -->
     </div>
 </div>

library/ws-widget/collection/src/lib/_services/widget-content.service.ts

@@ -56,6 +56,8 @@ const API_END_POINTS = {
   CLAIM_KARMAPOINTS: '/apis/proxies/v8/claimkarmapoints',
   USER_KARMA_POINTS: '/apis/proxies/v8/user/totalkarmapoints',
   EXT_CONTENT_READ: (contentId: any) => `/apis/proxies/v8/cios/v1/content/read/${contentId}`,
+  EXT_USER_COURSE_ENROLL : (contentId: any) => `/apis/proxies/v8/cios-enroll/v1/readby/useridcourseid/${contentId}`,
+  EXT_CONTENT_EROLL: `/apis/proxies/v8/cios-enroll/v1/create`,
 }
 
 @Injectable({
@@ -441,6 +443,14 @@ export class WidgetContentService {
     return this.http.get<NsContent.IContent[]>(API_END_POINTS.EXT_CONTENT_READ(contentId))
   }
 
+  fetchExtUserContentEnroll(contentId: string) {
+    return this.http.get<any>(API_END_POINTS.EXT_USER_COURSE_ENROLL(contentId))
+  }
+
+  extContentEnroll (requestBody: any) {
+    return this.http.post<any>(`${API_END_POINTS.EXT_CONTENT_EROLL}`, requestBody)
+  }
+
   getCourseKarmaPoints(request: any) {
     return this.http.post<any>(API_END_POINTS.READ_COURSE_KARMAPOINTS, request)
   }

library/ws-widget/collection/src/lib/card-content-v2/card-content-v2.component.ts

@@ -379,10 +379,11 @@ export class CardContentV2Component extends WidgetBaseComponent
         id: certificateData.issuedCertificates[0].identifier,   // id of the certificate
         type: WsEvents.EnumInteractSubTypes.CERTIFICATE,
       })
-    if(certificateData.issuedCertificates.length > 0) {
+    if(certificateData && certificateData.issuedCertificates && certificateData.issuedCertificates.length && certificateData.issuedCertificates.length > 0) {
       this.downloadCertificateLoading = true
-      let certData: any = certificateData.issuedCertificates[0]
-      this.certificateService.downloadCertificate_v2(certData.identifier).subscribe((res: any)=>{
+      let certData: any = certificateData.issuedCertificates
+      certData.sort((a: any, b: any) => new Date(b.lastIssuedOn).getTime() - new Date(a.lastIssuedOn).getTime())
+      this.certificateService.downloadCertificate_v2(certData[0].identifier).subscribe((res: any)=>{
         this.downloadCertificateLoading = false
         const cet = res.result.printUri
         this.dialog.open(CertificateDialogComponent, {

library/ws-widget/collection/src/lib/grid-layout/grid-layout.component.ts

@@ -1,7 +1,7 @@
 import { HttpClient } from '@angular/common/http'
 import { Component, OnInit, Input, OnDestroy } from '@angular/core'
 import { NsWidgetResolver, WidgetBaseComponent } from '@sunbird-cb/resolver'
-import { ConfigurationsService, EventService, WsEvents  } from '@sunbird-cb/utils-v2'
+import { ConfigurationsService, EventService, WsEvents, NPSGridService  } from '@sunbird-cb/utils-v2'
 import { IUserProfileDetailsFromRegistry } from '@ws/app/src/lib/routes/user-profile/models/user-profile.model'
 import { Observable, Subscription } from 'rxjs'
 import { map } from 'rxjs/operators'
@@ -15,7 +15,6 @@ import {
 } from './grid-layout.model'
 // tslint:disable-next-line
 import _ from 'lodash'
-import { NPSGridService } from './nps-grid.service'
 
 const API_END_POINTS = {
   fetchProfileById: (id: string) => `/apis/proxies/v8/api/user/v2/read/${id}`,
@@ -45,7 +44,7 @@ export class GridLayoutComponent extends WidgetBaseComponent
   isNudgeOpen = true
 
   // NPS
-  updateTelemetryDataSubscription: Subscription | null = null
+  updateTelemetryDataSubscription: Subscription | any = null
   isNPSOpen = false
   ratingGiven: any
   onSuccessRating = false

package.json

@@ -53,7 +53,7 @@
         "@sunbird-cb/micro-surveys": "^2.0.17",
         "@sunbird-cb/rain-dashboards": "0.4.33",
         "@sunbird-cb/resolver-v2": "0.0.7",
-        "@sunbird-cb/utils-v2": "0.0.2",
+        "@sunbird-cb/utils-v2": "0.0.6",
         "@types/file-saver": "^2.0.1",
         "@types/uuid": "^8.3.1",
         "bootstrap": "5.1.2",

project/ws/app/src/lib/routes/app-toc/app-toc-routing.module.ts

@@ -15,6 +15,7 @@ import { AppTocHomeComponent } from './routes/app-toc-home/app-toc-home.componen
 import { AppTocSinglePageComponent as AppTocSinglePageRootComponent } from './routes/app-toc-single-page/app-toc-single-page.component'
 import { AppTocCiosHomeComponent } from './components/app-toc-cios-home/app-toc-cios-home.component'
 import { AppTocCiosResolverService } from './resolvers/app-toc-cios-resolver.service'
+import { AppTocCiosUserEnrollResolverService } from './resolvers/app-toc-cios-user-enroll-resolver.service'
 
 const routes: Routes = [
   {
@@ -102,6 +103,7 @@ const routes: Routes = [
     component: AppTocCiosHomeComponent,
     resolve: {
       extContent: AppTocCiosResolverService,
+      userEnrollContent: AppTocCiosUserEnrollResolverService,
     },
   },
 ]

project/ws/app/src/lib/routes/app-toc/components/app-toc-cios-home/app-toc-cios-home.component.html

@@ -154,13 +154,40 @@
         </ng-container>
 
         <div class="flex flex-col gap-4 p-5 border-bottom">
-            <ng-container *ngIf="extContentReadData?.redirectUrl">
-                <a class="flex action-button justify-center resume" target="_blank" [href]="redirectToContent(extContentReadData)">
+            <ng-container *ngIf="(userExtCourseEnroll | json) !== '{}'">
+                <div class="flex flex-row justify-end w-full ws-mat-black-text">
+                    <span class="mat-body-2  ws-mat-black-text">
+                        {{userExtCourseEnroll.progress}}%</span>
+                </div>
+                <ws-widget-content-progress [contentId]="userExtCourseEnroll.progress"
+                                            [progress]="userExtCourseEnroll.progress"
+                                            [progressType]="'percentage'" [customClassName]="'viewer-progress'">
+                                        </ws-widget-content-progress>
+              </ng-container>  
+            <ng-container *ngIf="(userExtCourseEnroll | json) === '{}'">
+                <button class="flex action-button justify-center flex-middle resume" type="button" (click)="enRollToExtCourse(extContentReadData?.contentId)">
+                  <ng-container >{{ 'apptochome.enroll' | translate }}
+                  </ng-container>
+                </button>
+              </ng-container>
+            <ng-container *ngIf="(userExtCourseEnroll | json) !== '{}' && extContentReadData?.redirectUrl">
+                <a class="flex action-button justify-center flex-middle resume" target="_blank" [href]="redirectToContent(extContentReadData)">
                   <ng-container >{{ 'apptochome.redirect' | translate }}
                     <mat-icon class="ml-2 ws-mat-white-text">open_in_new</mat-icon>
                   </ng-container>
                 </a>
               </ng-container>
+              <ng-container *ngIf="(userExtCourseEnroll | json) !== '{}' && userExtCourseEnroll.issued_certificates?.length > 0 
+                && userExtCourseEnroll.progress === 100">
+                <button class="flex action-button justify-center flex-middle resume" type="button" (click)="downloadCert()">
+                    <!-- <img src="fusion-assets/images/certificate-ico.svg" width="24" height="24"> -->
+                    <span>Certificate</span>
+                    <mat-icon  *ngIf="!downloadCertificateLoading" class="ml-2">arrow_downward</mat-icon>
+                    <div class="center flex flex-middle certificate-loader margin-left-s" *ngIf="downloadCertificateLoading">
+                        <mat-spinner strokeWidth="2" stroke="'white'" class="white-spinner" [diameter]="24"></mat-spinner>
+                      </div>
+                </button>
+            </ng-container> 
         </div>
         <div>
             <div class="flex flex-col kpi-values items-center gap-2" *ngIf="extContentReadData?.duration > 0">

project/ws/app/src/lib/routes/app-toc/components/app-toc-cios-home/app-toc-cios-home.component.scss

@@ -748,6 +748,10 @@ mat-divider {
 //   }
 // }
 
+.certificate-loader ::ng-deep .mat-progress-spinner circle, .mat-spinner circle {
+  stroke: #ffffff;
+}
+
 .cb-plan-wrap {
   opacity: 1;
   color: rgba(27,76,161,1);

project/ws/app/src/lib/routes/app-toc/components/app-toc-cios-home/app-toc-cios-home.component.ts

@@ -2,7 +2,11 @@ import { AfterViewInit, Component, ElementRef, HostListener, OnInit, ViewChild }
 import { ActivatedRoute } from '@angular/router'
 import { TranslateService } from '@ngx-translate/core'
 import { CommonMethodsService } from '@sunbird-cb/consumption'
-import { ConfigurationsService, MultilingualTranslationsService } from '@sunbird-cb/utils-v2'
+import { ConfigurationsService, MultilingualTranslationsService, WidgetContentService } from '@sunbird-cb/utils-v2'
+import { LoaderService } from '@ws/author/src/public-api'
+import { MatDialog, MatSnackBar } from '@angular/material'
+import { CertificateService } from '../../../certificate/services/certificate.service'
+import { CertificateDialogComponent } from '@sunbird-cb/collection/src/lib/_common/certificate-dialog/certificate-dialog.component'
 
 @Component({
   selector: 'ws-app-app-toc-cios-home',
@@ -12,6 +16,8 @@ import { ConfigurationsService, MultilingualTranslationsService } from '@sunbird
 export class AppTocCiosHomeComponent implements OnInit, AfterViewInit {
   skeletonLoader = true
   extContentReadData: any = {}
+  userExtCourseEnroll: any = {}
+  downloadCertificateLoading = false
 
   rcElem = {
     offSetTop: 0,
@@ -44,12 +50,20 @@ export class AppTocCiosHomeComponent implements OnInit, AfterViewInit {
               private translate: TranslateService,
               private configSvc: ConfigurationsService,
               private langtranslations: MultilingualTranslationsService,
+              private contentSvc: WidgetContentService,
+              private certSvc: CertificateService,
+              private dialog: MatDialog,
+              public loader: LoaderService,
+              public snackBar: MatSnackBar
   ) {
     this.route.data.subscribe((data: any) => {
       if (data && data.extContent && data.extContent.data && data.extContent.data.content) {
         this.extContentReadData = data.extContent.data.content
         this.skeletonLoader = false
       }
+      if (data && data.userEnrollContent && data.userEnrollContent.data && data.userEnrollContent.data.result) {
+        this.userExtCourseEnroll = data.userEnrollContent.data.result
+      }
     })
 
       if (localStorage.getItem('websiteLanguage')) {
@@ -84,4 +98,46 @@ export class AppTocCiosHomeComponent implements OnInit, AfterViewInit {
   replaceText(str: any, replaceTxt: any) {
     return str.replaceAll(replaceTxt, '')
   }
+
+  async enRollToExtCourse(contentId: any) {
+    this.loader.changeLoad.next(true)
+    const reqbody = {
+      courseId: contentId,
+    }
+    const enrollRes = await this.contentSvc.extContentEnroll(reqbody).toPromise().catch(_error => {})
+    if (enrollRes && enrollRes.result && Object.keys(enrollRes.result).length > 0) {
+      this.getUserContentEnroll(contentId)
+    } else {
+      this.loader.changeLoad.next(false)
+      this.snackBar.open('Unable to enroll to the content')
+    }
+  }
+
+  async getUserContentEnroll(contentId: any) {
+    const enrollRes = await this.contentSvc.fetchExtUserContentEnroll(contentId).toPromise().catch(_error => {})
+    if (enrollRes && enrollRes.result  && Object.keys(enrollRes.result).length > 0) {
+      this.userExtCourseEnroll = enrollRes.result
+      this.loader.changeLoad.next(false)
+      this.snackBar.open('Successfully enrolled to the content')
+    } else {
+      this.loader.changeLoad.next(false)
+      this.snackBar.open('Unable to get the enrolled details')
+    }
+  }
+
+  async downloadCert() {
+    this.downloadCertificateLoading = true
+    const certData = this.userExtCourseEnroll.issued_certificates
+    const certRes: any = await this.certSvc.downloadCertificate_v2(certData[0].identifier).toPromise().catch(_error => {})
+    if (certRes && Object.keys(certRes.result).length > 0) {
+      this.downloadCertificateLoading = false
+      this.dialog.open(CertificateDialogComponent, {
+        width: '1300px',
+        data: { cet: certRes.result.printUri , certId: certData[0].identifier },
+      })
+    } else {
+      this.downloadCertificateLoading = false
+      this.snackBar.open('Unable to get the certificate. Try again after sometime.')
+    }
+  }
 }

project/ws/app/src/lib/routes/app-toc/components/app-toc-home/app-toc-home.component.html

@@ -219,8 +219,8 @@
       <!-- INVITE ONLY STANDALONE ASSESSMENT block-->      
       <ng-container
         *ngIf="content?.primaryCategory === primaryCategory.STANDALONE_ASSESSMENT && !batchData?.enrolled && !enrollBtnLoading && content?.courseCategory === 'Invite-Only Assessment'">
-        
-          <ng-container *ngIf="!forPreview || isInIFrame; else authView" i18n>
+
+          <ng-container *ngIf="!forPreview || isInIFrame; else authViewForInviteOnlyAssessment" i18n>
             <span class="font-bold shadow-lg text-info-div" i18n>{{ 'apptochome.youAreNotInvitedForAssessment' | translate }} </span>
           </ng-container>
       </ng-container>
@@ -668,3 +668,12 @@
 </ng-template>
 
 <ng-template #authView i18n>{{'apptochome.view' | translate}}</ng-template>
+<ng-template #authViewForInviteOnlyAssessment i18n>
+  <ng-container
+        *ngIf="forPreview && content?.courseCategory === 'Invite-Only Assessment'">        
+        <a class="flex action-button justify-center resume" [routerLink]="firstResourceLink?.url"
+          [queryParams]="(resumeData && !certData) ? generateQuery('RESUME') : generateQuery('START')">          
+          <ng-container>{{ 'apptochome.takeTest' | translate }}</ng-container>
+        </a>
+      </ng-container>
+</ng-template>