2 lines
14 KiB
JavaScript
Executable File
2 lines
14 KiB
JavaScript
Executable File
"use strict";(("undefined"!=typeof self?self:global).webpackChunkopen=("undefined"!=typeof self?self:global).webpackChunkopen||[]).push([[4868],{75613:(e,n,t)=>{t.r(n),t.d(n,{default:()=>Fe});var a=t(59496),i=t(94716),s=t(3802),o=t(96170),r=t(84875),l=t.n(r),d=t(91929),c=t(67353),m=t(5153);const f="POL2MEn4kYvvhOfLsg0r",u="tGegSRxI7iLscjOezFfw",h="cVkF9UmUxF_89Q1pcUFS",p="RUQ0KeNlKc47sIZUr2ED",b="dLo0jrUD6hWn4kzbBOFm",_="oNgy3yKSOHI7KTpQJ1xJ",x="vTyWYlhrqCiKKKiGcTo8",y="WNzIvGMAnUhnZVlXsJJW",w="FGbrgB0DUj2wsUM9ACxp",E="ShjUoZcnXBRAwzptB42a",T="NRAlsO_QA8qpg_K2hswA",j="eCiEDXVKutfSeGT8XqGT",v="ZH4_Li3IiGysnYCQtQdW",g="wUrmLCaGCvSO51jcjHhe",N="u7oKAIw5c11Ss7QxopQx";var I=t(4637);const R="PREMIUM_TIER",S=({tiers:e,benefitLabel:n})=>(0,I.jsx)("thead",{className:x,children:(0,I.jsxs)("tr",{children:[(0,I.jsx)("th",{className:l()(E,T),children:n}),e.map(((e,n)=>(0,I.jsx)("th",{className:E,children:(0,I.jsx)("div",{className:l()(p,e.id===R?_:b),dangerouslySetInnerHTML:{__html:e.name}})},n)))]})}),k=({benefit:e,index:n,comparisonItemList:t})=>{const[i,s]=(0,a.useState)(!1);return(0,I.jsxs)("tr",{className:y,style:{"--animationDelay":100*n+"ms"},onMouseOver:()=>s(!0),onMouseLeave:()=>s(!1),onFocus:()=>s(!0),onBlur:()=>s(!1),children:[(0,I.jsxs)("td",{className:l()(j),children:[(0,I.jsx)("span",{children:e.name}),(0,I.jsx)("div",{className:l()(N,{[u]:i}),children:i&&(0,I.jsx)(c.u,{colorSet:"invertedLight",children:e.description})})]}),t.map((e=>(0,I.jsx)("td",{className:v,children:(0,I.jsx)("div",{className:l()(g,{[w]:e.id===R}),children:e.is_benefit_present?(0,I.jsx)(m.K,{className:h,iconSize:32}):"-"})},e.id)))]})},D=({tableData:e,spec:n})=>{const{ref:t,inView:i}=(0,d.YD)(),s=(0,a.useCallback)((n=>e.comparison.find((e=>e.benefit_id===n))),[e.comparison]),r=(0,a.useMemo)((()=>n?.comparisonTableFactory()),[n]),c=(0,o.Wi)(r);return(0,I.jsx)("div",{className:l()(f,{[u]:i}),ref:t,children:(0,I.jsxs)("table",{ref:c,children:[(0,I.jsx)(S,{tiers:e.tier,benefitLabel:e.benefit_label_text}),(0,I.jsx)("tbody",{children:e.benefit.map(((e,n)=>{const t=s(e.benefit_id);return t?(0,I.jsx)(k,{index:n,benefit:e,comparisonItemList:t.tier_benefit},e.name):null}))})]})})};var C=t(56162),L=t(79475),F=t(94285),M=t(63082),U=t(65735),P=t(66490);const O="akdMqUKXxdAp0FCJzDCT",A="mLrfUuFeF2k3BIxJimkY",W="RpNlq57TSskxD3Ra6Yfg",z="AzZBnbf197O9XdTTmoi3",B="_vt32jjXyqbFifhAeVbS",Y="YQQwMcVNQIqsmNu0DgMW",Q="dpOre1_sqBw8b5hkncRz",G=({data:e,refToStoreFront:n})=>{const{spec:t,logger:s}=(0,o.fU)(i.r,{data:{identifier:"Hero"}}),r=(0,a.useMemo)((()=>t.heroContainerFactory({identifier:""})),[t]),l=(0,o.Wi)(r),{openURLWithSessionTransfer:d}=(0,P.e)(),c="https://www.spotify.com/us/purchase/offer/default-trial-1m/?country=US",m=(0,a.useCallback)((e=>{d(c,"_blank"),e.preventDefault(),s.logInteraction(r.heroCheckoutButtonFactory().hitNavigateToExternalUri({destination:c}))}),[r,s,d]),f=(0,a.useCallback)((e=>{n?.current&&n?.current.scrollIntoView({behavior:"smooth",block:"start"}),e.preventDefault(),s.logInteraction(r.heroViewPlansButtonFactory().hitQuickScroll())}),[r,s,n]);return(0,I.jsxs)("div",{className:O,ref:l,children:[(0,I.jsx)("div",{className:A,children:(0,I.jsx)(C.D,{as:"p",color:"var(--spice-text)",semanticColor:"textBase",dangerouslySetInnerHTML:{__html:e.tagline}})}),(0,I.jsx)("div",{className:W,children:(0,I.jsxs)("div",{className:z,"data-testid":"premium-hero",children:[(0,I.jsx)(C.D,{as:"h1",variant:"altoBrio",color:"var(--spice-text)",semanticColor:"textBase",style:{fontSize:"48px"},children:e.header}),(0,I.jsx)(C.D,{as:"p",variant:"finale",color:"var(--spice-text)",semanticColor:"textBase",style:{fontSize:"18px"},children:e.subheader}),(0,I.jsxs)("div",{className:Y,children:[(0,I.jsxs)(L.D,{colorSet:"invertedLight",className:Q,onClick:m,children:[e.cta[0].text,(0,I.jsx)(F.T,{style:{marginLeft:"4px"}})]}),(0,I.jsx)(M.P,{style:{borderColor:"white"},className:Q,onClick:f,children:e.cta[1].text})]}),(0,I.jsxs)(C.D,{as:"p",variant:"finale",color:"var(--spice-text)",semanticColor:"textBase",style:{fontSize:"12px"},children:[(0,I.jsx)(U.h,{href:e.legalTermsLink,className:B,children:e.legalTermsCopyLink}),e.legalTermsCopy]})]})})]})},V={headline:"Affordable plans for any situation",text:"Choose a Premium plan and listen to ad-free music without limits on your phone, speaker, and other devices. Pay in various ways. Cancel anytime."},q={headline:"Experience the difference",text:"Choose a plan and listen to music without ad breaks without limits on your phone, speaker, and other devices. Pay in various ways. Cancel anytime. "},K={benefit:[{benefit_id:"TEST1",name:"Music & podcasts",description:"Get over 80 million songs and playlists. tooltip test",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"AD_FREE",name:"Ad-free music listening",description:"Ad-free music listening",explanation:"Listen to music without ad breaks."},{benefit_id:"OFFLINE_LISTENING",name:"Download songs",description:"Get over 80 million songs and playlists made just for you. Discover new music and exclusive podcasts.",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"TEST4",name:"Turn off shuffle",description:"Download to listen offline",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"TEST5",name:"High audio quality",description:"Download to listen offline",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"TEST6",name:"Listen with friends in real time",description:"Download to listen offline",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"TEST7",name:"Personalized recommendations for playlists",description:"Download to listen offline",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."},{benefit_id:"TEST8",name:"Organize listening queue",description:"Download to listen offline",explanation:"Download your music and podcasts, and take them anywhere your internet can't go. On Premium, you can download albums, playlists, and podcasts. You can download as many as 10,000 songs on each of up to 5 different devices."}],benefit_label_text:"What you get",tier:[{id:"FREE_TIER",name:"Spotify’s<br />Free<br />plan"},{id:"PREMIUM_TIER",name:"Spotify<br />Premium<br />plans"}],comparison:[{benefit_id:"TEST1",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!0},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"OFFLINE_LISTENING",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"AD_FREE",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"TEST4",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"TEST5",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"TEST6",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"TEST7",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]},{benefit_id:"TEST8",tier_benefit:[{id:"FREE_TIER",is_benefit_present:!1},{id:"PREMIUM_TIER",is_benefit_present:!0}]}]},H={tagline:"YOUR PLAN <b>SPOTIFY FREE</b>",header:"$0 for 1 month of Premium",subheader:"Only $9.99/month after. Cancel anytime.",cta:[{text:"Get 1 month for $0",link:"https://www.spotify.com/us/purchase/offer/default-trial-1m/?country=US"},{text:"View other plans",link:"#plans"}],legalTermsLink:"https://www.spotify.com/us/legal/premium-promotional-offer-terms/",legalTermsCopyLink:"Terms and conditions apply.",legalTermsCopy:" 1 month free not available for users who have already tried Premium."},J={header:"All Premium plans include",benefits:[{benefit_id:"AD_FREE",name:"Ad-free music listening"},{benefit_id:"OFFLINE_LISTENING",name:"Download to listen offline"},{benefit_id:"LISTEN_REAL_TIME",name:"Listen with friends in real time"},{benefit_id:"PERSONALIZED_PLAYLISTS",name:"Personalized recommendations for playlists"},{benefit_id:"QUEUE_LISTENING",name:"Organize listening queue"}]};var X=t(49170),Z=t(37433),$=t(93107);const ee="VzviswMm09w3dQfC8lru",ne="tNVUR4rF_p6tBTOwRWPq",te="sCOqDLE2VCgdHLQWAkO8",ae="d8JsMhFLXAlS2cWVVUAG",ie="ouOBKbMepbsGkmoR1zcK",se=({data:e})=>{const{spec:n}=(0,o.fU)(i.r,{data:{identifier:"Education List"}}),t=(0,a.useMemo)((()=>n.educationListContainerFactory()),[n]),s=(0,o.Wi)(t);return(0,I.jsx)("div",{className:ee,ref:s,children:(0,I.jsxs)("div",{className:ne,children:[(0,I.jsx)(C.D,{as:"h2",size:24,variant:"canon",color:"var(--spice-text)",semanticColor:"textBase",children:e.header}),(0,I.jsx)("div",{className:te,children:(0,I.jsx)(X.d,{as:"ul",listStyleReset:!1,className:ae,"aria-label":"premium-benefits",children:e.benefits.map((e=>(0,I.jsxs)("div",{className:ie,children:[(0,I.jsx)(Z.N,{}),(0,I.jsx)($.n,{className:ie,color:"var(--spice-text)",condensed:!0,style:{marginLeft:"4px"},children:e.name},e.benefit_id)]},e.benefit_id)))})})]})})},oe="kvWzzEutUy3QUwNkLAWw",re="vubSV9N3n3DEITzpjM5o",le=({data:e})=>(0,I.jsx)("div",{className:oe,children:(0,I.jsxs)("div",{className:re,children:[(0,I.jsx)(C.D,{as:"h1",variant:"alto",color:"var(--spice-text)",semanticColor:"textBase",children:e.headline}),(0,I.jsx)(C.D,{as:"p",variant:"finale",color:"var(--spice-text)",size:18,semanticColor:"textBase",style:{fontSize:"18px"},children:e.text})]})});var de=t(58706),ce=t(3254);const me="y3ViSrLgazMO2TJM_RRP",fe="iwnDAWn4XCD3paXyyG3w",ue="lEWa4uiYRfyznoBF7fw4",he="thJLqvkbCD4zGMAFZfv5",pe="ilZ6KPPc158pStt57eRw",be="cZiltr0t3M3NuH87VTBb",_e="sF9VpdCb5DPX5wa_NkG8",xe="O3TPI7qQQWvSvj__anxQ",ye="ygV3ht3A2_OY7RFbsJof",we="o5J9jdR1W3KSHeLWkWdu",Ee="CeQ2AnwGQeUIsFqZNhdn",Te={premium:de.$_Y.rose180,duo:de.$_Y.brownYellow172,family:de.$_Y.blueDesat155,mini:de.$_Y.citric186,student:de.$_Y.violetDesat155},je=({text:e})=>(0,I.jsx)("div",{className:ue,children:e}),ve=({benefits:e})=>(0,I.jsx)("ul",{className:ye,children:e.map((e=>(0,I.jsx)("li",{children:e},e)))}),ge=({planName:e,priceText:n,duration:t})=>(0,I.jsxs)("div",{className:he,children:[(0,I.jsx)(C.D,{variant:"mestoBold",className:pe,children:e}),(0,I.jsxs)("div",{className:be,children:[(0,I.jsx)(C.D,{as:"div",variant:"mestoBold",className:_e,children:n}),(0,I.jsx)(C.D,{variant:"mesto",className:xe,children:t})]})]}),Ne=({data:e,cardIndex:n,spec:t})=>{const i=(0,o.$P)(),s=(r=e.encoreColorSetName,Te[r]||Te.premium);var r;const{openURLWithSessionTransfer:l}=(0,P.e)(),d=t?.planCardFactory({identifier:e.planId,position:n}),c=(0,o.Wi)(d),m=(0,a.useCallback)((()=>{if(d){const n=e.checkoutUrl;i.logInteraction(d.planCardButtonFactory({position:0}).hitNavigateToExternalUri({destination:n}))}l(e.checkoutUrl)}),[l,i,e.checkoutUrl,d]);return(0,I.jsxs)("div",{ref:c,style:{"--theme-color":s},className:fe,children:[e.description&&(0,I.jsx)(je,{text:e.description}),(0,I.jsx)(ge,{planName:e.planName,priceText:e.priceText,duration:e.durationText}),(0,I.jsx)(ve,{benefits:e.benefit}),(0,I.jsx)(L.D,{onClick:m,fullWidth:!0,UNSAFE_colorSet:(0,ce.Ev)(s),className:we,children:e.checkoutUrlDescription}),(0,I.jsx)("div",{className:Ee,dangerouslySetInnerHTML:{__html:e.legalDisclaimer}})]})},Ie=(0,a.forwardRef)((({data:e,spec:n},t)=>{const i=(0,a.useMemo)((()=>n?.storefrontContainerFactory({identifier:"StoreFront"})),[n]),s=(0,o.Wi)(i);return(0,I.jsx)("div",{ref:s,children:(0,I.jsx)("div",{className:me,ref:t,children:e?.planCard?.map(((e,n)=>(0,I.jsx)(Ne,{data:e,cardIndex:n,spec:i},e.planId)))})})}));var Re=t(23627),Se=t(9102),ke=t(25899);const De=`${t(27555).pd}/premium-marketing`,Ce=()=>{const{data:e,isLoading:n,isError:t}=(0,Se.useQuery)(["hero"],(async()=>await(async()=>{const e=ke.b.getInstance();return(await e.build().withHost(De).withMethod("GET").withPath("/hero").withoutMarket().withJsonContentType().withEndpointIdentifier("/hero").send()).body})()),{cacheTime:18e5,staleTime:6e5});return{data:e??null,loading:n,error:t}},Le=()=>{const{data:e,isLoading:n,isError:t}=(0,Se.useQuery)(["storefront"],(async()=>await(async()=>{const e=ke.b.getInstance();return(await e.build().withHost(De).withMethod("GET").withPath("/storefront").withoutMarket().withJsonContentType().withEndpointIdentifier("/storefront").send()).body})()),{cacheTime:18e5,staleTime:6e5});return{data:e??null,loading:n,error:t}},Fe=()=>{const e=(0,a.useRef)(null),[n,t]=(0,a.useState)(null),[r,l]=(0,a.useState)(null),d=Ce().data,c=Le().data,{spec:m}=(0,o.fU)(i.r,{data:{identifier:""}}),f=(0,o.Wi)(m);(0,a.useEffect)((()=>{d&&t(d.hero),c&&l(c.storefront)}),[d,c]);const{loading:u,error:h,data:p}=(()=>{const{data:e,isLoading:n,error:t}=(0,Se.useQuery)("premium-page-data",(()=>Promise.resolve("data-from-backend")),{});return{loading:n,error:t,data:e||null}})();return u||!p?(0,I.jsx)(Re.h,{hasError:null!==h,errorMessage:s.ag.get("error.not_found.title.page")}):(0,I.jsxs)("div",{ref:f,children:[n&&(0,I.jsx)(le,{data:{headline:n.header,text:n.legalDisclaimer}}),r&&r.planCard&&(0,I.jsx)(le,{data:{headline:r.planCard[0].planName,text:r.planCard[0].description}}),(0,I.jsx)(G,{data:H,refToStoreFront:e}),(0,I.jsx)(le,{data:V}),(0,I.jsx)(se,{data:J}),(0,I.jsx)(Ie,{data:c?.storefront,ref:e,spec:m}),(0,I.jsx)(le,{data:q}),(0,I.jsx)(D,{tableData:K,spec:m})]})}}}]);
|
||
//# sourceMappingURL=xpui-routes-premium-page.js.map
|