@clickview/lite 0.0.18-dev.2 → 0.0.18-rc.1

package/dist/scripts/23.chunk.js

@@ -1 +1,1121 @@
-(window.webpackJsonp_clickview_lite=window.webpackJsonp_clickview_lite||[]).push([[23],{401:function(e,a,t){"use strict";t.d(a,"a",(function(){return o}));var n=t(75),r=t(28),i=t(35);const o=()=>{const e=Object(n.a)(i.a.ALERT);return{success(a){e.success(a)()},error(a){e.error(a)()},warning(a){e.createAlert({type:r.a.Warning,heading:r.c.Warning,message:a})}}}},406:function(e,a,t){"use strict";t.d(a,"b",(function(){return n})),t.d(a,"a",(function(){return m}));var n,r,i=t(0),o=t(75),c=t(33),l=t(9),s=t(8),u=t(465),d=t.n(u);function m(e){const{type:a,mediaType:t,extraClasses:u}=e,m=(Object(o.a)(s.b.ImageUrl).getImageUrls(),function(e){return e===n.Video?d.a.videoFallback:e===n.Playlist?d.a.playlistFallback:e===n.Series||e===n.TallSubject?d.a.posterFallback:e===n.Subject?d.a.subjectFallback:""}(a)),p=function(e,a){return e===n.Video?l.b.Play:e===n.Playlist?l.b.Playlist:e===n.Series?l.b.Series:e===n.Subject||e===n.TallSubject?l.b.Subject:""}(a);let v=""+function(e,a){return a===n.Subject?d.a.subjectFallbackContainer:e===r.Svg?d.a.svgFallbackContainer:d.a.baseFallbackContainer}(t,a);return u&&(v+=" "+e.extraClasses),i.createElement("div",{className:v},t===r.Svg?i.createElement(c.a,{svgName:p,className:m,tagName:"div"}):i.createElement("div",{className:d.a.fallbackThumbnailImage,style:{backgroundImage:`url('${p}')`}}))}!function(e){e[e.Video=0]="Video",e[e.Playlist=1]="Playlist",e[e.Series=2]="Series",e[e.Subject=3]="Subject",e[e.TallSubject=4]="TallSubject"}(n||(n={})),function(e){e[e.Svg=0]="Svg",e[e.Image=1]="Image"}(r||(r={})),m.defaultProps={mediaType:r.Svg}},413:function(e,a,t){"use strict";var n=t(0),r=t(34),i=t(388),o=t(463),c=t.n(o),l=function(e,a){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&a.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)a.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(t[n[r]]=e[n[r]])}return t};function s(e){var{forceLoad:a}=e,t=l(e,["forceLoad"]);const[r,o]=i.useInView({triggerOnce:!0});if(void 0===window.IntersectionObserver&&!a)return n.createElement("img",Object.assign({alt:""},t));const{src:s}=t,u=l(t,["src"]),d=Object.assign(Object.assign({alt:""},u),o||a?{src:s}:{});return n.createElement("img",Object.assign({className:c.a.image,ref:r},d))}var u,d=t(32),m=t(425),p=t(464),v=t.n(p);function f(e){let a="thumbnail "+v.a.thumbnail,t="";return e.aspectRatio===u.SixteenByNine&&(t=v.a.sixteenByNine),e.aspectRatio===u.NineBySixteen&&(t=v.a.nineBySixteen),e.aspectRatio===u.OneByOne&&(t=v.a.oneByOne),e.aspectRatio===u.TwoByThree&&(t=v.a.twoByThree),t&&(a+=" "+t),e.className&&(a+=" "+e.className),a}function b(e){const{data:a,size:t,appLink:i,preload:o}=e;let c="";"string"==typeof a?c=a:r.a.isObject(a)&&(c=a.url);const l=c&&function(e,a=m.a.Small){return`${e}?size=${a}`}(c,t);return n.createElement("div",{className:f(e)},n.createElement(d.a,{appLink:i},e.children,l&&n.createElement(s,{src:l,forceLoad:o})))}t.d(a,"a",(function(){return u})),t.d(a,"b",(function(){return b})),function(e){e[e.SixteenByNine=0]="SixteenByNine",e[e.OneByOne=1]="OneByOne",e[e.TwoByThree=2]="TwoByThree",e[e.NineBySixteen=3]="NineBySixteen"}(u||(u={}))},425:function(e,a,t){"use strict";var n;t.d(a,"a",(function(){return n})),function(e){e.Small="small",e.Medium="medium",e.Large="large",e.Raw="raw"}(n||(n={}))},426:function(e,a,t){"use strict";var n=t(0),r=t(27);const i={mapRatingToClass(e){if(!e)return"";return(e=>{switch(!0){case e<32:return"bg-purple";case e<48:return"bg-success";case e<80:return"bg-info";case e<96:return"bg-danger";case e<128:return"bg-pink";case e>=128:return"bg-warning";default:return""}})(e)}};var o,c=t(125),l=t(460),s=t.n(l);function u(e){const{type:a,data:t}=e;if(!function(e,a){return e===o.Rating?a&&!!a.value:!!a}(a,t))return n.createElement(n.Fragment,null);const l=function(e,a){let t="";return e===o.Duration&&(t=s.a.duration),e===o.Interactive&&(t=s.a.interactive),e===o.Rating&&(t=`${s.a.rating} ${i.mapRatingToClass(a.value)}`),e===o.ProductionYear&&(t=s.a.productionYear),"badge "+t}(a,t),u=function(e,a){return e===o.Interactive?"Interactive":e===o.Duration?c.a.ToDisplayDuration(a):e===o.Rating?a.code:e===o.ProductionYear?a:void 0}(a,t),d=function(e,a){return e===o.Rating?{title:a.name,placement:"top"}:null}(a,t);return d?n.createElement(r.OverlayTrigger,{placement:d.placement,overlay:n.createElement(r.Tooltip,{id:d.title},d.title)},n.createElement("span",{className:l},u)):n.createElement("span",{className:l},u)}t.d(a,"b",(function(){return o})),t.d(a,"a",(function(){return u})),function(e){e.Duration="duration",e.Interactive="interactive",e.Rating="rating",e.ProductionYear="production-year"}(o||(o={}))},449:function(e,a,t){"use strict";t.d(a,"a",(function(){return o}));var n=t(0),r=t(460),i=t.n(r);function o(e){let a="d-flex "+i.a.badgeList;return e.className&&(a+=" "+e.className),n.createElement("div",{className:a},e.children)}},451:function(e,a,t){"use strict";t.d(a,"a",(function(){return s}));var n=t(0),r=t(5),i=t(9),o=t(33),c=t(401);const l=r.a.encloseNamespace("shared.favouriteButton");function s(e){const a=Object(c.a)(),t="boolean"==typeof e.video.isFavourited,r=!!e.video.isFavourited,[s,u]=n.useState(r);n.useEffect(()=>{u(r)},[r]);let d="cursor-pointer text"+(s?"-danger":"-dark");return e.className&&(d+=" "+e.className),t?n.createElement("div",{className:d,onClick:function(){const t=!s;u(t),e.setFavourite(e.video.id,t,(function(){a.error(l(t?"favouriteError":"unfavouriteError")),u(!t)}))}},n.createElement(o.a,{svgName:s?i.b.Heart:i.b.HeartOutline,size:o.b.Small})):n.createElement(n.Fragment,null)}},452:function(e,a,t){"use strict";var n;t.d(a,"a",(function(){return n})),function(e){e[e.Below=1]="Below",e[e.Overlay=2]="Overlay",e[e.Independent=3]="Independent"}(n||(n={}))},460:function(e,a,t){e.exports={duration:"_3XH_S",interactive:"INxgX",productionYear:"Bt6Bx",rating:"_3bOtF",badgeList:"_1BsVS"}},463:function(e,a,t){e.exports={image:"_1YW-E"}},464:function(e,a,t){e.exports={thumbnail:"_3lfBf",sixteenByNine:"_2LqZ8",nineBySixteen:"_136ry",oneByOne:"_2wYLa",twoByThree:"_1eC6Q"}},465:function(e,a,t){e.exports={baseFallbackContainer:"_1wRjB",svgFallbackContainer:"_2t1jq",subjectFallbackContainer:"_12D74",videoFallback:"_6BPy-",playlistFallback:"_1slQX",posterFallback:"i0o8n",subjectFallback:"_2Srdd",fallbackThumbnailImage:"_2L_tV"}},472:function(e,a,t){"use strict";var n=t(0),r=t.n(n),i=t(31),o=t(451),c=t(413),l=t(406),s=t(121),u=t(449),d=t(426),m=t(33),p=t(9),v=t(474),f=t.n(v);function b(e){var a;const{video:t,appLink:n,size:v,setFavourite:b,preload:g,hovering:y}=e;return r.a.createElement("div",{className:"position-relative rounded overflow-hidden"},!!i.a.isFunction(b)&&r.a.createElement("div",{className:f.a.favouriteContainer},r.a.createElement(o.a,{setFavourite:b,video:t,className:"rounded-circle p-1 "+f.a.favouriteButton})),r.a.createElement(c.b,{data:t.thumbnail,appLink:n,aspectRatio:c.a.SixteenByNine,size:v,preload:g,className:f.a.gradient},y&&r.a.createElement(m.a,{className:f.a.playIcon,svgName:p.b.PlayCircle}),r.a.createElement(l.a,{type:l.b.Video}),r.a.createElement("div",{className:f.a.overlayContainer},r.a.createElement("div",{className:`${f.a.title} ${y?f.a.downScale:""}`},!!(null===(a=e.video.series)||void 0===a?void 0:a.id)&&r.a.createElement(s.a,{className:"text-shadow clamp-1",video:t,appLink:null}),r.a.createElement("span",{className:"h6 text-reset text-shadow clamp-1 mb-0"},t.name),y&&r.a.createElement(u.a,{className:"align-items-center mb-n1"},r.a.createElement(d.a,{type:d.b.Duration,data:t.duration}),r.a.createElement(d.a,{type:d.b.Rating,data:t.rating}),r.a.createElement("span",{className:"badge p-0"},r.a.createElement(m.a,{svgName:p.b.CloseCaptionBadge})))))))}var g,y=t(452),E=t(475),h=t.n(E);function N(e){const{type:a}=e,t=function(e){return e===g.Video?h.a.video:e===g.Playlist?h.a.playlist:""}(a),r=function(e){return e===g.Video?p.b.PlayCircle:e===g.Playlist?p.b.AddToPlaylists:""}(a);return n.createElement("div",{className:h.a.maskContainer},n.createElement("div",{className:h.a.mask}),n.createElement(m.a,{svgName:r,className:t}))}!function(e){e[e.Video=0]="Video",e[e.Playlist=1]="Playlist"}(g||(g={}));var S=t(32),k=t(476),B=t.n(k);function O(e){var a;const{video:t,seriesAppLink:n,textPosition:i,appLink:o}=e,c=i===y.a.Overlay,l=c?B.a.titleOverlay:B.a.titleBelow;return r.a.createElement("div",{className:l},!!(null===(a=e.video.series)||void 0===a?void 0:a.id)&&r.a.createElement(s.a,{className:c?"text-shadow clamp-1":"clamp-2",video:t,appLink:c?null:n}),c?r.a.createElement("span",{className:"h6 text-reset text-shadow clamp-1 mb-0"},t.name):r.a.createElement(S.a,{className:"h6 text-reset clamp-2 mb-0",appLink:o},t.name))}function w(e){const{video:a,appLink:t,textPosition:n,size:s,setFavourite:m,preload:p}=e;let v="position-relative";return n===y.a.Overlay&&(v+=" rounded overflow-hidden"),r.a.createElement("div",{className:v},!!i.a.isFunction(m)&&r.a.createElement("div",{className:B.a.favouriteContainer},r.a.createElement(o.a,{setFavourite:m,video:a,className:"rounded-circle p-1 "+B.a.favouriteButton})),r.a.createElement(c.b,{data:a.thumbnail,appLink:t,aspectRatio:c.a.SixteenByNine,size:s,preload:p,className:n===y.a.Overlay?B.a.gradient:""},r.a.createElement(N,{type:g.Video}),r.a.createElement(l.a,{type:l.b.Video}),r.a.createElement("div",{className:B.a.overlayContainer},n===y.a.Overlay&&r.a.createElement(O,Object.assign({},e)),r.a.createElement(u.a,{className:B.a.badgeContainer},r.a.createElement(d.a,{type:d.b.Duration,data:a.duration})))),n===y.a.Below&&r.a.createElement(O,Object.assign({},e)))}function j(e){return"expandable"===e.type?n.createElement(b,Object.assign({},e)):n.createElement(w,Object.assign({},e))}t.d(a,"a",(function(){return j}))},474:function(e,a,t){e.exports={overlayContainer:"_1MQy4",favouriteContainer:"_2obuZ",favouriteButton:"_1UfdO",title:"Q1km-",downScale:"_2_7sb",gradient:"Of_Cn",playIcon:"B9cJG"}},475:function(e,a,t){e.exports={mask:"_3nE2p",video:"KdGwU",playlist:"_1cBmC",maskContainer:"_3si6K"}},476:function(e,a,t){e.exports={titleOverlay:"_1JIh4",titleBelow:"_1OKu_",overlayContainer:"_1BBKk",favouriteContainer:"_23tXc",favouriteButton:"_2lJ57",badgeContainer:"_28ZUf",gradient:"_1o4aT"}},510:function(e,a,t){"use strict";t.d(a,"a",(function(){return u}));var n=t(0),r=t(79),i=t(452),o=t(472),c=t(437),l=t(511),s=t.n(l);const u=n.memo((function(e){const{data:a,appLink:t,seriesAppLink:l,context:u,thumbnailSize:d,preloadImage:m}=e,[p,v]=Object(c.b)(s.a.hovering);n.useEffect(()=>{e.onHover(v)},[v]);const f=Object.assign(Object.assign({},t),{args:[a.id]});let b=s.a.rowWidth;return u.type!==r.c.LargeRow&&3!==u.collectionSize||(b=s.a.largeRowWidth),n.createElement("div",{ref:p,className:"p-1 flex-shrink-0 position-relative "+b},n.createElement(o.a,{video:a,type:"expandable",appLink:f,seriesAppLink:l,textPosition:i.a.Overlay,size:d,preload:m,hovering:v}))}),(e,a)=>{var t,n,r,i,o,c;return e.preloadImage===a.preloadImage&&(null===(t=e.data)||void 0===t?void 0:t.name)===(null===(n=a.data)||void 0===n?void 0:n.name)&&(null===(i=null===(r=e.data)||void 0===r?void 0:r.series)||void 0===i?void 0:i.id)===(null===(c=null===(o=a.data)||void 0===o?void 0:o.series)||void 0===c?void 0:c.id)})},511:function(e,a,t){e.exports={rowWidth:"_8IgrO",largeRowWidth:"q46rm",hovering:"IeeJA"}},580:function(e,a,t){e.exports={slidingSubject:"_16BT9",heading:"_1ZUkE",thumbnailContainer:"_1uhoK",partialLoadingHeading:"_1-m4K",partialLoading:"_3fvkd",labelContainer:"_3T7RZ"}},581:function(e,a,t){e.exports={searchBar:"_3pFjl",searchBarContainer:"W4B6T"}},647:function(e,a,t){"use strict";t.r(a);var n,r=t(1),i=t(0),o=t(388),c=t(11),l=t(69),s=t(46),u=t(79),d=t(81);!function(e){e.Learner="learner",e.Staff="staff"}(n||(n={}));const m={getUserGroup:e=>e===d.a.Student?n.Learner:n.Staff};var p=t(219),v=t(440),f=t(115),b=t(216),g=t(8);var y=t(441),E=t(510),h=t(126),N=t(5),S=t(68);const k=i.memo((function({user:e}){const a=N.a.encloseNamespace("shared.greeting");return i.createElement("h1",{className:"h2"},i.createElement("strong",null,function(e){switch(S.a.currentTimeOfDay()){case"morning":return e("morning");case"afternoon":return e("afternoon");case"evening":return e("evening");default:return e("fallback")}}(a),i.createElement("span",{className:"text-info"}," ",e&&e.givenName),","),i.createElement("br",null),i.createElement("strong",null,a("prompt")))}),(e,a)=>{var t,n;return(null===(t=e.user)||void 0===t?void 0:t.id)===(null===(n=a.user)||void 0===n?void 0:n.id)});var B=t(425),O=t(413),w=t(406),j=t(580),x=t.n(j);function C(e){const{data:a,appLink:t,context:n,preloadImage:r}=e,o=Object.assign(Object.assign({},t),{args:[a.id]});return i.createElement("div",{className:`${x.a.slidingSubject} ${x.a.thumbnailContainer}`},i.createElement(O.b,{data:a.tallPoster,appLink:o,aspectRatio:O.a.NineBySixteen,preload:r,size:B.a.Large},i.createElement(w.a,{type:w.b.TallSubject}),i.createElement("h3",{className:"h4 "+x.a.heading},a.name)))}var L=t(76),_=t(113),I=t(32);function T(e){const{heading:a,banner:t,imageCdnUrl:n,appLink:r}=e,o=_.a.createBannerUrl(t,{fallbackBaseUrl:n,fallbackCategoryName:a,type:L.b.Banners});return i.createElement(I.a,{appLink:r},i.createElement("div",{className:"banner",style:{backgroundImage:`url('${o}')`}}))}var F=t(10),R=t(3),P=t(53),A=function(e,a,t,n){return P.a.urlBuilder("api/domain/v2/dashboards/widgets",{libraryType:e,customerType:a,userRole:t,countryCode:n})},D=function(e,a,t,n,r){var i="api/domain/v2/dashboards/playlists/".concat(e,"/videos");return P.a.urlBuilder(i,{maxRatingValue:a,userGroup:t,page:n,limit:r})},V=function(e,a,t,n){return{url:A(e,a,t,n),key:"widgets:".concat(e,":").concat(a,":").concat(n)}},U=function(e,a,t,n,r){return{url:D(e,a,t,n,r),key:"widget:".concat(e,":").concat(a,":").concat(t,":").concat(n)}},z=t(581),$=t.n(z),H=t(87),J=t(230),W=t(228);function Y(e,a){return function(e){if(Array.isArray(e))return e}(e)||function(e,a){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var t=[],n=!0,r=!1,i=void 0;try{for(var o,c=e[Symbol.iterator]();!(n=(o=c.next()).done)&&(t.push(o.value),!a||t.length!==a);n=!0);}catch(e){r=!0,i=e}finally{try{n||null==c.return||c.return()}finally{if(r)throw i}}return t}(e,a)||function(e,a){if(!e)return;if("string"==typeof e)return K(e,a);var t=Object.prototype.toString.call(e).slice(8,-1);"Object"===t&&e.constructor&&(t=e.constructor.name);if("Map"===t||"Set"===t)return Array.from(e);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return K(e,a)}(e,a)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function K(e,a){(null==a||a>e.length)&&(a=e.length);for(var t=0,n=new Array(a);t<a;t++)n[t]=e[t];return n}t.d(a,"DashboardView",(function(){return q}));var X={video:{application:R.a.DEFAULT,action:F.a.Default.PLAY_VIDEO},collection:{application:R.a.DASHBOARD,action:F.a.Dashboard.DASHBOARD},series:{application:R.a.DEFAULT,action:F.a.Default.SERIES},classification:{application:R.a.SUBJECT,action:F.a.Subjects.CLASSIFICATION},subjectPreferences:{application:R.a.SUBJECT,action:F.a.Subjects.PREFERENCES,params:{step:"subjects"}}};function G(e){return c.a.useBasicFetch(h.a.classifications())}function M(e){var a,t,n=Object(b.a)(g.b.AppOptions).onlineCustomerType,r=d.a.Staff,i=(null===(a=e)||void 0===a?void 0:a.countryCode)&&V(p.a.HostedLibrary,n,r,null===(t=e)||void 0===t?void 0:t.countryCode);return c.a.useBasicFetch(i).data}function Z(e,a,t){return c.a.useBasicFetch(t?U(e,null,m.getUserGroup(d.a.Staff),1,25):null)}function Q(e){var a=e.presentationId,t=i.useContext(H.a),n=Y(o.useInView({rootMargin:"-126px 0px"}),2),r=n[0],c=n[1];return t.setSearchInNav(!c),i.createElement("div",{ref:r,className:$.a.searchBar},i.createElement(l.a,{className:"container ".concat($.a.searchBarContainer),view:J.a,options:{model:s.a.get("search",{ctor:W.a}),disableMask:!0,presentationId:a}}))}function q(){var e,a=c.a.useBasicFetch(f.a.currentUser),t=M(a.data),n=c.a.useBasicFetch(h.a.presentation());return i.createElement("div",{className:"dashboard-widgets bg-white"},i.createElement("div",{className:"pt-5 px-1"},i.createElement(k,{user:a.data})),i.createElement(Q,{presentationId:null===(e=n.data)||void 0===e?void 0:e.id}),i.createElement(y.a,{name:"Subjects",type:u.c.Row,contents:v.a.Subjects,fetch:G,setData:function(e){return e},lazyLoad:!1,childComponent:C,settingsAppLink:X.subjectPreferences,childAppLink:X.classification}),i.createElement("div",{className:"py-3 px-1"},i.createElement(T,{appLink:X.series,banner:{id:"Xg84gv",url:"http://image.api.stg.cvnet.io/v2/banners/Xg84gv"},imageCdnUrl:""})),t&&t.map((function(e,a){return i.createElement(y.a,{key:a,type:e.type,contents:v.a.Videos,fetch:r.partial(Z,e.collectionId.toString()),setData:function(e){return e.videos.data},lazyLoad:!0,childComponent:function(e){return i.createElement(E.a,Object.assign({},e,{appLink:X.video,seriesAppLink:X.series}))},appLink:X.collection,childAppLink:X.video})})),";")}}}]);
+(window["webpackJsonp_clickview_lite"] = window["webpackJsonp_clickview_lite"] || []).push([[23],{
+
+/***/ "../../libs/shared/src/apps/playlists/components/empty-state/EmptyPlaylistList.tsx":
+/*!*****************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/empty-state/EmptyPlaylistList.tsx ***!
+  \*****************************************************************************************************************************/
+/*! exports provided: EmptyPlaylistList */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "EmptyPlaylistList", function() { return EmptyPlaylistList; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../common/src/react/hooks/UseService */ "../../libs/common/src/react/hooks/UseService.ts");
+/* harmony import */ var _components_empty_state_EmptyState__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../components/empty-state/EmptyState */ "../../libs/shared/src/components/empty-state/EmptyState.tsx");
+/* harmony import */ var _constants_SharedServices__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../constants/SharedServices */ "../../libs/shared/src/constants/SharedServices.ts");
+
+
+
+
+
+const getPhrase = _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].encloseNamespace('playlists.emptyState');
+function EmptyPlaylistList() {
+  const imageUrlService = Object(_common_src_react_hooks_UseService__WEBPACK_IMPORTED_MODULE_2__["useService"])(_constants_SharedServices__WEBPACK_IMPORTED_MODULE_4__["SharedServices"].ImageUrl);
+  const imageUrls = imageUrlService.getImageUrls();
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_empty_state_EmptyState__WEBPACK_IMPORTED_MODULE_3__["EmptyState"], {
+    imageUrl: imageUrls.EmptyStates.VIDEOS,
+    heading: getPhrase('noPlaylistsHeading'),
+    description: getPhrase('noPlaylistsInfo')
+  });
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList.tsx":
+/*!*********************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList.tsx ***!
+  \*********************************************************************************************************************************/
+/*! exports provided: PartialPlaylistList */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialPlaylistList", function() { return PartialPlaylistList; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./playlist.scss */ "../../libs/shared/src/apps/playlists/components/playlist-list/playlist.scss");
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_playlist_scss__WEBPACK_IMPORTED_MODULE_2__);
+
+
+
+PartialPlaylistList.defaultProps = {
+  numItems: 8
+};
+function PartialPlaylistList(props) {
+  const PARTIAL_PLAYLISTS = [...Array(props.numItems)];
+  const className = props.itemClassName || '';
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, props.showHeading && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: `${_playlist_scss__WEBPACK_IMPORTED_MODULE_2___default.a.partialHeading} partial-loading-background`
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Row"], null, PARTIAL_PLAYLISTS.map((p, idx) => react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Col"], {
+    key: idx,
+    xs: 6,
+    sm: 4,
+    md: 3,
+    lg: 2,
+    className: className
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'py-2'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: `${_playlist_scss__WEBPACK_IMPORTED_MODULE_2___default.a.basePlaylistItem} partial-loading-background`
+  }))))));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/apps/playlists/components/playlist-list/PlaylistItem.tsx":
+/*!**************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/playlist-list/PlaylistItem.tsx ***!
+  \**************************************************************************************************************************/
+/*! exports provided: PlaylistItem */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistItem", function() { return PlaylistItem; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../utils/ImageHelper */ "../../libs/shared/src/utils/ImageHelper.ts");
+/* harmony import */ var _utils_AudienceHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../utils/AudienceHelper */ "../../libs/shared/src/utils/AudienceHelper.ts");
+/* harmony import */ var _enums_Images__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../enums/Images */ "../../libs/shared/src/enums/Images.ts");
+/* harmony import */ var _components_text_Text__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../components/text/Text */ "../../libs/shared/src/components/text/Text.tsx");
+/* harmony import */ var _components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../components/app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
+/* harmony import */ var _components_thumbnails_base_BaseThumbnail__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../components/thumbnails/base/BaseThumbnail */ "../../libs/shared/src/components/thumbnails/base/BaseThumbnail.tsx");
+/* harmony import */ var _components_thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../components/thumbnails/base/ThumbnailFallback */ "../../libs/shared/src/components/thumbnails/base/ThumbnailFallback.tsx");
+/* harmony import */ var _components_audience_label_AudienceLabel__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../components/audience-label/AudienceLabel */ "../../libs/shared/src/components/audience-label/AudienceLabel.tsx");
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./playlist.scss */ "../../libs/shared/src/apps/playlists/components/playlist-list/playlist.scss");
+/* harmony import */ var _playlist_scss__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_playlist_scss__WEBPACK_IMPORTED_MODULE_9__);
+
+
+
+
+
+
+
+
+
+
+function PlaylistItem(props) {
+  const imageUrl = _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_1__["ImageHelper"].createUrl(props.data.cover && props.data.cover.url, {
+    size: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ImageSize"].Medium,
+    resizeType: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ResizeType"].Cover
+  });
+  const audiences = props.data.subjectPresentationAudiences && props.data.subjectPresentationAudiences.data;
+  const filteredAudiences = _utils_AudienceHelper__WEBPACK_IMPORTED_MODULE_2__["AudienceHelper"].getSortedPresentationAudiences(audiences, props.presentationAudiences);
+  const mergedAudience = _utils_AudienceHelper__WEBPACK_IMPORTED_MODULE_2__["AudienceHelper"].getMergedPresentationAudienceString(filteredAudiences);
+  const count = !!props.showCount && !!props.data.videos && props.data.videos.count;
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_5__["AppLink"], {
+    appLink: props.appLink
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_thumbnails_base_BaseThumbnail__WEBPACK_IMPORTED_MODULE_6__["BaseThumbnail"], {
+    data: imageUrl,
+    className: _playlist_scss__WEBPACK_IMPORTED_MODULE_9___default.a.playlistItem
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_7__["ThumbnailFallback"], {
+    type: _components_thumbnails_base_ThumbnailFallback__WEBPACK_IMPORTED_MODULE_7__["ThumbnailFallbackType"].Playlist
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: `text-white ${_playlist_scss__WEBPACK_IMPORTED_MODULE_9___default.a.playlistMetadata}`
+  }, Number.isInteger(count) && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_text_Text__WEBPACK_IMPORTED_MODULE_4__["Text"], {
+    namespace: 'shared.playlistItem',
+    phrase: 'videos',
+    options: {
+      smartCount: count
+    }
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("h5", {
+    className: 'text-shadow mb-0'
+  }, props.data.name), !!audiences && !!audiences.length && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_audience_label_AudienceLabel__WEBPACK_IMPORTED_MODULE_8__["AudienceLabel"], {
+    audience: mergedAudience,
+    border: 'white'
+  }))));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/apps/playlists/components/playlist-list/PlaylistList.tsx":
+/*!**************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/playlist-list/PlaylistList.tsx ***!
+  \**************************************************************************************************************************/
+/*! exports provided: PlaylistList */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistList", function() { return PlaylistList; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _PlaylistItem__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./PlaylistItem */ "../../libs/shared/src/apps/playlists/components/playlist-list/PlaylistItem.tsx");
+
+
+
+function PlaylistList(props) {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Row"], null, props.playlists.map(p => react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Col"], {
+    key: p.id,
+    xs: 6,
+    sm: 4,
+    lg: 3,
+    className: `mb-3 ${props.itemClassName ? props.itemClassName : ''}`
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_PlaylistItem__WEBPACK_IMPORTED_MODULE_2__["PlaylistItem"], {
+    key: p.id,
+    data: p,
+    appLink: props.getPlaylistAppLink(p),
+    presentationAudiences: props.presentationAudiences,
+    showCount: props.showCount
+  }))));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/apps/playlists/components/playlist-list/playlist.scss":
+/*!***********************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/apps/playlists/components/playlist-list/playlist.scss ***!
+  \***********************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"basePlaylistItem":"cv--basePlaylistItem--2nvrp","playlistItem":"cv--playlistItem--6o0Z2","playlistMetadata":"cv--playlistMetadata--3MCKL","partialHeading":"cv--partialHeading--13tO6"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/audience-label/AudienceLabel.tsx":
+/*!*************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/audience-label/AudienceLabel.tsx ***!
+  \*************************************************************************************************************/
+/*! exports provided: AudienceLabel, AudienceLabelList */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AudienceLabel", function() { return AudienceLabel; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AudienceLabelList", function() { return AudienceLabelList; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _audience_label_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./audience-label.scss */ "../../libs/shared/src/components/audience-label/audience-label.scss");
+/* harmony import */ var _audience_label_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_audience_label_scss__WEBPACK_IMPORTED_MODULE_1__);
+
+
+function AudienceLabel(props) {
+  if (!props.audience) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: `border rounded-pill d-inline-block px-2 mt-1 ${'border-' + props.border}`
+  }, props.audience.name);
+}
+function AudienceLabelList(props) {
+  if (!props.audiences || !props.audiences.length) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, props.audiences.map((a, idx) => react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", {
+    key: idx,
+    className: _audience_label_scss__WEBPACK_IMPORTED_MODULE_1___default.a.audienceLabelListItem
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](AudienceLabel, {
+    audience: a,
+    border: props.border
+  }))));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/audience-label/audience-label.scss":
+/*!***************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/audience-label/audience-label.scss ***!
+  \***************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"audienceLabelListItem":"cv--audienceLabelListItem--2YGVO"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/back-button/BackButton.tsx":
+/*!*******************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/back-button/BackButton.tsx ***!
+  \*******************************************************************************************************/
+/*! exports provided: BackButton */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BackButton", function() { return BackButton; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _app_link_AppLink__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
+/* harmony import */ var _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+
+
+
+
+
+const namespace = 'shared.backButton';
+BackButton.defaultProps = {
+  color: 'black'
+};
+function BackButton({
+  backToName,
+  appLink,
+  color
+}) {
+  const backPhrase = backToName ? _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].getPhrase(namespace, 'backTo', {
+    backToName
+  }) : _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].getPhrase(namespace, 'back');
+  const colorClass = color === 'black' ? '' : 'text-light';
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_app_link_AppLink__WEBPACK_IMPORTED_MODULE_3__["AppLink"], {
+    appLink: appLink,
+    className: `d-inline-flex align-items-center h5 mb-0 ${colorClass}`
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainer"], {
+    svgName: _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_4__["cvSvgLibrary"].ChevronLeft,
+    size: _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainerSize"].Medium
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", {
+    className: 'ml-1'
+  }, backPhrase));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/banner-header/BannerHeader.tsx":
+/*!***********************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/banner-header/BannerHeader.tsx ***!
+  \***********************************************************************************************************/
+/*! exports provided: BannerHeader, PartialBannerHeader */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BannerHeader", function() { return BannerHeader; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PartialBannerHeader", function() { return PartialBannerHeader; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _back_button_BackButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../back-button/BackButton */ "../../libs/shared/src/components/back-button/BackButton.tsx");
+/* harmony import */ var _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils/ImageHelper */ "../../libs/shared/src/utils/ImageHelper.ts");
+/* harmony import */ var _enums_Images__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../enums/Images */ "../../libs/shared/src/enums/Images.ts");
+/* harmony import */ var _actions_Actions__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../actions/Actions */ "../../libs/shared/src/components/actions/Actions.tsx");
+/* harmony import */ var _banner_header_scss__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./banner-header.scss */ "../../libs/shared/src/components/banner-header/banner-header.scss");
+/* harmony import */ var _banner_header_scss__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_banner_header_scss__WEBPACK_IMPORTED_MODULE_5__);
+
+
+
+
+
+
+const BannerHeader = react__WEBPACK_IMPORTED_MODULE_0__["memo"](function (props) {
+  const {
+    heading,
+    banner,
+    imageCdnUrl,
+    actions,
+    sortComponent
+  } = props;
+  const url = _utils_ImageHelper__WEBPACK_IMPORTED_MODULE_2__["ImageHelper"].createBannerUrl(banner, {
+    fallbackBaseUrl: imageCdnUrl,
+    fallbackCategoryName: heading,
+    type: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ImageType"].Banners
+  }, {
+    size: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ImageSize"].Large,
+    resizeType: _enums_Images__WEBPACK_IMPORTED_MODULE_3__["ResizeType"].Cover
+  });
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'banner',
+    style: {
+      backgroundImage: `url('${url}')`
+    }
+  }, props.backButtonAppLink && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'pt-3'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_back_button_BackButton__WEBPACK_IMPORTED_MODULE_1__["BackButton"], {
+    appLink: props.backButtonAppLink,
+    backToName: props.backButtonText,
+    color: 'white'
+  })), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("h1", {
+    className: 'text-white text-shadow position-absolute m-0 pb-3'
+  }, heading), !!actions && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: _banner_header_scss__WEBPACK_IMPORTED_MODULE_5___default.a.actionsContainer
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_actions_Actions__WEBPACK_IMPORTED_MODULE_4__["Actions"], {
+    actions: actions,
+    sortComponent: sortComponent
+  })));
+}, (prevProps, nextProps) => prevProps.actions === nextProps.actions);
+const PartialBannerHeader = () => react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+  className: `partial-banner partial-loading-background`
+});
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/banner-header/banner-header.scss":
+/*!*************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/banner-header/banner-header.scss ***!
+  \*************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"actionsContainer":"cv--actionsContainer--286KF"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/empty-state/EmptyState.tsx":
+/*!*******************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/empty-state/EmptyState.tsx ***!
+  \*******************************************************************************************************/
+/*! exports provided: EmptyState */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "EmptyState", function() { return EmptyState; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+
+function EmptyState(props) {
+  const {
+    imageUrl,
+    heading,
+    description
+  } = props;
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'empty-state-container'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'content-container'
+  }, imageUrl && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("img", {
+    src: imageUrl
+  }), react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("h1", null, heading), description && react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("p", {
+    dangerouslySetInnerHTML: {
+      __html: description
+    }
+  })));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/infinite-scroll-footer/InfiniteScrollFooter.tsx":
+/*!****************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/infinite-scroll-footer/InfiniteScrollFooter.tsx ***!
+  \****************************************************************************************************************************/
+/*! exports provided: InfiniteScrollFooter */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InfiniteScrollFooter", function() { return InfiniteScrollFooter; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../svg-container/SvgContainer */ "../../libs/shared/src/components/svg-container/SvgContainer.tsx");
+/* harmony import */ var _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+/* harmony import */ var _infinite_scroll_footer_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./infinite-scroll-footer.scss */ "../../libs/shared/src/components/infinite-scroll-footer/infinite-scroll-footer.scss");
+/* harmony import */ var _infinite_scroll_footer_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_infinite_scroll_footer_scss__WEBPACK_IMPORTED_MODULE_4__);
+
+
+
+
+
+function InfiniteScrollFooter(props) {
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: `p-3 text-center ${_infinite_scroll_footer_scss__WEBPACK_IMPORTED_MODULE_4___default.a.container}`
+  }, props.isFetching ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Spinner"], {
+    as: 'span',
+    animation: 'border',
+    role: 'status',
+    className: _infinite_scroll_footer_scss__WEBPACK_IMPORTED_MODULE_4___default.a.spinner
+  }) : react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainer"], {
+    svgName: _utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__["cvSvgLibrary"].ChevronDown,
+    className: 'svg-container cursor-pointer',
+    size: _svg_container_SvgContainer__WEBPACK_IMPORTED_MODULE_2__["SvgContainerSize"].Large,
+    onClick: props.onClick
+  }));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/components/infinite-scroll-footer/infinite-scroll-footer.scss":
+/*!*******************************************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/components/infinite-scroll-footer/infinite-scroll-footer.scss ***!
+  \*******************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+// extracted by mini-css-extract-plugin
+module.exports = {"container":"cv--container--1_KC6","spinner":"cv--spinner--VXlcl"};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/context/PageTitleContext.tsx":
+/*!**********************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/context/PageTitleContext.tsx ***!
+  \**********************************************************************************************/
+/*! exports provided: PageTitleContext, PageTitleContextProvider */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PageTitleContext", function() { return PageTitleContext; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PageTitleContextProvider", function() { return PageTitleContextProvider; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _utils_PageTitleHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils/PageTitleHelper */ "../../libs/shared/src/utils/PageTitleHelper.ts");
+
+
+
+const PageTitleContext = react__WEBPACK_IMPORTED_MODULE_0__["createContext"]({});
+const namespace = 'shared.context';
+
+const DEFAULT_TITLE = () => _common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_1__["LanguageService"].getPhrase(namespace, 'defaultTitle');
+
+const PageTitleContextProvider = ({
+  children
+}) => {
+  const [currentPageTitle, setCurrentPageTitle] = react__WEBPACK_IMPORTED_MODULE_0__["useState"](DEFAULT_TITLE);
+  const [previousPageTitle, setPreviousPageTitle] = react__WEBPACK_IMPORTED_MODULE_0__["useState"](DEFAULT_TITLE);
+
+  const setPageTitle = title => {
+    if (title === currentPageTitle) return;
+    if (currentPageTitle !== previousPageTitle) setPreviousPageTitle(currentPageTitle);
+    setCurrentPageTitle(title);
+  };
+
+  const revertPageTitle = () => {
+    setCurrentPageTitle(previousPageTitle);
+  };
+
+  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](() => _utils_PageTitleHelper__WEBPACK_IMPORTED_MODULE_2__["PageTitleHelper"].setPageTitle(currentPageTitle), [currentPageTitle]);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](PageTitleContext.Provider, {
+    value: {
+      setPageTitle,
+      revertPageTitle
+    }
+  }, children);
+};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/flight-requests/AudienceRequests.ts":
+/*!*****************************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/flight-requests/AudienceRequests.ts ***!
+  \*****************************************************************************************************/
+/*! exports provided: AudienceRequests */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AudienceRequests", function() { return AudienceRequests; });
+const endpoints = {
+  presentationAudiences: () => `/api/domain/v1/subjects/audiences`
+};
+const AudienceRequests = {
+  presentationAudiences() {
+    return {
+      bootstrapName: 'presentationAudiences',
+      url: endpoints.presentationAudiences(),
+      key: `presentation:audiences`,
+      normalize: false
+    };
+  }
+
+};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/hooks/UseInfiniteScroll.ts":
+/*!********************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseInfiniteScroll.ts ***!
+  \********************************************************************************************/
+/*! exports provided: useInfiniteScroll */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useInfiniteScroll", function() { return useInfiniteScroll; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+
+
+const SCROLL_TOLERANCE = 400; // value in px
+
+function useInfiniteScroll(fetchNextPage, hasMore, isFetching) {
+  const handleScroll = () => {
+    if (isFetching) return;
+    const currentScrollHeight = window.innerHeight + document.documentElement.scrollTop;
+    const totalHeight = document.documentElement.scrollHeight - SCROLL_TOLERANCE;
+    if (currentScrollHeight < totalHeight) return;
+    fetchNextPage();
+  };
+
+  Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(() => {
+    const onScroll = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__["FunctionHelper"].throttle(handleScroll, 200);
+    if (hasMore) window.addEventListener('scroll', onScroll);
+    return () => window.removeEventListener('scroll', onScroll);
+  }, [hasMore]);
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/hooks/UseSelectAllPages.ts":
+/*!********************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/UseSelectAllPages.ts ***!
+  \********************************************************************************************/
+/*! exports provided: useSelectAllPages */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useSelectAllPages", function() { return useSelectAllPages; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-redux */ "react-redux");
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _common_src_react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../common/src/react */ "../../libs/common/src/react/index.ts");
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+
+
+
+
+
+const safeGetCursor = request => {
+  return request && request.data && request.data.pagination && request.data.pagination.cursors && request.data.pagination.cursors.next;
+};
+/**
+ * Hook to select all pages of a collection from the store and flatten them.
+ * It will not trigger any fetches.
+ *
+ * @param getKey - callback function to get the key for each page.
+ * Can be false if the key requires data that hasn't yet been fetched - e.g. user id.
+ */
+
+
+function useSelectAllPages(getKey) {
+  return Object(react_redux__WEBPACK_IMPORTED_MODULE_1__["useSelector"])(Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(() => state => {
+    const getKeyFn = getKey;
+    let request = _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_3__["FunctionHelper"].isFunction(getKey) && _common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].getResponse(state, getKeyFn());
+    let isFetching = request && request.isFetching;
+    const shouldInitialFetch = request && request.shouldFetch;
+    let items = request && request.data && request.data.data;
+    let nextCursor = safeGetCursor(request); // Retrieve all pages that are currently in the store.
+
+    while (nextCursor) {
+      request = _common_src_react__WEBPACK_IMPORTED_MODULE_2__["Flight"].getResponse(state, getKeyFn(nextCursor));
+      isFetching = request.isFetching; // If next page hasn't been fetched, break.
+
+      if (request.shouldFetch) break;
+      let newItems = request.data && request.data.data;
+      newItems && items.push(...newItems);
+      nextCursor = safeGetCursor(request);
+    }
+
+    return {
+      shouldInitialFetch,
+      items,
+      nextCursor,
+      isFetching
+    };
+  }, [getKey]));
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/hooks/useSetPageTitle.ts":
+/*!******************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/hooks/useSetPageTitle.ts ***!
+  \******************************************************************************************/
+/*! exports provided: useSetPageTitle */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useSetPageTitle", function() { return useSetPageTitle; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+/* harmony import */ var _context_PageTitleContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context/PageTitleContext */ "../../libs/shared/src/context/PageTitleContext.tsx");
+
+
+
+/**
+ * Hook function to set the page title using the useEffect hook.
+ * @param title - value to set the page title to.
+ * @param dependencies - values from the component (e.g. state, props and functions) that are used
+ * inside the effect hook.
+ */
+
+function useSetPageTitle(title, dependencies = []) {
+  const {
+    setPageTitle
+  } = react__WEBPACK_IMPORTED_MODULE_0__["useContext"](_context_PageTitleContext__WEBPACK_IMPORTED_MODULE_2__["PageTitleContext"]);
+  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](() => {
+    if (!title || !_common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_1__["FunctionHelper"].isFunction(setPageTitle)) return;
+    setPageTitle(title);
+  }, [title, ...dependencies]);
+}
+
+/***/ }),
+
+/***/ "../../libs/shared/src/utils/AudienceHelper.ts":
+/*!*****************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/utils/AudienceHelper.ts ***!
+  \*****************************************************************************************/
+/*! exports provided: AudienceHelper */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "AudienceHelper", function() { return AudienceHelper; });
+/* harmony import */ var _common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/react/utils/ArrayHelper */ "../../libs/common/src/react/utils/ArrayHelper.ts");
+
+const DIGIT_REGEX = /([0-9]+)/ig;
+const NAME_REGEX = /(^\w+)/ig;
+const COUNT_OFFSET = 1;
+
+function processAudienceRanges(audienceValues) {
+  /**
+   * Lookahead by increments of offset
+   */
+  let offset = COUNT_OFFSET;
+  let initialVal, nextVal;
+  let isContinguous = false;
+  const ranges = []; // Audience values need to be in ascending order
+
+  audienceValues = audienceValues.sort((a, b) => a - b);
+  let i, j;
+
+  for (i = 0; i < audienceValues.length; i++) {
+    j = i + 1; // Set our lower boundary to compare against
+
+    if (!isContinguous) initialVal = audienceValues[i];
+    nextVal = audienceValues[j];
+    /**
+     * Where the next number is also the next incremental value
+     * we're going to continue iterating until the next value
+     * is no longer contiguos.
+     */
+
+    if (audienceValues[i] + offset === nextVal) {
+      isContinguous = true;
+    } else if (isContinguous) {
+      /**
+       * Where we were tracking a contiguous set, format appropriately
+       * and store the vals
+       */
+      ranges.push(`${initialVal} - ${audienceValues[i]}`);
+      isContinguous = false;
+    } else {
+      /**
+       * Where the values arent contiguous, just store the current value
+       */
+      ranges.push(`${audienceValues[i]}`);
+      isContinguous = false;
+    }
+  }
+
+  return ranges;
+}
+
+const AudienceHelper = {
+  /**
+   * This is needed to sort an object's audiences, as they are not sorted by the backend.
+   * To do this, we take the presentation audiences (sorted) and filter them by the object's
+   * audiences, leaving behind a sorted array of object audiences.
+   */
+  getSortedPresentationAudiences(objectAudiences, presentationAudiences) {
+    const objectAudienceIds = objectAudiences.map(audience => audience.id.toString());
+    /**
+     * Remove audiences that aren't relevant for the user's current presentation
+     */
+
+    const filteredAudiences = presentationAudiences.filter(presAudience => {
+      return objectAudienceIds.includes(presAudience.masterId.toString());
+    });
+    return filteredAudiences;
+  },
+
+  getMergedPresentationAudienceString(presentationAudiences) {
+    if (presentationAudiences.length === 1) return presentationAudiences[0];
+    /**
+     * Create a string with all of the audiences
+     */
+
+    const valuesStr = presentationAudiences.map(a => a.name).join(',');
+    /**
+     * Extract all the numbers and  matches from the string
+     * Where there aren't matches, just return the first Audience.
+     */
+
+    const valMatches = valuesStr.match(DIGIT_REGEX);
+    const nameMatches = valuesStr.match(NAME_REGEX);
+    if (!valMatches || !nameMatches) return presentationAudiences[0];
+    const audienceValues = valMatches.map(l => +l) || [];
+    /**
+     * Build set of logical audience ranges
+     */
+
+    const audienceRange = processAudienceRanges(audienceValues);
+    /**
+     * Get matches name
+     */
+
+    const audienceName = nameMatches[0];
+    return {
+      name: `${audienceName} ${audienceRange.join(' , ')}`
+    };
+  },
+
+  /**
+   * This function assumes the members array passed in is ordered by `name`.
+   */
+  sortMembersWithDuplicateNamesByAudience(members) {
+    // Returns the lowest level audience out of an array of audience objects by looking at the name
+    const getLowestAudience = audiences => {
+      let lowestAudience;
+      let lowestAudienceDigit;
+      audiences.forEach(audience => {
+        const digit = +_common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_0__["ArrayHelper"].first(audience.name.match(DIGIT_REGEX));
+
+        if (!lowestAudience) {
+          lowestAudience = audience;
+          lowestAudienceDigit = digit;
+          return;
+        }
+
+        if (digit > lowestAudienceDigit) lowestAudience = audience;
+      });
+      return lowestAudience;
+    }; // This is used to track how many times a member's name appears in the collection
+
+
+    const nameCountMap = {};
+    let sorted = [];
+    members.forEach(member => {
+      if (!nameCountMap[member.name]) {
+        nameCountMap[member.name] = 1;
+        sorted.push(member);
+        return;
+      }
+
+      sorted.push(member);
+      nameCountMap[member.name]++; // Take the slice of duplicates that we want to sort by audience
+
+      const slice = sorted.splice(sorted.length - nameCountMap[member.name]); // Sort the slice by lowest audience
+
+      const sortedSlice = slice.sort((a, b) => {
+        const firstObjLowestAudience = getLowestAudience(a.subjectPresentationAudiences.data);
+        const secondObjLowestAudience = getLowestAudience(b.subjectPresentationAudiences.data);
+        return firstObjLowestAudience.name.localeCompare(secondObjLowestAudience.name);
+      });
+      sorted = sorted.concat(sortedSlice);
+    });
+    return sorted;
+  }
+
+};
+
+/***/ }),
+
+/***/ "../../libs/shared/src/utils/PageTitleHelper.ts":
+/*!******************************************************************************************!*\
+  !*** C:/ClickView Projects/@clickview/packages/libs/shared/src/utils/PageTitleHelper.ts ***!
+  \******************************************************************************************/
+/*! exports provided: PageTitleHelper */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PageTitleHelper", function() { return PageTitleHelper; });
+/* harmony import */ var _common_src_backbone__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../common/src/backbone */ "../../libs/common/src/backbone/index.ts");
+
+const TITLE_LENGTH = 60;
+const SUFFIX = ' - ClickView';
+
+const trimTitle = title => {
+  if (title.length + SUFFIX.length <= TITLE_LENGTH) return title + SUFFIX;
+  return title.substring(0, TITLE_LENGTH - 3) + '...' + SUFFIX;
+};
+
+const PageTitleHelper = {
+  setPageTitle(title) {
+    if (!title) return;
+    _common_src_backbone__WEBPACK_IMPORTED_MODULE_0__["Core"].LocationUtils.SetPageTitle(trimTitle(title));
+  }
+
+};
+
+/***/ }),
+
+/***/ "./src/apps/playlists/components/playlist-list-header/PlaylistListHeader.tsx":
+/*!***********************************************************************************!*\
+  !*** ./src/apps/playlists/components/playlist-list-header/PlaylistListHeader.tsx ***!
+  \***********************************************************************************/
+/*! exports provided: PlaylistListHeader */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistListHeader", function() { return PlaylistListHeader; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone */ "../../libs/common/src/backbone/index.ts");
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/utils/SvgHelper */ "../../libs/shared/src/utils/SvgHelper.ts");
+/* harmony import */ var _libs_shared_src_components_banner_header_BannerHeader__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/banner-header/BannerHeader */ "../../libs/shared/src/components/banner-header/BannerHeader.tsx");
+/* harmony import */ var shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared/constants/LiteActions */ "./src/shared/constants/LiteActions.ts");
+/* harmony import */ var apps_playlists_components_sort_select_PlaylistSortSelect__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! apps/playlists/components/sort-select/PlaylistSortSelect */ "./src/apps/playlists/components/sort-select/PlaylistSortSelect.tsx");
+
+
+
+
+
+
+
+var namespace = 'playlists.playlistListHeader';
+function PlaylistListHeader(props) {
+  var currentAppLink = _libs_common_src_backbone__WEBPACK_IMPORTED_MODULE_1__["Core"].AppLinkHelper.getCurrentAppLink();
+  var actions = [{
+    label: _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].getPhrase(namespace, 'newPlaylist'),
+    appLink: {
+      application: currentAppLink.application,
+      action: shared_constants_LiteActions__WEBPACK_IMPORTED_MODULE_5__["Actions"].Playlists.NEW_PLAYLIST
+    },
+    svgName: _libs_shared_src_utils_SvgHelper__WEBPACK_IMPORTED_MODULE_3__["cvSvgLibrary"].Plus,
+    className: 'btn btn-light',
+    button: true
+  }];
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'mb-3'
+  }, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_components_banner_header_BannerHeader__WEBPACK_IMPORTED_MODULE_4__["BannerHeader"], {
+    heading: _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].getPhrase(namespace, 'header'),
+    banner: null,
+    imageCdnUrl: props.imageCdnUrl,
+    actions: actions,
+    sortComponent: react__WEBPACK_IMPORTED_MODULE_0__["createElement"](apps_playlists_components_sort_select_PlaylistSortSelect__WEBPACK_IMPORTED_MODULE_6__["PlaylistSortSelect"], {
+      type: props.sortType,
+      getSortAppLink: props.getSortAppLink
+    })
+  }));
+}
+
+/***/ }),
+
+/***/ "./src/apps/playlists/components/sort-select/PlaylistSortSelect.tsx":
+/*!**************************************************************************!*\
+  !*** ./src/apps/playlists/components/sort-select/PlaylistSortSelect.tsx ***!
+  \**************************************************************************/
+/*! exports provided: PlaylistSortSelect */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistSortSelect", function() { return PlaylistSortSelect; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-bootstrap */ "react-bootstrap");
+/* harmony import */ var react_bootstrap__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_bootstrap__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/utils/FunctionHelper */ "../../libs/common/src/backbone/utils/FunctionHelper.ts");
+/* harmony import */ var _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/apps/playlists/enums/PlaylistSortType */ "../../libs/shared/src/apps/playlists/enums/PlaylistSortType.ts");
+/* harmony import */ var _libs_shared_src_components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/app-link/AppLink */ "../../libs/shared/src/components/app-link/AppLink.tsx");
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+
+
+
+
+
+
+var namespace = 'playlists.playlistSortSelect';
+var getSortTypes = _libs_common_src_backbone_utils_FunctionHelper__WEBPACK_IMPORTED_MODULE_3__["FunctionHelper"].memoize(function () {
+  var _ref;
+
+  return _ref = {}, _defineProperty(_ref, _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_4__["PlaylistSortType"].RecentlyUpdated, {
+    name: _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].getPhrase(namespace, 'recentlyUpdated')
+  }), _defineProperty(_ref, _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_4__["PlaylistSortType"].AtoZ, {
+    name: _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].getPhrase(namespace, 'atoz')
+  }), _defineProperty(_ref, _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_4__["PlaylistSortType"].Newest, {
+    name: _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_2__["LanguageService"].getPhrase(namespace, 'newest')
+  }), _ref;
+});
+function PlaylistSortSelect(props) {
+  var type = props.type,
+      getSortAppLink = props.getSortAppLink;
+  var sortTypes = getSortTypes();
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"], null, react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Toggle, {
+    variant: 'light',
+    id: 'sort-select',
+    className: 'ml-2'
+  }, sortTypes[type].name), react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react_bootstrap__WEBPACK_IMPORTED_MODULE_1__["Dropdown"].Menu, null, Object.values(_libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_4__["PlaylistSortType"]).filter(function (k) {
+    return k !== type;
+  }).map(function (k) {
+    return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_components_app_link_AppLink__WEBPACK_IMPORTED_MODULE_5__["AppLink"], {
+      key: k,
+      className: 'dropdown-item',
+      appLink: getSortAppLink(k)
+    }, sortTypes[k].name);
+  })));
+}
+
+/***/ }),
+
+/***/ "./src/apps/playlists/interfaces/PlaylistCollectionIdentifier.ts":
+/*!***********************************************************************!*\
+  !*** ./src/apps/playlists/interfaces/PlaylistCollectionIdentifier.ts ***!
+  \***********************************************************************/
+/*! exports provided: PlaylistCollectionIdentifier */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistCollectionIdentifier", function() { return PlaylistCollectionIdentifier; });
+/* harmony import */ var _libs_common_src_backbone_interfaces__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../libs/common/src/backbone/interfaces */ "../../libs/common/src/backbone/interfaces/index.ts");
+/* harmony import */ var _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../libs/shared/src/apps/playlists/enums/PlaylistSortType */ "../../libs/shared/src/apps/playlists/enums/PlaylistSortType.ts");
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+
+
+var PlaylistCollectionIdentifier = /*#__PURE__*/function (_BaseCollectionIdenti) {
+  _inherits(PlaylistCollectionIdentifier, _BaseCollectionIdenti);
+
+  var _super = _createSuper(PlaylistCollectionIdentifier);
+
+  function PlaylistCollectionIdentifier() {
+    var sort = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _libs_shared_src_apps_playlists_enums_PlaylistSortType__WEBPACK_IMPORTED_MODULE_1__["PlaylistSortType"].Newest;
+    var cursor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+
+    _classCallCheck(this, PlaylistCollectionIdentifier);
+
+    return _super.call(this, {
+      collectionPrefix: 'user:playlists',
+      cursor: cursor,
+      sort: sort
+    });
+  }
+
+  return PlaylistCollectionIdentifier;
+}(_libs_common_src_backbone_interfaces__WEBPACK_IMPORTED_MODULE_0__["BaseCollectionIdentifier"]);
+
+/***/ }),
+
+/***/ "./src/apps/playlists/views/playlists/PlaylistsView.tsx":
+/*!**************************************************************!*\
+  !*** ./src/apps/playlists/views/playlists/PlaylistsView.tsx ***!
+  \**************************************************************/
+/*! exports provided: PlaylistsView */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PlaylistsView", function() { return PlaylistsView; });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-redux */ "react-redux");
+/* harmony import */ var react_redux__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_redux__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _libs_common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react/utils/ArrayHelper */ "../../libs/common/src/react/utils/ArrayHelper.ts");
+/* harmony import */ var _libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../../../../libs/common/src/backbone/services/LanguageService */ "../../libs/common/src/backbone/services/LanguageService.tsx");
+/* harmony import */ var _libs_common_src_react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../../../../libs/common/src/react */ "../../libs/common/src/react/index.ts");
+/* harmony import */ var _libs_shared_src_flight_requests_PlaylistRequests__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/PlaylistRequests */ "../../libs/shared/src/flight-requests/PlaylistRequests.ts");
+/* harmony import */ var _libs_shared_src_flight_requests_AudienceRequests__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/AudienceRequests */ "../../libs/shared/src/flight-requests/AudienceRequests.ts");
+/* harmony import */ var _libs_shared_src_flight_requests_ConfigRequests__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/ConfigRequests */ "../../libs/shared/src/flight-requests/ConfigRequests.ts");
+/* harmony import */ var _libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/flight-requests/UserRequests */ "../../libs/shared/src/flight-requests/UserRequests.ts");
+/* harmony import */ var _libs_shared_src_hooks_UseInfiniteScroll__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/hooks/UseInfiniteScroll */ "../../libs/shared/src/hooks/UseInfiniteScroll.ts");
+/* harmony import */ var _libs_shared_src_hooks_useSetPageTitle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/hooks/useSetPageTitle */ "../../libs/shared/src/hooks/useSetPageTitle.ts");
+/* harmony import */ var _libs_shared_src_hooks_UseSelectAllPages__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/hooks/UseSelectAllPages */ "../../libs/shared/src/hooks/UseSelectAllPages.ts");
+/* harmony import */ var _libs_shared_src_apps_playlists_components_playlist_list_PlaylistList__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/apps/playlists/components/playlist-list/PlaylistList */ "../../libs/shared/src/apps/playlists/components/playlist-list/PlaylistList.tsx");
+/* harmony import */ var _libs_shared_src_apps_playlists_components_playlist_list_PartialPlaylistList__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList */ "../../libs/shared/src/apps/playlists/components/playlist-list/PartialPlaylistList.tsx");
+/* harmony import */ var _libs_shared_src_apps_playlists_components_empty_state_EmptyPlaylistList__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/apps/playlists/components/empty-state/EmptyPlaylistList */ "../../libs/shared/src/apps/playlists/components/empty-state/EmptyPlaylistList.tsx");
+/* harmony import */ var _libs_shared_src_components_infinite_scroll_footer_InfiniteScrollFooter__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ../../../../../../../libs/shared/src/components/infinite-scroll-footer/InfiniteScrollFooter */ "../../libs/shared/src/components/infinite-scroll-footer/InfiniteScrollFooter.tsx");
+/* harmony import */ var apps_playlists_components_playlist_list_header_PlaylistListHeader__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! apps/playlists/components/playlist-list-header/PlaylistListHeader */ "./src/apps/playlists/components/playlist-list-header/PlaylistListHeader.tsx");
+/* harmony import */ var apps_playlists_interfaces_PlaylistCollectionIdentifier__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! apps/playlists/interfaces/PlaylistCollectionIdentifier */ "./src/apps/playlists/interfaces/PlaylistCollectionIdentifier.ts");
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var namespace = 'playlists.playlists';
+function PlaylistsView(props) {
+  var dispatch = Object(react_redux__WEBPACK_IMPORTED_MODULE_1__["useDispatch"])();
+  var config = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_4__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_ConfigRequests__WEBPACK_IMPORTED_MODULE_7__["ConfigRequests"].config);
+  var user = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_4__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_UserRequests__WEBPACK_IMPORTED_MODULE_8__["UserRequests"].currentUser);
+  var audiences = _libs_common_src_react__WEBPACK_IMPORTED_MODULE_4__["Flight"].useBasicFetch(_libs_shared_src_flight_requests_AudienceRequests__WEBPACK_IMPORTED_MODULE_6__["AudienceRequests"].presentationAudiences());
+
+  var getPlaylistRequest = function getPlaylistRequest(cursor) {
+    return _libs_shared_src_flight_requests_PlaylistRequests__WEBPACK_IMPORTED_MODULE_5__["PlaylistRequests"].getUserPlaylists(new apps_playlists_interfaces_PlaylistCollectionIdentifier__WEBPACK_IMPORTED_MODULE_17__["PlaylistCollectionIdentifier"](props.sort, cursor));
+  };
+
+  var fetchNext = function fetchNext(cursor) {
+    _libs_common_src_react__WEBPACK_IMPORTED_MODULE_4__["Flight"].getFetch(dispatch, getPlaylistRequest(cursor))();
+  };
+
+  var playlists = Object(_libs_shared_src_hooks_UseSelectAllPages__WEBPACK_IMPORTED_MODULE_11__["useSelectAllPages"])(function (cursor) {
+    return getPlaylistRequest(cursor).key;
+  });
+  Object(_libs_shared_src_hooks_useSetPageTitle__WEBPACK_IMPORTED_MODULE_10__["useSetPageTitle"])(_libs_common_src_backbone_services_LanguageService__WEBPACK_IMPORTED_MODULE_3__["LanguageService"].getPhrase(namespace, 'title'));
+  Object(_libs_shared_src_hooks_UseInfiniteScroll__WEBPACK_IMPORTED_MODULE_9__["useInfiniteScroll"])(function () {
+    return fetchNext(playlists.nextCursor);
+  }, !!playlists.nextCursor, playlists.isFetching);
+  react__WEBPACK_IMPORTED_MODULE_0__["useEffect"](function () {
+    if (playlists.shouldInitialFetch) fetchNext();
+  }, [playlists.shouldInitialFetch]);
+  if (_libs_common_src_react_utils_ArrayHelper__WEBPACK_IMPORTED_MODULE_2__["ArrayHelper"].isEmpty(playlists.items)) return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_apps_playlists_components_empty_state_EmptyPlaylistList__WEBPACK_IMPORTED_MODULE_14__["EmptyPlaylistList"], null);
+  return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", {
+    className: 'bg-white padding-gutter'
+  }, !!config.data && !!user.data && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](apps_playlists_components_playlist_list_header_PlaylistListHeader__WEBPACK_IMPORTED_MODULE_16__["PlaylistListHeader"], {
+    user: user.data,
+    imageCdnUrl: config.data.imageCdnUrl,
+    sortType: props.sort,
+    getSortAppLink: props.getSortAppLink
+  }), !!playlists.items && (!!audiences.data || audiences.hasError) ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_apps_playlists_components_playlist_list_PlaylistList__WEBPACK_IMPORTED_MODULE_12__["PlaylistList"], {
+    playlists: playlists.items,
+    getPlaylistAppLink: props.getPlaylistAppLink,
+    presentationAudiences: audiences.data || [],
+    showCount: true
+  }) : react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_apps_playlists_components_playlist_list_PartialPlaylistList__WEBPACK_IMPORTED_MODULE_13__["PartialPlaylistList"], null), !!playlists.items && !!(playlists.nextCursor || playlists.isFetching) && react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_libs_shared_src_components_infinite_scroll_footer_InfiniteScrollFooter__WEBPACK_IMPORTED_MODULE_15__["InfiniteScrollFooter"], {
+    isFetching: playlists.isFetching,
+    onClick: function onClick() {
+      return fetchNext(playlists.nextCursor);
+    }
+  }));
+}
+
+/***/ })
+
+}]);
+//# sourceMappingURL=23.chunk.js.map