https://www.wtatennis.com/resources/v7.50.45/scripts/onboarding-manage-favorites.js

1import{r as e,R as t}from"./index.js";import{c as a}from"./client.js";import{W as n,H as r,F as s,P as o,s as l}from"./store.js";import{af as i,f as c,P as m,r as u,t as d,al as p,e as g,aB as f,aC as E,k as h,E as b,N as _,a5 as y,I as v,p as k,v as T}from"./bundle-es.js";import{p as N}from"./datalayer.js";import{P as R}from"./index2.js";import{VIEWS as O,MFMContext as C}from"./MFMContext.js";import{r as w}from"./index4.js";import{P as I,D as F}from"./player-select.js";import{u as S}from"./use-impression-track.js";import{S as j}from"./svg-icon.js";import{L as A}from"./loader.js";import{u as L}from"./UseFavourites.js";import{T as M}from"./tennis-tournament.js";import{S as P}from"./surface-options.js";import{g as x,c as V}from"./countries.js";import{g as $}from"./getUsersCountryCode.js";import"./_commonjsHelpers.js";import"./tournament-player-service.js";import"./api-client.js";import"./content-api.js";import"./search-api.js";import"./_rollupPluginBabelHelpers.js";import"./SwitchTransition.js";import"./player-headshot.js";import"./tournament-icon-image.js";import"./flag.js";import"./index3.js";import"./index5.js";import"./moment.js";import"./tennis.js";import"./broadcast-api.js";const U={players:"",tournaments:"",regions:""};function G(e,t){switch(t.type){case"players":return{...e,players:t.payload};case"tournaments":return{...e,tournaments:t.payload};case"regions":return{...e,regions:t.payload};default:return e}}function q({isOnboarding:a,featuredCountries:n,children:r}){const[s,o]=e.useState(a),l=O,[i,c]=e.useState(a?"intro":O[0]),[m,u]=e.useState(a),[d,p]=e.useReducer(G,U),[g,f]=e.useState(null),E=e.useMemo(()=>({modalOpen:s,setModalOpen:o,allViews:l,view:i,setView:c,isOnboardingFlow:m,setIsOnboardingFlow:u,featuredCountries:n,searchTerms:d,setSearchTerm:p,infoPane:g,setInfoPane:f}),[l,n,g,m,s,d,i]);return t.createElement(C.Provider,{value:E},r)}function D({onClick:e,messageText:a,messageType:n}){return t.createElement("button",{className:`mfm-info-panel mfm-info-panel--${n} theme-purple`,tabIndex:0,onClick:()=>e()},t.createElement("span",{className:"mfm-info-panel__icon"}),t.createElement("span",{className:"mfm-info-panel__message b-s-sb"},a),t.createElement(j,{name:"close",cssClass:"mfm-info-panel__close"}))}q.propTypes={isOnboarding:R.bool,featuredCountries:R.string,children:R.node},D.propTypes={onClick:R.func.isRequired,messageText:R.string.isRequired,messageType:R.string.isRequired};const z=e.forwardRef((e,a)=>{const{setModalOpen:n,title:r,body:s,children:o}=e;return t.createElement("div",{className:"onboarding-panel",ref:a},t.createElement("div",{className:"onboarding-panel__container"},t.createElement("button",{className:"onboarding-panel__close-icon sbtn sbtn--out sbtn--icon-med",onClick:()=>n(!1),"data-tracking":"true","data-tracking-event":"click_track","data-tracking-component":"button click","data-tracking-category":"control","data-tracking-type":"close modal","data-tracking-detail":"onboarding"},t.createElement(j,{cssClass:"",name:"close"})),t.createElement("span",{className:"onboarding-panel__icon-container"},t.createElement(j,{name:"tick",cssClass:"onboarding-panel__icon"})),t.createElement("h3",{className:"onboarding-panel__title h-m-sb"},r),t.createElement("p",{className:"onboarding-panel__body b-l-m"},s)),t.createElement("span",{className:"onboarding-panel__image"}),t.createElement("div",{className:"onboarding-panel__buttons"},o))});function K({slug:a,items:n}){const{infoPane:r,setInfoPane:s}=e.useContext(C),{favourites:o}=L(a),l=async e=>{const t={id:e.id,name:e.name},n=o.some(t=>t.id===e.id);try{if(n){await c.remove(a,t);const e={event:"click_track",component:"button click",category:"control",type:a===m.FAVORITE_PLAYERS?"remove favorite":`remove favorite ${i[a]}`};a===m.FAVORITE_TOURNAMENTS?e.tournament_id=t.id:e.detail=t.name,u(e)}else{await c.add(a,t,!1);const e={event:"click_track",component:"button click",category:"control",type:a===m.FAVORITE_PLAYERS?"make favorite":`favorite ${i[a]}`};a===m.FAVORITE_TOURNAMENTS?e.tournament_id=t.id:e.detail=t.name,u(e)}r&&s(null)}catch(e){s({message:e?.message||d.lookup("label.manageFavourites.error.default"),type:"error"})}};return t.createElement("div",{className:"mfm__list"},n.map((e,n)=>t.createElement(I,{key:`${e.id}-${n}`,mode:"favourite",type:i[a],item:e,handleSelect:l,selected:o.some(t=>t.id===e.id)}

1)))}K.propTypes={slug:R.string.isRequired,items:R.array.isRequired};function Y(){const{rankingsData:e,rankingsIsLoading:a,rankingsIsError:r,rankingsError:s,rankingsIsSuccess:o}=n({params:{metric:"SINGLES",type:"rankSingles",sort:"asc",pageSize:100}},{selectFromResult:({data:e,isLoading:t,isError:a,error:n,isSuccess:r})=>({rankingsData:e?.length?B(e):[],rankingsIsLoading:t,rankingsIsError:a,rankingsError:n,rankingsIsSuccess:r})});if(a)return t.createElement(A,null);if(r)return console.error("Error fetching data:",{rankingsError:s}),null;if(o&&e?.length){const a=e.slice(0,5),n=e.slice(5);return t.createElement(t.Fragment,null,t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.players.featured")),t.createElement(K,{slug:m.FAVORITE_PLAYERS,items:a}),t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.players.all")),t.createElement(K,{slug:m.FAVORITE_PLAYERS,items:n}))}return null}function B(e){return e.map(e=>({name:e?.player?.fullName,id:e?.player?.id,countryCode:e?.player?.countryCode,firstName:e?.player?.firstName,lastName:e?.player?.lastName}))}Y.propTypes={};function H({searchTerm:a}){const[n,{searchedPlayers:s,searchIsLoading:o,searchIsError:l,searchError:i,searchIsSuccess:c}]=r({selectFromResult:({data:e,isLoading:t,isError:a,error:n,isSuccess:r})=>({searchedPlayers:e?.hits?.length?W(e.hits):[],searchIsLoading:t,searchIsError:a,searchError:n,searchIsSuccess:r})});return e.useEffect(()=>{let e;return e=setTimeout(()=>n({params:{terms:`${a}*`,size:100,type:"PLAYER",start:0,fullObjectResponse:!0}}),500),()=>{clearTimeout(e)}},[n,a]),o?t.createElement(A,null):l?(console.error("Error fetching data:",{searchError:i}),null):c&&s?.length?t.createElement(t.Fragment,null,t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.searchResults")),t.createElement(K,{slug:m.FAVORITE_PLAYERS,items:s})):null}function W(e){return e.map(e=>({name:e?.contentReference?.fullName,id:e?.contentReference?.id,countryCode:e?.contentReference?.countryCode,firstName:e?.contentReference?.firstName,lastName:e?.contentReference?.lastName}))}function X(){const{searchTerms:a}=e.useContext(C),n=a?.players;return n?.length>=2?t.createElement(H,{searchTerm:n}):t.createElement(Y,null)}H.propTypes={searchTerm:R.string.isRequired},X.propTypes={};const J=(new Date).getFullYear(),Q=`${J}-01-01`,Z=`${J}-12-31`;function ee(){const{tournamentsData:a,tournamentsIsLoading:n,tournamentsIsError:r,tournamentsError:o,tournamentsIsSuccess:l}=s({params:{page:0,pageSize:100,excludeLevels:"ITF",from:Q,to:Z}},{selectFromResult:({data:e,isLoading:t,isError:a,error:n,isSuccess:r})=>({tournamentsData:e?.content?.length?te(e.content):[],tournamentsIsLoading:t,tournamentsIsError:a,tournamentsError:n,tournamentsIsSuccess:r})});return n?t.createElement(A,null):r?(console.error("Error fetching data:",{tournamentsError:o}),null):l&&a?.length?t.createElement(t.Fragment,null,a.map((a,n)=>t.createElement(e.Fragment,{key:`${a[0].level}-${n}`},t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},p[a[0].level]?t.createElement("img",{className:"mfm__list-subtitle-icon",src:`${g.cdn}i/elements/${p[a[0].level]}.svg`,alt:a[0].level}):a[0].level),t.createElement(K,{slug:m.FAVORITE_TOURNAMENTS,items:a})))):null}function te(e){const t=function(e){const t=new Map;return e.forEach(e=>{const a=e.level?.toLowerCase();t.has(a)||t.set(a,[]),t.get(a).push(e)}),t}(e.map(e=>{const t=new M(e);return{name:t.title,level:t.level,id:t.tournamentGroup.id,currentYear:t.year,priority:t.priority,tournament:t}})),a=Array.from(t.values());return a.sort((e,t)=>e[0].priority-t[0].priority),a.forEach(e=>e.sort((e,t)=>e?.name?.localeCompare(t?.name))),a}ee.propTypes={};function ae({searchTerm:a}){const[n,{searchedTournaments:s,searchIsLoading:o,searchIsError:l,searchError:i,searchIsSuccess:c}]=r({selectFromResult:({data:e,isLoading:t,isError:a,error:n,isSuccess:r})=>({searchedTournaments:e?.hits?.length?ne(e.hits):[],searchIsLoading:t,searchIsError:a,searchError:n,searchIsSuccess:r})});return e.useEffect(()=>{let e;return e=setTimeout(()=>n({params:{terms:`${a}*`,size:100,type:"TOURNAMENTGROUP",start:0,fullObjectResponse:!0}}),500),()=>{clearTimeout(e)}},[n,a]),o?t.createElement(A,null):l?(console.error("Error fetching data:",{searchError:i}),null):c&&s?.length?t.createElement(t.Fragment,null,t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.searchResults")),t.createElement(K,{slug:m.FAVORITE_TOURNAMENTS,items:s})):null}function ne(e){return e.map(e=>{const t=new M(e.contentReference);return{name:t.title,level:t.level,id:t.tournamentGroup.id,currentYear:t.year,priority:t.priority,tournament:t}})}function re(){const{searchTerms:a}=e.useContext(C),n=a?.tournaments;return n?.length>=2?t.createElement(ae,{searchTerm:n}):t.createElement(ee,null)}function se(){return t.createElement(K,{slug:m.FAVORITE_SURFACES,items:P})}function oe({allCountries:a}){const{featuredCountries:n}=e.useContext(C),[r,s]=e.useState(null),o=n.replace(" ","").split(","),l=r&&!n.includes(r)?[...o,r]:o,i=l.map(e=>{const t=x("code",e);return{id:e,name:t?.label,alpha3:t?.alpha3}}),c=a.filter(e=>!l.includes(e.id));return e.useEffect(()=>{(async()=>{const e=await $();if(!e)return;const t=x("alpha2",e);t?.code&&s(t.code)})()},[a]),t.createElement(t.Fragment,null,t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.regions.featured")),t.createElement(K,{slug:m.FAVORITE_COUNTRIES_REGIONS,items:i}),t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.regions.all")),t.createElement(K,{slug:m.FAVORITE_COUNTRIES_REGIONS,items:c}))}function le({searchTerm:e,allCountries:a}){const n=a.filter(t=>function(e="",t=""){const a=e.toLowerCase(),n=t.toLowerCase().split(" ").filter(e=>e.length);return 0===n.length||n.every(e=>a.includes(e))}(t.name,e));return t.createElement(t.Fragment,null,t.createElement("h3",{className:"mfm__list-subtitle l-m-m"},d.lookup("label.manageFavourites.searchResults")),t.createElement(K,{slug:m.FAVORITE_COUNTRIES_REGIONS,items:n}))}

1ae.propTypes={searchTerm:R.string.isRequired},re.propTypes={},se.propTypes={},oe.propTypes={allCountries:R.array.isRequired},le.propTypes={searchTerm:R.string.isRequired,allCountries:R.array.isRequired};const ie=V.map(e=>({id:e.code,name:e.label,alpha3:e.alpha3}));function ce(){const{searchTerms:a}=e.useContext(C),n=a?.regions;return n?.length>=2?t.createElement(le,{allCountries:ie,searchTerm:n}):t.createElement(oe,{allCountries:ie})}function me(){const{view:a,allViews:n,isOnboardingFlow:r}=e.useContext(C);return e.useEffect(()=>{u({event:"impression_track",component:"modal viewed",category:r?"onboarding":"manage favorites",type:"personalisation",detail:r?`step ${n.indexOf(a)+1} of ${n.length}: ${a}`:a})},[n,r,a]),"players"===a?t.createElement(X,null):"tournaments"===a?t.createElement(re,null):"surfaces"===a?t.createElement(se,null):"regions"===a?t.createElement(ce,null):null}ce.propTypes={},me.propTypes={};function ue(){const{view:a,setView:n,allViews:r,modalOpen:s}=e.useContext(C),o=e.useRef(null),l=e.useRef(null);e.useLayoutEffect(()=>{const e=l?.current;return s&&e&&setTimeout(()=>f(e),0),()=>{E(e)}},[s]),e.useEffect(()=>{o?.current&&s&&h("horizontal-nav/horizontal-nav",o.current)},[s]);const i=e=>{l.current&&l.current.scrollBy({left:.8*l.current.clientWidth*("left"===e?-1:1),behavior:"smooth"})};return t.createElement("div",{className:"mfm__change-view","data-widget":"horizontal-nav/horizontal-nav",ref:o},t.createElement("button",{className:"mfm__change-view-arrow mfm__change-view-arrow--left sbtn sbtn--icon-small sbtn--gt",onClick:()=>i("left"),"aria-label":"scroll left"},t.createElement(j,{cssClass:"mfm__change-view-arrow-icn",name:"chevron-down"})),t.createElement("ul",{className:"mfm__change-view-list js-horizontal-scroll js-detect-overflow",ref:l},r.map((e,r)=>t.createElement("li",{className:"mfm__change-view-item",key:`${e}-${r}`},t.createElement("button",{className:"sbtn sbtn--small "+(e===a?"is-active sbtn--fill":"sbtn--out"),onClick:()=>n(e)},d.lookup(`label.manageFavourites.${e}.title`))))),t.createElement("button",{className:"mfm__change-view-arrow mfm__change-view-arrow--right sbtn sbtn--icon-small sbtn--gt",onClick:()=>i("right"),"aria-label":"scroll right"},t.createElement(j,{cssClass:"mfm__change-view-arrow-icn",name:"chevron-down"})))}function de({title:a,handleModalClose:n}){const{isOnboardingFlow:r,searchTerms:s,setSearchTerm:o,view:l}=e.useContext(C),i=void 0!==s[l];return t.createElement("div",{className:"mfm__header"},t.createElement("div",{className:"mfm__header-top-row"},t.createElement("button",{className:"mfm__close sbtn sbtn--out sbtn--icon-med",onClick:n,"data-tracking":"true","data-tracking-event":"click_track","data-tracking-component":"button click","data-tracking-category":"control","data-tracking-type":"close modal","data-tracking-detail":r?"onboarding":"manage favorites"},t.createElement(j,{name:"close"})),t.createElement("h2",{className:"mfm__title h-s-sb"},a)),r?null:t.createElement(ue,null),i?t.createElement("div",{className:"mfm__search-input-bar"},t.createElement(j,{name:"search",cssClass:"mfm__search-icon"}),t.createElement("input",{type:"text",className:"mfm__search-input-field b-m-m","aria-label":d.lookup(`label.manageFavourites.${l}.search`),placeholder:d.lookup(`label.manageFavourites.${l}.search`),value:s[l],onChange:e=>o({type:l,payload:e.target.value})})):null)}function pe(){const{allViews:a,view:n,setView:r}=e.useContext(C),s=a.indexOf(n),o=0!==s?a[s-1]:null,l=s<a.length?a[s+1]:null,i=(s+1)/a.length;return t.createElement("div",{className:"mfm__footer"},t.createElement(t.Fragment,null,t.createElement("div",{id:"onboarding-progress-bar",className:"mfm__progress","aria-hidden":"true"},t.createElement("span",{className:"mfm__progress-value",style:{transform:`scaleX(${i})`}})),t.createElement("div",{className:"mfm__step-row"},t.createElement("button",{className:"mfm__step-btn sbtn sbtn--large "+(o?"sbtn--gt":"sbtn--fill is-disabled"),disabled:!o,onClick:()=>o&&r(o)},d.lookup("label.onboarding.prev")),t.createElement("span",{className:"mfm__footer-label l-m-m",dangerouslySetInnerHTML:{__html:d.lookup("label.onboarding.steps",{currentStep:s+1,allSteps:a.length})}}),t.createElement("button",{className:"mfm__step-btn sbtn sbtn--large sbtn--fill",onClick:()=>r(l||"complete")},l?d.lookup("label.onboarding.next"):d.lookup("label.onboarding.finish")))))}

1function ge(){const{view:a,setView:n,isOnboardingFlow:r,setIsOnboardingFlow:s,modalOpen:o,setModalOpen:l,infoPane:i,setInfoPane:u}=e.useContext(C);e.useEffect(()=>{const e=async e=>{e?.detail?.view&&n(e.detail.view),l(!0)};return document.addEventListener(b.FAVOURITING.OPEN_MFM,e),()=>document.removeEventListener(b.FAVOURITING.OPEN_MFM,e)},[l,n]),e.useEffect(()=>{if(!i)return;const e=setTimeout(()=>{u(null)},c.favouriteUI.promptTimeoutDuration*_.ONE_SECOND_IN_MS);return()=>clearTimeout(e)},[i,u]),e.useEffect(()=>{r&&y.setPreference(m.ONBOARDING_COMPLETE,!0)},[r]);const p=e.useCallback(()=>{r&&s(!1),l(!1)},[r,s,l]),g=S({component:"modal viewed",category:"onboarding",type:"personalisation",detail:"finish"});return t.createElement(t.Fragment,null,w.createPortal(t.createElement(F,{modalOpen:o,setModalOpen:l,closeLabel:d.lookup("label.manageFavourites.save"),showCloseButton:!r,clickOutsideToClose:!r,onClose:p},o?"intro"===a?t.createElement(z,{setModalOpen:l,title:d.lookupKey("label.onboarding.intro.heading"),body:d.lookupKey("label.onboarding.intro.body")},t.createElement("button",{onClick:()=>n("players"),className:"sbtn sbtn--fill sbtn--large","data-tracking":"true","data-tracking-event":"click_track","data-tracking-component":"button click","data-tracking-category":"cta","data-tracking-type":"process","data-tracking-detail":d.lookupKey("label.onboarding.cta.start")},d.lookupKey("label.onboarding.cta.start"))):"complete"===a?t.createElement(z,{setModalOpen:l,title:d.lookupKey("label.onboarding.complete.heading"),body:d.lookupKey("label.onboarding.complete.body"),ref:g},t.createElement("a",{href:d.lookupKey("url.onboarding.complete.cta"),className:"sbtn sbtn--fill sbtn--large"},d.lookupKey("label.onboarding.complete.cta")),t.createElement("button",{onClick:p,className:"sbtn sbtn--gt sbtn--large"},d.lookupKey("label.onboarding.complete.cta.close"))):t.createElement("div",{className:"mfm "+(r?"":"mfm--footer-fade")},t.createElement(de,{title:d.lookup(`label.${r?"onboarding":"manageFavourites"}.${a}.title`),handleModalClose:p}),t.createElement(me,null),r?t.createElement(pe,null):null,i?.message&&i?.type?t.createElement(D,{onClick:()=>u(null),messageText:i?.message,messageType:i?.type}):null):null),document.body))}ue.propTypes={},de.propTypes={title:R.string.isRequired,handleModalClose:R.func.isRequired},pe.propTypes={},ge.propTypes={};class fe{constructor(e){this.container=e,this.containerRoot=a.createRoot(this.container),this.featCountriesAttr=this.container.dataset.featuredCountries,this.showOnboardingModal="true"===v("forceOnboarding"),this.userFavouritePlayers=[],this.checkUserOnboardingStatus()}async checkUserOnboardingStatus(){if(!await k.ready())return void document.addEventListener(b.FAVOURITING.OPEN_MFM,e=>{T(b.FAVOURITING.MODAL_TRIGGERED,{modalType:"sso",context:`manage favourites: ${e?.detail?.view||"add"}`})});await y.getPreference(m.ONBOARDING_COMPLETE)||(this.showOnboardingModal=!0),this.showOnboardingModal&&N("onboarding_start"),this.renderFavPlayerSearch()}renderFavPlayerSearch(){this.containerRoot.render(t.createElement(o,{store:l},t.createElement(q,{isOnboarding:this.showOnboardingModal,featuredCountries:this.featCountriesAttr},t.createElement(ge,null))))}}export{fe as default};