@sunbird-cb/consumption 0.0.35 → 0.0.37

package/fesm5/sunbird-cb-consumption.js

@@ -4185,6 +4185,7 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
         this.fetchAllBookMarkData(strip, calculateParentStatus);
         this.fetchAllPlaylistSearch(strip, calculateParentStatus);
         this.fetchPlaylistReadData(strip, calculateParentStatus);
+        this.fetchCiosContentData(strip, calculateParentStatus);
         // this.enrollInterval = setInterval(() => {
         //   this.fetchAllCbpPlans(strip, calculateParentStatus)
         // },                                1000)
@@ -4921,7 +4922,8 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
                 (strip.request.featureContent && Object.keys(strip.request.featureContent).length) ||
                 (strip.request.bookmarkRead && Object.keys(strip.request.bookmarkRead).length) ||
                 (strip.request.playlistSearch && Object.keys(strip.request.playlistSearch).length) ||
-                (strip.request.playlistRead && Object.keys(strip.request.playlistRead).length))) {
+                (strip.request.playlistRead && Object.keys(strip.request.playlistRead).length) ||
+                (strip.request.ciosContent && Object.keys(strip.request.ciosContent).length))) {
             return true;
         }
         return false;
@@ -5549,10 +5551,8 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
      */
     function (strip, request, apiUrl, calculateParentStatus) {
         return __awaiter(this, void 0, void 0, function () {
-            var originalFilters;
             var _this = this;
             return __generator(this, function (_a) {
-                originalFilters = [];
                 return [2 /*return*/, new Promise((/**
                      * @param {?} resolve
                      * @param {?} reject
@@ -5565,25 +5565,53 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
                              * @return {?}
                              */
                             function (results) {
-                                /** @type {?} */
-                                var showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
-                                /** @type {?} */
-                                var viewMoreUrl = showViewMore
-                                    ? {
+                                debugger;
+                                if (results.result && results.result.content) {
+                                    /** @type {?} */
+                                    var showViewMore = Boolean(results.result.content && results.result.content.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                                    /** @type {?} */
+                                    var viewMoreUrl = showViewMore
+                                        ? {
+                                            path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
+                                            queryParams: {
+                                                tab: 'Learn',
+                                                q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
+                                                f: {},
+                                            },
+                                        }
+                                        : null;
+                                    resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                }
+                                else if (results && results.data) {
+                                    /** @type {?} */
+                                    var showViewMore = Boolean(results.data && results.data.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                                    /** @type {?} */
+                                    var viewMoreUrl = showViewMore ? {
                                         path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
                                         queryParams: {
                                             tab: 'Learn',
                                             q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
-                                            f: request &&
-                                                request.searchV6 &&
-                                                request.searchV6.request &&
-                                                request.searchV6.request.filters
-                                                ? JSON.stringify(_this.transformSearchV6FiltersV2(originalFilters))
-                                                : {},
+                                            f: {},
                                         },
                                     }
-                                    : null;
-                                resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                        : null;
+                                    resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                }
+                                else if (results.result && results.result.data) {
+                                    /** @type {?} */
+                                    var showViewMore = Boolean(results.data && results.result.data && results.result.data.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
+                                    /** @type {?} */
+                                    var viewMoreUrl = showViewMore ? {
+                                        path: strip.viewMoreUrl && strip.viewMoreUrl.path || '',
+                                        queryParams: {
+                                            tab: 'Learn',
+                                            q: strip.viewMoreUrl && strip.viewMoreUrl.queryParams,
+                                            f: {},
+                                        },
+                                    }
+                                        : null;
+                                    resolve({ results: results, viewMoreUrl: viewMoreUrl });
+                                }
                             }), (/**
                              * @param {?} error
                              * @return {?}
@@ -5629,7 +5657,6 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
                              * @return {?}
                              */
                             function (results) {
-                                console.log(results, 'results=========');
                                 /** @type {?} */
                                 var showViewMore = Boolean(results.result.data && results.result.data.orgList.length > 5 && strip.stripConfig && strip.stripConfig.postCardForSearch);
                                 /** @type {?} */
@@ -5739,7 +5766,6 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
                         return [4 /*yield*/, this.getRequestMethod(strip, strip.request.bookmarkRead, strip.request.apiUrl, calculateParentStatus)];
                     case 2:
                         response = _a.sent();
-                        console.log('calling  after - response, ', response);
                         content = response.results.result.data.orgList;
                         if (response) {
                             this.processStrip(strip, this.transformAllContentsToWidgets(content, strip), 'done', calculateParentStatus, response);
@@ -5891,7 +5917,6 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
                         return [4 /*yield*/, this.getRequestMethod(strip, strip.request.playlistRead, strip.request.apiUrl, calculateParentStatus)];
                     case 2:
                         response = _a.sent();
-                        console.log('calling  after - response, ', response);
                         if (response && response.results.result.content) {
                             content = response.results.result.content;
                             this.processStrip(strip, this.transformAllContentsToWidgets(content, strip), 'done', calculateParentStatus, response);
@@ -5910,6 +5935,68 @@ var ContentStripWithTabsLibComponent = /** @class */ (function (_super) {
             });
         });
     };
+    /**
+     * @param {?} strip
+     * @param {?=} calculateParentStatus
+     * @return {?}
+     */
+    ContentStripWithTabsLibComponent.prototype.fetchCiosContentData = /**
+     * @param {?} strip
+     * @param {?=} calculateParentStatus
+     * @return {?}
+     */
+    function (strip, calculateParentStatus) {
+        if (calculateParentStatus === void 0) { calculateParentStatus = true; }
+        return __awaiter(this, void 0, void 0, function () {
+            var originalFilters, response, extContentData, error_10;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        if (!(strip.request && strip.request.ciosContent && Object.keys(strip.request.ciosContent).length)) return [3 /*break*/, 4];
+                        originalFilters = [];
+                        if (strip.request &&
+                            strip.request.ciosContent &&
+                            strip.request.ciosContent.filterCriteriaMap) {
+                            originalFilters = strip.request.ciosContent.filterCriteriaMap;
+                            strip.request.ciosContent.filterCriteriaMap = this.postMethodFilters(strip.request.ciosContent.filterCriteriaMap);
+                        }
+                        _a.label = 1;
+                    case 1:
+                        _a.trys.push([1, 3, , 4]);
+                        return [4 /*yield*/, this.postRequestMethod(strip, strip.request.ciosContent, strip.request.apiUrl, calculateParentStatus)];
+                    case 2:
+                        response = _a.sent();
+                        // console.log('calling  after - response, ', response)
+                        if (response && response.results) {
+                            // console.log('calling  after-- ')
+                            if (response.results.data && response.results.data.length) {
+                                extContentData = response.results.data;
+                                if (extContentData.length) {
+                                    this.processStrip(strip, this.transformContentsToWidgets(extContentData, strip), 'done', calculateParentStatus, response.viewMoreUrl);
+                                }
+                                else {
+                                    this.emptyResponse.emit(true);
+                                }
+                            }
+                            else {
+                                this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                                this.emptyResponse.emit(true);
+                            }
+                        }
+                        else {
+                            this.processStrip(strip, [], 'error', calculateParentStatus, null);
+                            this.emptyResponse.emit(true);
+                        }
+                        return [3 /*break*/, 4];
+                    case 3:
+                        error_10 = _a.sent();
+                        this.emptyResponse.emit(true);
+                        return [3 /*break*/, 4];
+                    case 4: return [2 /*return*/];
+                }
+            });
+        });
+    };
     ContentStripWithTabsLibComponent.decorators = [
         { type: Component, args: [{
                     selector: 'sb-uic-content-strip-with-tabs',
@@ -7387,6 +7474,35 @@ var CommonMethodsService = /** @class */ (function () {
             },
         }); }));
     };
+    /**
+     * @param {?} str
+     * @param {?=} type
+     * @return {?}
+     */
+    CommonMethodsService.prototype.handleCapitalize = /**
+     * @param {?} str
+     * @param {?=} type
+     * @return {?}
+     */
+    function (str, type) {
+        /** @type {?} */
+        var returnValue = '';
+        if (str) {
+            if (type === 'name') {
+                returnValue = str.split(' ').map((/**
+                 * @param {?} _str
+                 * @return {?}
+                 */
+                function (_str) {
+                    return _str.charAt(0).toUpperCase() + _str.slice(1);
+                })).join(' ');
+            }
+            else {
+                returnValue = str && (str.charAt(0).toUpperCase() + str.slice(1));
+            }
+        }
+        return returnValue;
+    };
     CommonMethodsService.decorators = [
         { type: Injectable, args: [{
                     providedIn: 'root'
@@ -8540,16 +8656,26 @@ var CardsComponent = /** @class */ (function (_super) {
      */
     function (content) {
         return __awaiter(this, void 0, void 0, function () {
-            var urlData;
+            var userProfile, extUrl, urlData;
             return __generator(this, function (_a) {
                 switch (_a.label) {
-                    case 0: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
-                    case 1:
+                    case 0:
+                        userProfile = this.configSvc.userProfile;
+                        if (!content.externalId) return [3 /*break*/, 1];
+                        extUrl = content.redirectUrl.replace('<username>', userProfile.userId);
+                        // const url = this.router.serializeUrl(
+                        //   this.router.createUrlTree([extUrl])
+                        // );
+                        this.router.navigate(["app/toc/ext/" + content.contentId]);
+                        return [3 /*break*/, 3];
+                    case 1: return [4 /*yield*/, this.contSvc.getResourseLink(content)];
+                    case 2:
                         urlData = _a.sent();
                         this.router.navigate([urlData.url], {
                             queryParams: urlData.queryParams
                         });
-                        return [2 /*return*/];
+                        _a.label = 3;
+                    case 3: return [2 /*return*/];
                 }
             });
         });
@@ -8594,14 +8720,14 @@ var CardsComponent = /** @class */ (function (_super) {
     CardsComponent.decorators = [
         { type: Component, args: [{
                     selector: 'sb-uic-cards',
-                    template: "<div class=\"widget-card-content-new\">\n    <ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\n    ? false\n    : !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\n      [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardPortraitLib')\">\n      <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'user-card'\" [ngTemplateOutlet]=\"cardUser\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib'\" [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib-skeleton'\" [ngTemplateOutlet]=\"cardLandscapeLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib'\" [ngTemplateOutlet]=\"cardLandscapeLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib-skeleton'\" [ngTemplateOutlet]=\"cardWideLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib'\" [ngTemplateOutlet]=\"cardWideLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2'\" [ngTemplateOutlet]=\"cardWideV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2-skeleton'\" [ngTemplateOutlet]=\"cardWideV2Skeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib'\" [ngTemplateOutlet]=\"cardMdo\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib-skeleton'\" [ngTemplateOutlet]=\"cardMdoSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #cardPortraitLibSkeleton>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardPortraitLib>\n  <sb-uic-card-portrait \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" \n  [cbPlanMapData]=\"cbPlanMapData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [widgetData]=\"widgetData\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\">\n  </sb-uic-card-landscape>\n</ng-template>\n\n<ng-template #cardWideLib>\n  <sb-uic-card-wide (contentData)=\"getRedirectUrlData($event)\"  [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n<ng-template #cardWideLibSkeleton>\n  <sb-uic-card-wide [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n\n<ng-template #cardWideV2Skeleton>\n  <sb-uic-card-wide-v2 [widgetData]=\"widgetData\" [isCardLoading]=\"true\" ></sb-uic-card-wide-v2>\n</ng-template>\n<ng-template #cardWideV2>\n  <sb-uic-card-wide-v2\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\"\n    [widgetData]=\"widgetData\">\n  </sb-uic-card-wide-v2>\n</ng-template>\n\n<ng-template #cardUser>\n  <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n</ng-template>\n<ng-template #cardMdo>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardMdoSkeleton>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardKarmaProgram>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgramV2>\n  <!-- <sb-uic-card-karma-programs-v2 [widgetData]=\"widgetData\"><sb-uic-card-karma-programs-v2> -->\n</ng-template>",
+                    template: "<div class=\"widget-card-content-new\">\n    <ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\n    ? false\n    : !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\n      [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardPortraitLib')\">\n      <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'user-card'\" [ngTemplateOutlet]=\"cardUser\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-lib'\" [ngTemplateOutlet]=\"cardPortraitLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib-skeleton'\" [ngTemplateOutlet]=\"cardLandscapeLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-landscape-lib'\" [ngTemplateOutlet]=\"cardLandscapeLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib-skeleton'\" [ngTemplateOutlet]=\"cardWideLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-lib'\" [ngTemplateOutlet]=\"cardWideLib\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2'\" [ngTemplateOutlet]=\"cardWideV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-wide-v2-skeleton'\" [ngTemplateOutlet]=\"cardWideV2Skeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib'\" [ngTemplateOutlet]=\"cardMdo\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-mdo-lib-skeleton'\" [ngTemplateOutlet]=\"cardMdoSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib'\" [ngTemplateOutlet]=\"cardKarmaProgram\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-karma-program-lib-v2-skeleton'\" [ngTemplateOutlet]=\"cardKarmaProgramV2\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-ext-lib-skeleton'\" [ngTemplateOutlet]=\"cardPortraitExtLibSkeleton\"></ng-container>\n      <ng-container *ngSwitchCase=\"'card-portrait-ext-lib'\" [ngTemplateOutlet]=\"cardPortraitExtLib\"></ng-container>\n    </ng-container>\n</div>\n\n<ng-template #cardPortraitLibSkeleton>\n  <sb-uic-card-portrait [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardPortraitLib>\n  <sb-uic-card-portrait \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait>\n</ng-template>\n<ng-template #cardLandscapeLibSkeleton>\n  <sb-uic-card-landscape [widgetData]=\"widgetData\" \n  [cbPlanMapData]=\"cbPlanMapData\" [isCardLoading]=\"true\"></sb-uic-card-landscape>\n</ng-template>\n<ng-template #cardLandscapeLib>\n  <sb-uic-card-landscape\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [widgetData]=\"widgetData\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\">\n  </sb-uic-card-landscape>\n</ng-template>\n\n<ng-template #cardWideLib>\n  <sb-uic-card-wide (contentData)=\"getRedirectUrlData($event)\"  [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n<ng-template #cardWideLibSkeleton>\n  <sb-uic-card-wide [widgetData]=\"widgetData\"></sb-uic-card-wide>\n</ng-template>\n\n<ng-template #cardWideV2Skeleton>\n  <sb-uic-card-wide-v2 [widgetData]=\"widgetData\" [isCardLoading]=\"true\" ></sb-uic-card-wide-v2>\n</ng-template>\n<ng-template #cardWideV2>\n  <sb-uic-card-wide-v2\n    (contentData)=\"getRedirectUrlData($event)\"\n    (triggerTelemetry)=\"raiseCardClick($event)\"\n    [cbPlanMapData]=\"cbPlanMapData\"\n    [isCardLoading]=\"false\"\n    [widgetData]=\"widgetData\">\n  </sb-uic-card-wide-v2>\n</ng-template>\n\n<ng-template #cardUser>\n  <sb-uic-card-user [widgetData]=\"widgetData\"></sb-uic-card-user>\n</ng-template>\n<ng-template #cardMdo>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardMdoSkeleton>\n  <sb-uic-card-mdo-channel [widgetData]=\"widgetData\"></sb-uic-card-mdo-channel>\n</ng-template>\n<ng-template #cardKarmaProgramSkeleton>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" \n  [isCardLoading]=\"true\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgram>\n  <sb-uic-card-karma-programs [randomColorApply]=\"true\" \n  [isCardLoading]=\"false\" [widgetData]=\"widgetData\"></sb-uic-card-karma-programs>\n</ng-template>\n<ng-template #cardKarmaProgramV2>\n  <!-- <sb-uic-card-karma-programs-v2 [widgetData]=\"widgetData\"><sb-uic-card-karma-programs-v2> -->\n</ng-template>\n\n<!-- cios card -->\n<ng-template #cardPortraitExtLibSkeleton>\n  <sb-uic-card-portrait-ext [widgetData]=\"widgetData\" [isCardLoading]=\"true\"></sb-uic-card-portrait-ext>\n</ng-template>\n<ng-template #cardPortraitExtLib>\n  <sb-uic-card-portrait-ext \n  [cbPlanMapData]=\"cbPlanMapData\"\n  (contentData)=\"getRedirectUrlData($event)\" [widgetData]=\"widgetData\" [isCardLoading]=\"false\"></sb-uic-card-portrait-ext>\n</ng-template>",
                     styles: [""]
                 }] }
     ];
     /** @nocollapse */
     CardsComponent.ctorParameters = function () { return [
         { type: UtilityService },
-        { type: ConfigurationsService },
+        { type: ConfigurationsService$1 },
         { type: WidgetContentService },
         { type: Router }
     ]; };
@@ -10072,6 +10198,7 @@ var CardKarmaProgramsComponent = /** @class */ (function () {
         this.router = router;
         this.randomColorApply = false;
         this.userData = new EventEmitter();
+        this.isCardLoading = false;
         this.widgetType = '';
         this.widgetSubType = '';
         this.randomColors = [
@@ -10163,7 +10290,7 @@ var CardKarmaProgramsComponent = /** @class */ (function () {
     CardKarmaProgramsComponent.decorators = [
         { type: Component, args: [{
                     selector: 'sb-uic-card-karma-programs',
-                    template: "<mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" [ngStyle]=\"{'background': widgetData?.content?.bgColor}\">\n    <div class=\"display-contents\">\n        <ng-container *ngIf=\"widgetData?.content\">\n            <a (click)=\"redirectTo(widgetData?.content);$event.stopPropagation();\">\n                <ng-container>\n                    <mat-card-content class=\"min-top\">\n                        <div class=\"flex flex-col h-full\">\n                            <div class=\"image-container\">\n                                <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                                    <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                                    class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                    [alt]=\"widgetData?.content?.title\" />\n                                  </ng-container>\n                                  <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                                    <ng-container *ngIf=\"widgetData?.content?.imgSource && widgetData?.content?.imgSource?.length; else defaultImg\">\n                                      <img mat-card-image [src]=\"widgetData?.content?.imgSource[0] | pipePublicURL\" loading=\"lazy\"\n                                      class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                      [alt]=\"widgetData?.content?.title\" />\n                                    </ng-container>\n                                    <ng-template #defaultImg>\n                                      <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                                      class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                      [alt]=\"widgetData?.content?.title\" />\n                                    </ng-template>\n                                  </ng-container>\n                            </div>\n                            <div class=\"title-container\">\n                                <div class=\"flex   px-2\">\n                                    <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                        class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                        {{ widgetData?.content?.title }}\n                                    </div>\n                                </div>\n                                <div class=\"flex  px-2\">\n                                    <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                        class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                        {{ widgetData?.content?.children?.length}} Programs\n                                    </div>\n                                </div>\n                            </div>\n                        </div>\n                    </mat-card-content>\n                </ng-container>\n            </a>\n        </ng-container>\n    </div>\n</mat-card>",
+                    template: "<ng-container *ngIf=\"!isCardLoading\">\n    <mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" [ngStyle]=\"{'background': widgetData?.content?.bgColor}\">\n        <div class=\"display-contents\">\n            <ng-container *ngIf=\"widgetData?.content\">\n                <a (click)=\"redirectTo(widgetData?.content);$event.stopPropagation();\">\n                    <ng-container>\n                        <mat-card-content class=\"min-top\">\n                            <div class=\"flex flex-col h-full\">\n                                <div class=\"image-container\">\n                                    <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n                                        <img mat-card-image [src]=\"widgetData?.content?.posterImage | pipePublicURL\" loading=\"lazy\"\n                                        class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                        [alt]=\"widgetData?.content?.title\" />\n                                      </ng-container>\n                                      <ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n                                        <ng-container *ngIf=\"widgetData?.content?.imgSource && widgetData?.content?.imgSource?.length; else defaultImg\">\n                                          <img mat-card-image [src]=\"widgetData?.content?.imgSource[0] | pipePublicURL\" loading=\"lazy\"\n                                          class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                                          [alt]=\"widgetData?.content?.title\" />\n                                        </ng-container>\n                                        <ng-template #defaultImg>\n                                          <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                                          class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                                          [alt]=\"widgetData?.content?.title\" />\n                                        </ng-template>\n                                      </ng-container>\n                                </div>\n                                <div class=\"title-container\">\n                                    <div class=\"flex   px-2\">\n                                        <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                            class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                            {{ widgetData?.content?.title }}\n                                        </div>\n                                    </div>\n                                    <div class=\"flex  px-2\">\n                                        <div [id]=\"'m-c-'+ widgetData?.content?.identifier\"\n                                            class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                            {{ widgetData?.content?.children?.length}} Programs\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </mat-card-content>\n                    </ng-container>\n                </a>\n            </ng-container>\n        </div>\n    </mat-card>\n</ng-container>\n<ng-container *ngIf=\"isCardLoading\">\n    <mat-card class=\"channels-card card-channels-container mr-5 padding-remove cursor-pointer\" >\n        <div class=\"display-contents\">\n            <ng-container >\n                <a >\n                    <ng-container>\n                        <mat-card-content class=\"min-top\">\n                            <div class=\"flex flex-col h-full\">\n                                <div class=\"image-container\">\n                                    <ng-container >\n                                        <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                    </ng-container>\n                                </div>\n                                <div class=\"title-container\">\n                                    <div class=\"flex   px-2\">\n                                        <div class=\"flex-1 text-start  mat-subheading-2 title-text ws-mat-white-text\">\n                                            <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                        </div>\n                                    </div>\n                                    <div class=\"flex  px-2\">\n                                        <div class=\"flex-1 text-start margin-remove  margin-top-xxs mat-subheading-2 title-text ws-mat-white-text\">\n                                              <sb-uic-skeleton-loader [width]=\"'120px'\" [height]=\"'100%'\" class=\"w-full h-full\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                                        </div>\n                                    </div>\n                                </div>\n                            </div>\n                        </mat-card-content>\n                    </ng-container>\n                </a>\n            </ng-container>\n        </div>\n    </mat-card>\n</ng-container>",
                     styles: [".card-channels-container{position:relative;width:245px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;min-height:217px;height:217px;max-height:217px;margin:20px 8px;background:#1a4ca1;border-radius:12px}.card-channels-container .min-top{background:inherit;margin-bottom:0;height:inherit}.card-channels-container .image-container{background-color:#fff;width:inherit;height:139px;max-height:139px;overflow:hidden;display:flex;align-items:center;justify-content:center;border-top-left-radius:12px;border-top-right-radius:12px}.card-channels-container .card-img{max-height:100%;min-height:100%;display:block;-o-object-fit:fill;object-fit:fill}.card-channels-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-channels-container .title-container{background:inherit}.card-channels-container .description-text{position:relative;overflow:hidden;height:51px}.card-channels-container .title-text{word-break:break-all;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;min-height:24px}"]
                 }] }
     ];
@@ -10179,7 +10306,8 @@ var CardKarmaProgramsComponent = /** @class */ (function () {
     CardKarmaProgramsComponent.propDecorators = {
         widgetData: [{ type: Input }],
         randomColorApply: [{ type: Input }],
-        userData: [{ type: Output }]
+        userData: [{ type: Output }],
+        isCardLoading: [{ type: Input }]
     };
     return CardKarmaProgramsComponent;
 }());
@@ -10191,6 +10319,8 @@ if (false) {
     /** @type {?} */
     CardKarmaProgramsComponent.prototype.userData;
     /** @type {?} */
+    CardKarmaProgramsComponent.prototype.isCardLoading;
+    /** @type {?} */
     CardKarmaProgramsComponent.prototype.defaultThumbnail;
     /** @type {?} */
     CardKarmaProgramsComponent.prototype.sourceLogos;
@@ -10405,6 +10535,171 @@ if (false) {
     CardKarmaProgramsV2Component.prototype.router;
 }
 
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var CardPortraitExtComponent = /** @class */ (function () {
+    function CardPortraitExtComponent(snackBar, translate, langtranslations, configSvc, contSvc) {
+        var _this = this;
+        this.snackBar = snackBar;
+        this.translate = translate;
+        this.langtranslations = langtranslations;
+        this.configSvc = configSvc;
+        this.contSvc = contSvc;
+        this.isCardLoading = false;
+        this.contentData = new EventEmitter();
+        this.isCardFlipped = false;
+        this.acbpConstants = NsCardContent$1.ACBPConst;
+        this.showFlip = false;
+        this.widgetType = 'df';
+        this.widgetSubType = 'sdf';
+        this.langtranslations.languageSelectedObservable.subscribe((/**
+         * @return {?}
+         */
+        function () {
+            if (localStorage.getItem('websiteLanguage')) {
+                _this.translate.setDefaultLang('en');
+                /** @type {?} */
+                var lang = (/** @type {?} */ (localStorage.getItem('websiteLanguage')));
+                _this.translate.use(lang);
+            }
+        }));
+    }
+    /**
+     * @return {?}
+     */
+    CardPortraitExtComponent.prototype.ngOnInit = /**
+     * @return {?}
+     */
+    function () {
+        /** @type {?} */
+        var instanceConfig = this.configSvc.instanceConfig;
+        if (instanceConfig) {
+            this.defaultThumbnail = instanceConfig.logos.defaultContent || '';
+            this.sourceLogos = instanceConfig.sources;
+            this.defaultSLogo = instanceConfig.logos.defaultSourceLogo || '';
+        }
+        else {
+            this.defaultThumbnail = '/assets/instances/eagle/app_logos/default.png';
+            this.defaultSLogo = '/assets/instances/eagle/app_logos/KarmayogiBharat_Logo.svg';
+        }
+    };
+    /**
+     * @return {?}
+     */
+    CardPortraitExtComponent.prototype.showSnackbar = /**
+     * @return {?}
+     */
+    function () {
+        if (this.showIntranetContent) {
+            this.snackBar.open('Content is only available in intranet', 'X', { duration: 2000 });
+        }
+        else if (!this.isLiveOrMarkForDeletion) {
+            this.snackBar.open('Content may be expired or deleted', 'X', { duration: 2000 });
+        }
+    };
+    /**
+     * @param {?} contentData
+     * @return {?}
+     */
+    CardPortraitExtComponent.prototype.getRedirectUrlData = /**
+     * @param {?} contentData
+     * @return {?}
+     */
+    function (contentData) {
+        // for telemetry
+        if (this.widgetData && this.widgetData.context && this.widgetData.context.pageSection) {
+            contentData['typeOfTelemetry'] = this.widgetData.context.pageSection;
+        }
+        this.contSvc.changeTelemetryData(contentData);
+        // for redirection
+        this.contentData.emit(contentData);
+    };
+    CardPortraitExtComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'sb-uic-card-portrait-ext',
+                    template: "<ng-container *ngIf=\"!isCardLoading\">\n    <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer  {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n      greyOut:\n        widgetData?.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n          ? true\n          : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n    }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n    <div class=\"display-contents\" [ngClass]=\"{\n        disableClick:\n          widgetData?.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n            ? true\n            : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n      }\">\n      <ng-container *ngIf=\"widgetData?.content\">\n        <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n            role=\"link\" i18n-aria-label>\n      <ng-container *ngIf=\"!isCardFlipped\">\n        <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n          matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n        <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n          matTooltip=\"Available only in Company's network\"\n          *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n        <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n          (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n          <mat-icon>flip_to_back</mat-icon>\n        </button>\n        <mat-card-content class=\"min-top\">\n          <div style=\"position: relative; z-index: 1;\">\n            <ng-container *ngIf=\"widgetData?.content?.posterImage\">\n              <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n              class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n              [alt]=\"widgetData.content.name\" />\n            </ng-container>\n            <ng-container *ngIf=\"!widgetData.content.posterImage\">\n              <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n                <img mat-card-image [src]=\"widgetData.content.appIcon \" loading=\"lazy\"\n                class=\"card-img ws-mat-primary-lite-background margin-remove\"  [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-container>\n              <ng-template #defaultImg>\n                <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n                class=\"card-img ws-mat-primary-lite-background margin-remove\"\n                [alt]=\"widgetData?.content?.name\" />\n              </ng-template>\n            </ng-container>\n            <div class=\"source-div\" style=\"display: none;\">\n              <img [src]=\"widgetData?.content.creatorLogo\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n                [alt]=\"(widgetData?.content?.sourceName + '_' + widgetData.content?.contentId)\" />\n            </div>\n            <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n              <div class=\"cbp-mark\">\n                <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n              </div>\n            </ng-container>\n            <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.contentId]\">\n              <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n                cbpData: cbPlanMapData[widgetData?.content?.contentId]\n              }}\"></ng-container>\n            </ng-container>\n            <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0\">\n              <mat-icon class=\"mat-icon main_icon mr-1\">access_time</mat-icon>\n              <span class=\" ws-mat-white-text duration\">\n                {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n              </span>\n            </div>\n            <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n              <mat-icon class=\"mat-icon main_icon mr-1\">access_time</mat-icon>\n              <span class=\" ws-mat-white-text duration\">\n                {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n              </span>\n            </div>\n          </div>\n          <div class=\"padding-m\">\n            <div class=\"course_widget flex margin-remove\">\n              <div class=\"flex flex-end course_v2\">\n                <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs\">video_library</mat-icon>\n                <sb-uic-display-content-type [useTranslation]=\"false\" i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.topic\"\n                  class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData?.content?.primaryCategory==='Course Unit'\n                  ?'Module'\n                  :widgetData?.content?.primaryCategory? widgetData?.content?.primaryCategory : 'Course'\">\n  \n                </sb-uic-display-content-type>\n              </div>\n            </div>\n            <div [id]=\"'m-c-'+ widgetData.content?.contentId\"\n              class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n              {{ widgetData.content.name }}\n            </div>\n            <div class=\"flex w-full flex-wrap flex-middle\">\n              <div class=\"course_logo_box\">\n                <img [src]=\"widgetData.content.creatorLogo | pipePublicURL \" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n                [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.contentId)\" />\n              </div>\n              <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n                <span class=\"org-text\">By&nbsp; {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n            </div>\n            <div class=\"flex flex-middle rating-session margin-top-m\">\n              <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n                <mat-icon class=\"mr-1\">star</mat-icon>\n                <span>{{widgetData.content.avgRating}}</span>\n              </div>\n              <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n              <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n                <span class=\"most-enrolled-text margin-left-xs\">\n                  <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n              </span>\n              </ng-container>\n              <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n                <span class=\"most-enrolled-text margin-left-xs\">\n                  <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n              </span>\n              </ng-container>\n            </div>\n          </div>\n        </mat-card-content>\n      </ng-container>\n      <ng-container *ngIf=\"isCardFlipped\">\n        <div class=\"flex items-center\">\n          <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n          <button mat-icon-button (click)=\"isCardFlipped = false\">\n            <mat-icon>close</mat-icon>\n          </button>\n        </div>\n        <p class=\"text-justify mat-body-1\">\n          {{ widgetData.content.reason }}\n        </p>\n      </ng-container>\n        </a>\n      </ng-container>\n    </div>\n  </mat-card>\n  </ng-container>\n  \n  <ng-container *ngIf=\"isCardLoading\">\n    <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n      <div class=\"display-contents\" >\n        <ng-container *ngIf=\"!isCardFlipped\">\n          <mat-card-content class=\"min-top\">\n            <div style=\"position: relative; z-index: 1;\">\n              <ng-container>\n                <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n              </ng-container>\n            </div>\n            <div class=\"padding-m\">\n              <div class=\"course_widget flex margin-remove\">\n                <div class=\"flex flex-end\">\n                  <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n                </div>\n              </div>\n              <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n                <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n              </div>\n              <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n                <div class=\"\">\n                  <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n                </div>\n                <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n              </div>\n              <div class=\"flex flex-middle rating-session margin-top-m\">\n                <div class=\"flex flex-middle\">\n                  <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n                </div>\n              </div>\n            </div>\n          </mat-card-content>\n        </ng-container>\n      </div>\n    </mat-card>\n  </ng-container>\n  \n  <ng-template #cbpPlan  let-data=\"data\">\n    <div class=\"cbp-mark left-0 border-top-radius\">\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\"  class=\"cbp-warning\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\"  class=\"cbp-success\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n      <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">{{'OverDue' }}</p>\n    </div>\n  </ng-template>",
+                    styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #ef951e;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;min-height:346px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px rgba(153,153,153,.2);overflow:hidden;height:346px;margin:20px 8px}.card-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)}.card-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #dedfe0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;-o-object-fit:fill;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{word-break:break-all;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 100%);position:absolute;top:0;padding:8px}.cbp-mark p{opacity:1;background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;opacity:1;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:rgba(255,255,255,.95);font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}"]
+                }] }
+    ];
+    /** @nocollapse */
+    CardPortraitExtComponent.ctorParameters = function () { return [
+        { type: MatSnackBar },
+        { type: TranslateService },
+        { type: MultilingualTranslationsService },
+        { type: ConfigurationsService$1 },
+        { type: WidgetContentService }
+    ]; };
+    CardPortraitExtComponent.propDecorators = {
+        widgetData: [{ type: Input }],
+        isLiveOrMarkForDeletion: [{ type: Input }],
+        showIntranetContent: [{ type: Input }],
+        isIntranetAllowedSettings: [{ type: Input }],
+        isCardLoading: [{ type: Input }],
+        contentData: [{ type: Output }],
+        cbPlanMapData: [{ type: Input }]
+    };
+    return CardPortraitExtComponent;
+}());
+if (false) {
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isLiveOrMarkForDeletion;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.showIntranetContent;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isIntranetAllowedSettings;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isCardLoading;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.contentData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.cbPlanMapData;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.isCardFlipped;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.acbpConstants;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.defaultThumbnail;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.sourceLogos;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.defaultSLogo;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.showFlip;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetType;
+    /** @type {?} */
+    CardPortraitExtComponent.prototype.widgetSubType;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.snackBar;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.translate;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.langtranslations;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.configSvc;
+    /**
+     * @type {?}
+     * @private
+     */
+    CardPortraitExtComponent.prototype.contSvc;
+}
+
 /**
  * @fileoverview added by tsickle
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
@@ -10423,7 +10718,8 @@ var CardsModule = /** @class */ (function () {
                         CardMDOChannelComponent,
                         CardWideV2Component,
                         CardKarmaProgramsComponent,
-                        CardKarmaProgramsV2Component
+                        CardKarmaProgramsV2Component,
+                        CardPortraitExtComponent
                     ],
                     imports: [
                         CommonModule,
@@ -10606,7 +10902,7 @@ var CompetencyPassbookComponent = /** @class */ (function () {
                         addfilter = {};
                         if (this.providerId) {
                             addfilter = {
-                                "channel": [
+                                "createdFor": [
                                     this.providerId
                                 ],
                             };
@@ -10646,7 +10942,7 @@ var CompetencyPassbookComponent = /** @class */ (function () {
                                 function (partialSum, data) { return partialSum + data.count; }), 0);
                                 this.selectedValue = this.competencyArea[0].name.toLowerCase();
                                 addFilter = {
-                                    "channel": [
+                                    "createdFor": [
                                         this.providerId
                                     ]
                                 };
@@ -10719,7 +11015,7 @@ var CompetencyPassbookComponent = /** @class */ (function () {
         var addfilter = {};
         if (this.providerId) {
             addfilter = {
-                "channel": [
+                "createdFor": [
                     this.providerId
                 ],
             };
@@ -12081,5 +12377,5 @@ var UserContentRatingLibModule = /** @class */ (function () {
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
-export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, CardKarmaProgramsComponent as ɵbb, CardKarmaProgramsV2Component as ɵbc, PipePublicURLModule as ɵbd, PipePublicURL as ɵbe, DisplayContentTypeLibModule as ɵbf, DisplayContentTypeLibComponent as ɵbg, DefaultThumbnailModule as ɵbh, DefaultThumbnailDirective as ɵbi, PipeDurationTransformModule as ɵbj, PipeDurationTransformPipe as ɵbk, CompetencyPassbookComponent as ɵbl, CompetencyPassbookService as ɵbm, PillsModule as ɵbn, PillsComponent as ɵbo, UserContentRatingLibComponent as ɵbp, ScrollableItemDirective as ɵbq, RatingService as ɵbr, UserContentRatingLibService as ɵbs, AvatarPhotoLibModule as ɵbt, AvatarPhotoLibComponent as ɵbu, MyHammerConfig$1 as ɵbv, SlidersNgContentLibModule as ɵbw, SlidersNgContentLibComponent as ɵbx, ScrollableItemModule as ɵby, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
+export { AnnouncementsModule, CalenderModule, CardsModule, CommonMethodsService, CommonStripModule, CompetencyPassbookModule, ConsumptionComponent, ConsumptionModule, ConsumptionService, ContentStripWithTabsLibModule, DataPointsModule, HttpLoaderFactory, MyHammerConfig, ROOT_WIDGET_CONFIG, SlidersLibModule, UserContentRatingLibModule, WIDGET_REGISTERED_LIB_MODULES, WIDGET_REGISTRATION_LIB_CONFIG, WidgetContentService, ContentStripWithTabsLibComponent as ɵa, WidgetUserService as ɵb, CardWideV2Component as ɵba, CardKarmaProgramsComponent as ɵbb, CardKarmaProgramsV2Component as ɵbc, CardPortraitExtComponent as ɵbd, PipePublicURLModule as ɵbe, PipePublicURL as ɵbf, DisplayContentTypeLibModule as ɵbg, DisplayContentTypeLibComponent as ɵbh, DefaultThumbnailModule as ɵbi, DefaultThumbnailDirective as ɵbj, PipeDurationTransformModule as ɵbk, PipeDurationTransformPipe as ɵbl, CompetencyPassbookComponent as ɵbm, CompetencyPassbookService as ɵbn, PillsModule as ɵbo, PillsComponent as ɵbp, UserContentRatingLibComponent as ɵbq, ScrollableItemDirective as ɵbr, RatingService as ɵbs, UserContentRatingLibService as ɵbt, AvatarPhotoLibModule as ɵbu, AvatarPhotoLibComponent as ɵbv, MyHammerConfig$1 as ɵbw, SlidersNgContentLibModule as ɵbx, SlidersNgContentLibComponent as ɵby, ScrollableItemModule as ɵbz, MultilingualTranslationsService as ɵc, ConfigurationsService as ɵd, HorizontalScrollerV2Module as ɵe, HorizontalScrollerV2Component as ɵf, SlidersLibComponent as ɵg, NavigationModule as ɵh, NavigationDirective as ɵi, ImageResponsiveModule as ɵj, ImageResponsiveDirective as ɵk, DataPointsComponent as ɵl, InsiteDataService as ɵm, SkeletonLoaderLibModule as ɵn, SkeletonLoaderLibComponent as ɵo, CalenderComponent as ɵp, CalenderDayComponent as ɵq, CommonStripComponent as ɵr, AnnouncementsComponent as ɵs, CardResourceComponent as ɵt, CardsComponent as ɵu, CardPortraitComponent as ɵv, CardUserComponent as ɵw, CardLandscapeComponent as ɵx, CardWideComponent as ɵy, CardMDOChannelComponent as ɵz };
 //# sourceMappingURL=sunbird-cb-consumption.js.map