https://musicboard.app/static/js/9168.716b98f2.chunk.js

1"use strict";(self.webpackChunkmusicboard_web=self.webpackChunkmusicboard_web||[]).push([[9168],{18528:(e,t,i)=>{i.d(t,{A:()=>g});var a=i(65043);const s="genreitem_genre__AHJql",r="genreitem_lighterStyle__T3HKI",n="genreitem_selected__-dh8q",o="genreitem_genreText__Zt2sL",l="genreitem_genreIconWrapper__67Dyw",c="genreitem_genreIcon__svqAP",d="genreitem_genreClose__WXEC1";var m=i(64671),u=i(70579);function h(e){let{genre:t,favorite:i,onAdd:a=e=>{},onRemove:h=(e,t)=>{},lighterStyle:g}=e;const x=Boolean(i);return(0,u.jsxs)("div",{className:`${s} ${g?r:""} ${x?n:""}`,onClick:()=>{x?h(t,i):a(t)},children:[(0,u.jsx)("div",{className:l,children:(0,u.jsx)(m.A,{className:c,icon:"Pop"===t.name?"microphone":"Rap/Hip Hop"===t.name?"boombox":"Alternative"===t.name?"alternative":"Rock"===t.name?"guitar":"R&B"===t.name?"glasses":"Electronic"===t.name?"keyboard":"Folk/Country"===t.name?"banjo":"Jazz"===t.name?"trumpet":"Blues"===t.name?"saxophone":"Soul/Funk"===t.name?"microphone-old":"Latin"===t.name?"maracas":"Reggae"===t.name?"drum":"Classical"===t.name?"gramophone":"Soundtrack/Live"===t.name?"masks":"person"})}),(0,u.jsx)("h5",{className:o,children:t.name}),x&&(0,u.jsx)("div",{className:d,children:(0,u.jsx)(m.A,{icon:"close",size:14,color:"var(--white)"})})]})}const g=a.memo(h)},90907:(e,t,i)=>{i.d(t,{A:()=>r});i(65043);var a=i(39739),s=i(70579);const r=function(e){return(0,s.jsxs)(a.Ay,{speed:2,width:280,height:64,backgroundColor:"var(--lightGrey)",foregroundColor:"var(--darkLightGrey)",...e,children:[(0,s.jsx)("circle",{cx:"32",cy:"32",r:e.size?(e.size/2).toString():"24"}),(0,s.jsx)("rect",{x:"72",y:"19",rx:"2",ry:"2",width:"128",height:"10"}),(0,s.jsx)("rect",{x:"72",y:"39",rx:"2",ry:"2",width:"64",height:"6"})]})}},59168:(e,t,i)=>{i.r(t),i.d(t,{FavoriteGenres:()=>Z,FollowUsers:()=>J,MoreToDo:()=>ne,PersonalInfo:()=>ge,RateAlbums:()=>G,Welcome:()=>N});const a="welcome_cover__6fYD4",s="welcome_container__w2prD";var r=i(65043),n=i(97508),o=i(56841),l=i(98863);const c="bottomnav_bottomNav__KVeyC",d="bottomnav_bottomNavMargin__DWxY3",m="bottomnav_timeline__iJ-xF",u="bottomnav_dot__QLlnr",h="bottomnav_line__FVQSp",g="bottomnav_active__Y8Oyx";var x=i(39657),p=i(62582),f=i(45565),b=i(36643),v=i(70579);const y=function(e){let{index:t,next:i,prev:a,showTooltip:s,disableNext:o,onNext:l,nextText:y,tooltipText:j,overrideNextClick:N,loadingNext:_}=e;(0,n.wA)();const w=(0,r.useRef)();(0,r.useEffect)((()=>{s&&setTimeout((()=>{w.current&&setTimeout((()=>{}),3500)}),300)}),[]);const k=(0,x.Ub)({maxWidth:630});return(0,v.jsxs)("div",{children:[(0,v.jsxs)("div",{className:c,children:[k&&(0,v.jsxs)("div",{className:`col-3 margin-left-64 margin-right-64 ${m}`,children:[(0,v.jsx)("div",{className:`${u} ${t>=0?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=1?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=1?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=2?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=2?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=3?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=3?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=4?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=4?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=5?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=5?g:""}`})]}),(0,v.jsxs)("div",{className:d,children:[(0,v.jsx)(p.N_,{className:"col-1",to:a,onClick:()=>window.scrollTo(0,0),style:{pointerEvents:a?"initial":"none"},children:(0,v.jsx)(b.A,{text:"Back",disabled:!a,className:"col-1",style:{height:40},textStyle:{fontSize:14,marginTop:-1}})}),!k&&(0,v.jsxs)("div",{className:`col-3 margin-left-64 margin-right-64 ${m}`,children:[(0,v.jsx)("div",{className:`${u} ${t>=0?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=1?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=1?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=2?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=2?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=3?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=3?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=4?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=4?g:""}`}),(0,v.jsx)("div",{className:`${h} ${t>=5?g:""}`}),(0,v.jsx)("div",{className:`${u} ${t>=5?g:""}`})]}

1),k&&(0,v.jsx)("div",{style:{width:16}}),(0,v.jsxs)("div",{className:"col-1",children:[(0,v.jsxs)("div",{style:{position:"relative"},children:[(0,v.jsx)(p.N_,{style:{pointerEvents:"all"},to:i,onClick:e=>{if(w.current,o)e.preventDefault();else{if(N)return e.preventDefault(),void N();l&&l(),window.scrollTo(0,0)}},children:(0,v.jsx)(b.A,{text:y,disabled:o||_,loading:_,style:{height:40},textStyle:{fontSize:14,marginTop:-1}})}),(0,v.jsx)("div",{id:"onboarding-next-tip",style:{pointerEvents:o?"all":"none",position:"absolute",width:"100%",height:40,top:0}})]}),(0,v.jsx)(f.A,{ref:w,reverseColor:!0,text:j,id:"onboarding-next-tip",offset:22})]})]})]}),(0,v.jsx)("div",{style:{height:k?144:96}})]})};var j=i(20498);const N=function(){const e=(0,o.zy)(),{openAlert:t}=(0,l.M)(),i=new URLSearchParams(e.search).get("pay"),c=(0,n.d4)((e=>e.me.username));return(0,r.useEffect)((()=>{"true"===i&&t({p:"Thank you for subscribing to Musicboard Pro Lifetime! We're thrilled to have you on board.",style:"green",timer:6e3})}),[]),(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"Account Onboarding - Musicboard",description:"Get started with Musicboard. Set up your profile, select favorite genres, and rate your first albums as you join our community of passionate music lovers.",canonical:"https://musicboard.app/onboarding",headingOne:"Onboarding: Welcome to Musicboard!",headingTwo:"The social network for music lovers"}),(0,v.jsxs)("div",{className:s,children:[(0,v.jsx)("div",{className:`${a} margin-top-64`}),(0,v.jsxs)("h3",{className:"text-center text-2xl black margin-top-64",children:["Welcome to Musicboard, ",(0,v.jsx)("a",{style:{textDecoration:"underline"},target:"_blank",href:`/${c}`,children:c}),"!"]}),(0,v.jsx)("p",{className:"text-center darkGrey margin-top-16",style:{maxWidth:610,fontSize:16,lineHeight:"24px"},children:"Musicboard is a platform that allows you to keep track of all the music you listen to and share and grow your passion for music with friends. Our vision is to build a thriving and positive community of music-lovers from all around the world, and we're thrilled you're here for the journey!"})]}

1),(0,v.jsx)(y,{index:0,next:"/onboarding/personal",prev:null,showTooltip:!0,disableNext:!1,onNext:null,nextText:"Continue",tooltipText:"Click here to continue!"})]})};var _=i(43903),w=i.n(_),k=i(47899),S=i(43319),$=i(63724),A=i(20211),C=(i(55859),i(64671)),T=i(84147),M=i(54521),E=i(39526),U=i(57919),R=i(10112);const G=function(){const e=(0,n.wA)(),{openPopup:t}=(0,U.O)(),i=(0,x.Ub)({maxWidth:1100}),a=(0,x.Ub)({maxWidth:960}),s=(0,x.Ub)({maxWidth:768}),o=(0,x.Ub)({maxWidth:630}),[l,c]=(0,r.useState)(""),[d,m]=(0,r.useState)(!1),u=(0,r.useRef)(),h=(0,n.d4)((e=>e.ratings.createRatingStatus)),g=(0,n.d4)((e=>e.albums.allAlbums)),p=(0,n.d4)((e=>e.search.mergedAlbums)),f=(0,n.d4)((e=>e.albums.errorMessage)),b=(0,n.d4)((e=>e.genres.favoriteGenres));(0,r.useEffect)((()=>{h===E.h.SUCCESS&&m(!0)}),[h]),(0,r.useEffect)((()=>{""!==l.trim()?(u.current&&clearTimeout(u.current),p.controller&&p.controller.abort(),u.current=setTimeout((()=>{e((0,$.I_)(l,"album",40))}),200)):e((0,$.EA)())}),[l]),(0,r.useEffect)((()=>(e((0,k.Xh)({genreIds:b.map((e=>e.genre.id)),contentType:"album",limit:40,weekly:!1})),()=>{u.current&&clearTimeout(u.current),e((0,$.EA)())})),[]);const N=""!==l.trim()?p:g;return(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"Rate your first albums - Musicboard",description:"Rate your first albums and artists to get started with Musicboard. Explore music recommended by the community.",canonical:"https://musicboard.app/onboarding/albums",headingOne:"Onboarding: Rate Your First Albums",headingTwo:"Rate or review your first album to get started"}),(0,v.jsxs)("div",{className:"section-handler",children:[(0,v.jsxs)(T.A,{enabled:!a,className:"section-1 section-margin",children:[(0,v.jsx)("h3",{className:"black text-xl padding-top-64",children:"Rate your first albums"}),(0,v.jsxs)("p",{className:"darkGrey margin-top-16",style:{fontSize:16,lineHeight:"24px"},children:["Get your account under way and learn how to use Musicboard by rating a couple of albums. Browse our most popular albums ",a?"below":"on the right",", or search for your favorite music to rate/review. Hover an album and use ",(0,v.jsx)(C.A,{icon:"more-horiz",className:"inline-icon"})," for more options."]})]}),(0,v.jsxs)("div",{className:"section-2 section-margin margin-top-64",children:[(0,v.jsx)(M.A,{lighterStyle:!1,placeholder:"Search for your favorite albums...",text:l,onTextChange:c,rightIcon:""!==l.trim()?"cancel":null,iconColor:"var(--grey)",iconStyle:{cursor:"pointer"},onIconClick:()=>c("")}),(0,v.jsxs)("div",{className:"margin-top-16",children:[N&&N.data&&N.data.length>0&&(N.status!==E.h.BEGIN||!N.reset)&&(0,v.jsx)("div",{children:(0,v.jsx)(w(),{initialLoad:!1,threshold:200,loadMore:()=>{N.next&&(""!==l.trim()?e((0,$.HR)(p,"album")):e((0,S.q6)(g.next,E.g.GET_ALL_ALBUMS,{speedup:!0,limit:40})))},hasMore:Boolean(N.next||N.status===E.h.BEGIN&&!N.reset),loader:(0,v.jsx)("div",{className:"flex-center margin-top-16",children:(0,v.jsx)(C.A,{icon:"loading",disableLoadingAnimation:!0})},"onboarding-ratealbums-load-more"),children:(0,v.jsx)("div",{className:"grid-view "+(o?"three":s?"four":a?"five":i?"four":"five"),children:N.data.map(((e,i)=>(0,v.jsx)(A.A,{number:N.data.findIndex((t=>t.id===e.id))+1,content:e,showArtistName:!0,onClicked:e=>t("CreateReview",{content:e,cacheRating:!1,newTab:!0})},`onboarding-ratealbums-item-${e.id}`)))})})}),N&&N.data&&N.data.length<=0&&N.status===E.h.SUCCESS&&(0,v.jsx)("p",{className:"section-block empty-text",children:"No albums found."}),N&&N.data&&N.data.length<=0&&N.status===E.h.ERROR&&(0,v.jsxs)("p",{className:"section-block empty-text",children:["Error fetching albums. Error: ",f]}),N&&N.status===E.h.BEGIN&&N.reset&&(0,v.jsx)("div",{className:"empty-text flex-center",children:(0,v.jsx)(C.A,{icon:"loading",disableLoadingAnimation:!0})})]})]})]}),(0,v.jsx)(y,{index:3,next:"/onboarding/users",prev:"/onboarding/genres",disableNext:!d,onNext:null,nextText:d?"Continue":"Rate an Album",tooltipText:"Rate or review an album to continue"})]})};var I=i(95810),W=i(30591),z=i(20478),F=i(90907);const L={container:"useritem_container__l7Yi8",active:"useritem_active__VvU6u",lighterStyle:"useritem_lighterStyle__cVCoc"};var O=i(89081),B=i(1232),D=i(70169),P=i(70067);function H(e){var t;let{user:i,onAdd:a=()=>{},onRemove:s=()=>{},selected:r,followObj:o,blockObj:l,blockedByObj:c,favoriteGenres:d,lighterStyle:m,newTab:u,active:h,size:g=48}=e;const x=(0,n.wA)(),f=(0,n.d4)((e=>e.auth.uid)),y=i.uid===f,j=(0,n.d4)((e=>e.users.lastUnfollowUserUid)),N=(0,n.d4)((e=>e.users.unfollowUserStatus)),_=i.favorite_genres?i.favorite_genres.filter((e=>-1!==d.findIndex((t=>t.genre.id===e.id)))).length>0?i.favorite_genres.filter((e=>-1!==d.findIndex((t=>t.genre.id===e.id)))):i.favorite_genres:[];return c?null:(0,v.jsxs)("div",{className:`link-wrapper ${L.container} ${m?L.lighterStyle:""} ${h?L.active:""}`,children:[(0,v.jsx)(p.N_,{to:`/${i.username}`,className:"link-overlay",target:u?"_blank":null,children:(0,v.jsx)("span",{className:"link-overlay-title",children:""!==i.name?i.name:i.username})}),(0,v.jsxs)("div",{className:"flex-row justify-between cursor link-inner",children:[(0,v.jsxs)("div",{className:"flex-row margin-right-32",children:[(0,v.jsx)(p.N_,{to:`/${i.username}`,target:u?"_blank":null,children:(0,v.jsx)(P.A,{clickable:!0,size:g,profilePicture:i.is_pro&&

11===i.tier&&null!==(t=i.profile_picture)&&void 0!==t&&t.includes(".gif")?i.profile_picture:i.profile_picture_small||i.profile_picture,profileFrame:i.is_pro&&1===i.tier?i.profile_frame:null,className:"link-clickable",altText:""!==i.name?i.name:i.username})}),(0,v.jsxs)("div",{className:"margin-left-16",children:[(0,v.jsxs)("div",{className:"flex-row",style:{display:"inline-flex"},children:[(0,v.jsx)("div",{className:"grid",children:(0,v.jsx)("h5",{className:`${L.text} black one-line`,style:{},children:i.username})}),(i.is_pro||i.is_moderator||i.contributor_tier)&&(0,v.jsx)(D.A,{size:"small",className:"margin-left-8",is_pro:i.is_pro,is_moderator:i.is_moderator,contributor_tier:i.contributor_tier}),i.is_verified&&(0,v.jsx)(B.A,{size:12,className:"margin-left-8"})]}),(""!==i.name||_.length>0)&&(0,v.jsx)("div",{className:"grid",children:(0,v.jsxs)("p",{className:"highDarkGrey margin-top-2 one-line",children:[i.name,""!==i.name&&_.length>0&&" \u2022 ",_.length>0&&`${_[0].name} ${""===i.name?"enthusiast":""}`]})})]})]}),(0,v.jsx)("div",{className:"link-clickable",children:!y&&(0,v.jsx)(b.A,{text:l?"Blocked":o?"Following":r?"Selected":"Follow",type:r||l||o?"secondary-two":"primary",height:34,style:o?{width:110}:{width:112},loading:N===E.h.BEGIN&&j===i.uid,textStyle:r||l||o?{color:"var(--black)",fontSize:13}:{fontSize:14},onClicked:()=>{l?x((0,I.kV)(l.uid,i.uid)):o?x((0,I.Qt)(o.uid,i.uid)):r?s(i):a(i)}})})]})]})}const Y=r.memo(H);var q=i(32850);const J=function(){const{colors:e}=(0,z.DP)(),t=(0,n.wA)(),i=(0,q.n)(),a=(0,x.Ub)({maxWidth:960}),[s,o]=(0,r.useState)([]),[l,c]=(0,r.useState)(""),d=(0,n.d4)((e=>e.genres.favoriteGenres)),m=(0,n.d4)((e=>e.home.suggestedUsers)),u=(0,n.d4)((e=>e.users.allUsers)),h=(0,n.d4)((e=>e.home.errorMessage)),g=[...(0,n.d4)((e=>e.me.follows)),...(0,n.d4)((e=>e.me.cachedFollows))],p=[...(0,n.d4)((e=>e.me.blocks)),...(0,n.d4)((e=>e.me.cachedBlocks))],f=(0,n.d4)((e=>e.me.blockedBy));(0,r.useEffect)((()=>{t((0,W.i9)(d.map((e=>e.genre.id))))}),[]),(0,r.useEffect)((()=>{""!==l.trim()&&t((0,I.CF)({advanced_search:l}))}),[l]);const b=(0,r.useRef)(!1);(0,r.useEffect)((()=>{if(g.length<=0&&!b.current&&0===s.length&&m&&m.data&&m.data.length>0){const e=m.data.filter((e=>!e.favorite_genres||e.favorite_genres.some((e=>-1!==d.findIndex((t=>t.genre.id===e.id)))))).filter(((e,t)=>2!==t&&4!==t&&5!==t&&8!==t&&10!==t&&13!==t)).filter(((e,t)=>t<12));o(e),b.current=!0}}),[m,b]);const N=(0,r.useCallback)((e=>{o((t=>[...t,e]))}),[]),_=(0,r.useCallback)((e=>{o((t=>t.filter((t=>t.uid!==e.uid))))}),[]),k=""!==l.trim()?u:m;return(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"Join the community - Musicboard",description:"Join the Musicboard community! Follow your first friends, see what they're listening to, and join in the conversation.",canonical:"https://musicboard.app/onboarding/users",headingOne:"Onboarding: Follow Community Members",headingTwo:"Join the community and discover new music"}),(0,v.jsxs)("div",{className:"section-handler",children:[(0,v.jsxs)(T.A,{enabled:!a,className:"section-1 section-margin",children:[(0,v.jsx)("h3",{className:"black text-xl padding-top-64",children:"Join the community"}),(0,v.jsx)("p",{className:"darkGrey margin-top-16",style:{fontSize:16,lineHeight:"24px"},children:"Following other members is the best way to discover great reviews and new music. We've selected a few users that match your interests and we think you'd like to follow. You can also search for friends who are already on Musicboard."})]}),(0,v.jsxs)("div",{className:"section-2 section-margin margin-top-64",children:[(0,v.jsx)(M.A,{lighterStyle:!1,placeholder:"Search for friends on Musicboard...",text:l,onTextChange:e=>c(e),rightIcon:""!==l.trim()?"cancel":null,iconColor:e.grey,iconStyle:{cursor:"pointer"},onIconClick:()=>c("")}),(0,v.jsxs)("div",{className:"section-block padding-around-8 margin-top-16",children:[k&&k.data&&k.data.length>0&&(k.status!==E.h.BEGIN||!k.reset)&&(0,v.jsx)("div",{children:(0,v.jsx)(w(),{initialLoad:!1,threshold:200,loadMore:()=>{k.next&&t((0,S.q6)(k.next,""!==l.trim()?E.g.GET_ALL_USERS:E.g.GET_SUGGESTED_USERS,{speedup:!0,limit:24}))},hasMore:Boolean(k.next||k.status===E.h.BEGIN&&!k.reset),loader:(0,v.jsx)(F.A,{},"onboarding-followusers-load-more"),children:(0,v.jsx)("div",{className:"",children:k.data.map(((e,t)=>(0,v.jsx)(Y,{user:e,onAdd:N,onRemove:_,selected:-1!==s.findIndex((t=>t.uid===e.uid)),favoriteGenres:d,blockObj:-1!==p.findIndex((t=>t.blocked_user===e.uid))?p[p.findIndex((t=>t.blocked_user===e.uid))]:null,followObj:-1!==g.findIndex((t=>t.followed_user===e.uid))?g[g.findIndex((t=>t.followed_user===e.uid))]:null,blockedByObj:f&&f.find((t=>t.creator===e.uid)),newTab:!0},`onboarding-followusers-item-${e.uid}`)))})})}),k&&m.data&&k.data.length<=0&&k.status===E.h.SUCCESS&&(0,v.jsx)("p",{className:"empty-text",children:"No users found."}),k&&m.data&&k.data.length<=0&&k.status===E.h.ERROR&&(0,v.jsxs)("p",{className:"empty-text",children:["Error fetching users. Error: ",h]}),k&&k.status===E.h.BEGIN&&k.reset&&(0,v.jsx)("div",{className:"flex-column",children:new Array(12).fill(null).map(((e,t)=>(0,v.jsx)(F.A,{},`onboarding-followusers-loader-${t}`)))})]})]})]}),(0,v.jsx)(y,{index:4,next:"/onboarding/features",prev:"/onboarding/albums",disableNext:g.length+s.length<3,onNext:()=>

1{s.forEach((e=>{i("Follow user",{user_uid:e.uid,referrer:"MultipleUsers"})})),t((0,I.iY)(s))},nextText:g.length+s.length<3?`Follow ${3-s.length} ${3-s.length===1?"User":"Users"}`:"Continue",tooltipText:"Follow a few users to get started"})]})};var X=i(93488),V=i(99364),Q=i(18528);const Z=function(){const e=(0,n.wA)(),{openAlert:t}=(0,l.M)(),i=((0,x.Ub)({maxWidth:1100}),(0,x.Ub)({maxWidth:960})),a=((0,x.Ub)({maxWidth:768}),(0,x.Ub)({maxWidth:630}),(0,n.d4)((e=>e.genres.genres))),s=(0,n.d4)((e=>e.genres.favoriteGenres)),o=(0,n.d4)((e=>e.genres.createFavoriteGenreStatus)),c=(0,n.d4)((e=>e.genres.deleteFavoriteGenreStatus)),d=(0,n.d4)((e=>e.genres.errorMessage));(0,R.g)({effectStatus:o,errorCallback:()=>{t({p:`Could not select genre. Error: ${d}`,timer:6e3,style:"red"})}}),(0,R.g)({effectStatus:c,errorCallback:()=>{t({p:`Could not remove genre. Error: ${d}`,timer:6e3,style:"red"})}});const m=(0,r.useCallback)((t=>{e((0,V.Ud)(t))}),[]),u=(0,r.useCallback)(((i,a)=>{a.uid?e((0,V.XT)(a)):t({p:"Too fast! Try removing the genre again."})}),[]);return(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"Select favorite genres - Musicboard",description:"Tell us about your music preferences! Personalize your Musicboard experience by sharing your favorite genres.",canonical:"https://musicboard.app/onboarding/genres",headingOne:"Onboarding: Select Favorite Genres",headingTwo:"Select your favorite genres to get started"}),(0,v.jsxs)("div",{className:"section-handler",children:[(0,v.jsxs)(T.A,{enabled:!i,className:"section-1 section-margin",children:[(0,v.jsx)("h3",{className:"black text-xl padding-top-64",children:"Select genres"}),(0,v.jsx)("p",{className:"darkGrey margin-top-16",style:{fontSize:16,lineHeight:"24px"},children:"Let's start by figuring out what music you're most passionate about with us. What are your favorite genres?"})]}),(0,v.jsx)("div",{className:"section-2 section-margin margin-top-64",children:(0,v.jsx)("div",{className:"section-block padding-around-8",children:a.map((e=>(0,v.jsx)(Q.A,{genre:e,favorite:s[s.findIndex((t=>t.genre.id===e.id))],onAdd:m,onRemove:u},`onboarding-favoritegenre-${e.id}`)))})})]}),(0,v.jsx)(y,{index:2,next:"/onboarding/albums",prev:"/onboarding/pers

1onal",disableNext:s.length<=0,onNext:null,nextText:s.length<=0?"Select a Genre":"Continue",tooltipText:"Select your favorite genres to continue"})]})},K="moretodo_image__9Ecm8",ee="moretodo_list__0JB8T",te="moretodo_later__YDqY2",ie="moretodo_review__EW5l4",ae="moretodo_stats__Z+X1w",se="moretodo_mobile__5pX3Q",re="moretodo_card__ur2X7";const ne=function(){(0,n.wA)(),(0,x.Ub)({maxWidth:1100});const e=(0,x.Ub)({maxWidth:960}),t=((0,x.Ub)({maxWidth:768}),(0,x.Ub)({maxWidth:630}),(0,n.d4)((e=>e.me.username)));return(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"More to do on Musicboard - Musicboard",description:"Discover more ways to enjoy Musicboard. Learn how to create lists, use our Listen Later feature, and more.",canonical:"https://musicboard.app/onboarding/features",headingOne:"Onboarding: Musicboard Features",headingTwo:"More to do on Musicboard"}),(0,v.jsxs)("div",{className:"section-handler",children:[(0,v.jsxs)(T.A,{enabled:!e,className:"section-1 section-margin",children:[(0,v.jsx)("h3",{className:"black text-xl padding-top-64",children:"You can also do this"}),(0,v.jsxs)("p",{className:"highDarkGrey margin-top-16",style:{fontSize:16,lineHeight:"24px"},children:["Musicboard offers many more features that will help you take your life in music to the next level. Here are some more key aspects of Musicboard for you to explore.",(0,v.jsx)("br",{}),(0,v.jsx)("br",{}),"You can always return to this page from ",(0,v.jsx)(C.A,{icon:"more-horiz",className:"inline-icon"})," and then ",(0,v.jsx)("span",{className:"black",children:"Welcome"})," in the navigation bar."]})]}),(0,v.jsxs)("div",{className:"section-2 section-margin margin-top-64",children:[(0,v.jsx)(p.N_,{target:"_blank",to:"/list/new",children:(0,v.jsxs)("div",{className:`section-block padding-around ${re}`,children:[(0,v.jsx)("div",{className:`${K} ${ee}`}),(0,v.jsx)("h3",{className:"black",style:{marginTop:18},children:"Compile music into lists"}),(0,v.jsxs)("p",{className:"highDarkGrey margin-top-12 margin-bottom-4",style:{fontSize:16,lineHeight:"24px"},children:["We also enable users to create lists and top lists on Musicboard. This is the perfect way to share a collection of your favorite albums, ranking an artist's discography, or showing off your hidden gems. Start a list from the ",(0,v.jsx)(C.A,{icon:"add",className:"inline-icon"})," in the navigation bar or from ",(0,v.jsx)("a",{className:"inline-link",href:`/${t}/lists`,target:"_blank",children:"your collection"}),"."]})]})}),(0,v.jsx)(p.N_,{target:"_blank",to:`/${t}/wantlist`,children:(0,v.jsxs)("div",{className:`section-block padding-around margin-top-32 ${re}`,children:[(0,v.jsx)("div",{className:`${K} ${te}`}),(0,v.jsx)("h3",{className:"black",style:{marginTop:18},children:"Save music to Listen Later"}),(0,v.jsxs)("p",{className:"highDarkGrey margin-top-12 margin-bottom-4",style:{fontSize:16,lineHeight:"24px"},children:["The ",(0,v.jsx)("a",{className:"inline-link",href:`/${t}/wantlist`,target:"_blank",children:"Listen Later"})," feature helps you to keep track of all the music you want to listen to, but haven't gotten around to yet. Add, remove, or sort the list any way you like to quickly find music you want to discover for the day, and easily keep it up to date as new music is being released."]})]})}),(0,v.jsx)(p.N_,{target:"_blank",to:"/reviews",children:(0,v.jsxs)("div",{className:`section-block padding-around margin-top-32 ${re}`,children:[(0,v.jsx)("div",{className:`${K} ${ie}`}),(0,v.jsx)("h3",{className:"black",style:{marginTop:18},children:"Discover what others think"}),(0,v.jsx)("p",{className:"highDarkGrey margin-top-12 margin-bottom-4",style:{fontSize:16,lineHeight:"24px"},children:"Musicboard contains an ever increasing database of reviews for the worlds music. A great way to find new music and new friends is simply by exploring albums and reading reviews on the site, to find the voices and opinions you like. Remember to follow the members you dig!"})]})}),(0,v.jsx)(p.N_,{target:"_blank",to:"/pro?ref=MoreToDo",children:(0,v.jsxs)("div",{className:`section-block padding-around margin-top-32 ${re}`,children:[(0,v.jsx)("div",{className:`${K} ${ae}`}),(0,v.jsx)("h3",{className:"black",style:{marginTop:18},children:"In-depth statistics and more"}),(0,v.jsxs)("p",{className:"highDarkGrey margin-top-12 margin-bottom-4",style:{fontSize:16,lineHeight:"24px"},children:["In addition to all features on Musicboard we also offer a power-up with our ",(0,v.jsx)("a",{className:"inline-link",href:"/pro?ref=M

1oreToDo",target:"_blank",children:"Pro subscription"}),". You will amongst other things get access to the stats page, showing you detailed statistics based on your ratings and reviews. A beatifully designed page constantly updating as you rate more."]})]})}),(0,v.jsx)(p.N_,{target:"_blank",to:"/apps",children:(0,v.jsxs)("div",{className:`section-block padding-around margin-top-32 ${re}`,children:[(0,v.jsx)("div",{className:`${K} ${se}`}),(0,v.jsx)("h3",{className:"black",style:{marginTop:18},children:"Go mobile with our app"}),(0,v.jsxs)("p",{className:"highDarkGrey margin-top-12 margin-bottom-4",style:{fontSize:16,lineHeight:"24px"},children:["Musicboard is also available on ",(0,v.jsx)("a",{className:"inline-link",href:X.appStoreUrl,target:"_blank",children:"iPhone"})," and ",(0,v.jsx)("a",{className:"inline-link",href:X.googlePlayUrl,target:"_blank",children:"Android"})," devices! Stay connected to your social life on Musicboard, even while not at the computer, by downloading our app. The latest news and the best experience on mobile."]})]})})]})]}),(0,v.jsx)(y,{index:5,next:"/",prev:"/onboarding/users",showTooltip:!1,disableNext:!1,onNext:null,nextText:"Let's Go"})]})},oe={container:"personalinfo_container__Rm7iN",active:"personalinfo_active__f3F36",buttons:"personalinfo_buttons__IUiO6",button:"personalinfo_button__uBd-w",disabled:"personalinfo_disabled__A3pZL",imageAndFileContainer:"personalinfo_imageAndFileContainer__u-+98",border:"personalinfo_border__3Co5U",errorWrapper:"personalinfo_errorWrapper__H2ZBE",scaleY:"personalinfo_scaleY__4+OaX"};var le=i(19337),ce=i(34872),de=i.n(ce),me=i(51238),ue=i(5062),he=i(87876);const ge=function(){const e=(0,n.wA)(),t=(0,o.W6)(),{openAlert:i}=(0,l.M)(),{openPopup:a}=(0,U.O)(),s=(0,x.Ub)({maxWidth:960}),c=((0,x.Ub)({maxWidth:490}),(0,n.d4)((e=>e.me))),d=(0,n.d4)((e=>e.me.fetchMeStatus)),m=(0,n.d4)((e=>e.me.errorMessage)),[u,h]=(0,r.useState)(!1),[g,p]=(0,r.useState)(c.profile_picture),[f,N]=(0,r.useState)(null),[_,w]=(0,r.useState)(1),[k,S]=(0,r.useState)(`@${c.username}`),[$,A]=(0,r.useState)(null),R=(0,r.useRef)(),[G,I]=(0,r.useState)(null),W=(0,r.useCallback)((e=>{const t=e[0]?e[0]:null;t?(t.url=URL.createObjectURL(t),console.log({file:t}),N(t)):i({p:"No file.",style:"red"})}),[]),{getRootProps:z,getInputProps:F,open:L,isDragActive:B}=(0,le.V)({onDrop:W,noClick:!0,accept:"image/*",multiple:!1}),D=(0,r.useRef)(!0);return(0,r.useEffect)((()=>{D.current?D.current=!1:u&&d===E.h.SUCCESS?(i({p:"Saved profile information!",style:"green"}),t.push("/onboarding/genres")):d===E.h.ERROR&&A(m)}),[d]),(0,v.jsxs)("div",{children:[(0,v.jsx)(j.A,{title:"What should we call you? - Musicboard",description:"Set up your Musicboard profile. Choose a username, add a profile picture, and write a short biography to introduce yourself to the community.",canonical:"https://musicboard.app/onboarding/pers

1onal",headingOne:"Onboarding: Set Up Your Musicboard Profile",headingTwo:"What should we call you?"}),(0,v.jsxs)("div",{className:"section-handler",children:[(0,v.jsxs)(T.A,{enabled:!s,className:"section-1 section-margin",children:[(0,v.jsx)("h3",{className:"black text-xl padding-top-64",children:"What should we call you?"}),(0,v.jsx)("p",{className:"darkGrey margin-top-16",style:{fontSize:16,lineHeight:"24px"},children:"Let's start with your public profile by adding a username and profile picture. You can always change these later."})]}),(0,v.jsxs)("div",{className:"section-2 section-margin margin-top-64",children:[(0,v.jsx)("p",{class:"medium black margin-bottom-8",children:"Profile Picture"}),(0,v.jsxs)("div",{className:`${oe.container} ${B?oe.active:""}`,...z(),children:[(0,v.jsx)("input",{className:oe.input,...F()}),(0,v.jsxs)("div",{className:oe.imageAndFileContainer,style:{width:128,height:128},children:[!f&&(0,v.jsx)(O.A,{noShadow:!0,noBorder:!0,size:128,profilePicture:g,altText:"Profile picture"}),f&&G&&(0,v.jsx)(O.A,{noShadow:!0,noBorder:!0,size:128,profilePicture:G.url,altText:"Profile picture"}),f&&!G&&(0,v.jsx)(de(),{ref:R,image:f.url,width:128,height:128,border:0,borderRadius:1e3,color:[0,0,0,.6],scale:(0,he.A)(1,100,1,4,_,!0),rotate:0}),(0,v.jsx)("div",{className:`${oe.border}`})]}),f&&!G&&(0,v.jsx)("input",{onChange:e=>w(e.target.value),type:"range",min:"1",max:"100",value:_,class:"slider margin-top-16",id:"myRange"}),(0,v.jsxs)("div",{className:"flex-row margin-top-32",children:[g===c.profile_picture&&g&&!f&&!G&&(0,v.jsx)(b.A,{className:"margin-left-8 margin-right-8",textStyle:{fontSize:14},type:"secondary-two",text:"Remove",onClicked:()=>{A(null),p(null)},height:39}),(f||G||g!==c.profile_picture)&&(0,v.jsx)(b.A,{className:"margin-left-8 margin-right-8",textStyle:{fontSize:14},type:"secondary-two",text:"Cancel",onClicked:()=>{A(null),p(c.profile_picture),N(null),w(1),I(null)},height:39}),!f&&g===c.profile_picture&&(0,v.jsx)(b.A,{className:"margin-left-8 margin-right-8",textStyle:{fontSize:14},type:"secondary-two",text:g?"Change image":"Upload image",onClicked:L,height:39}),(f||g!==c.profile_picture)&&(0,v.jsx)(b.A,{className:"margin-left-8 margin-right-8",textStyle:{fontSize:14},type:"secondary-two",text:"Save",height:39,loading:d===E.h.BEGIN,disabled:d===E.h.BEGIN,onClicked:function(){if(A(null),d===E.h.BEGIN)return;const t="@"===k.charAt(0)?k.substring(1,1e3):k;if(""!==t.trim())if(G){let i=new FormData;i.append("profile_picture",G),i.append("username",t),console.log({data:i,profilePicture:g,editedFile:G}),e((0,ue.Ih)(i))}else if(f){if(R.current){R.current.getImage().toBlob((e=>{const t=`${(0,me.A)()}.${e.type.split("image/").join("")}`,i=new File([e],t);i.url=URL.createObjectURL(i),I(i)}),"image/jpeg")}}else!g&&c.profile_picture?e((0,ue.Me)({profile_picture:null,username:t})):i({p:"Could not select banner. Please contact us about this matter.",style:"red"});else A("You are required to enter a username.")}})]})]}),(0,v.jsx)("p",{class:"margin-top-12 highDarkGrey",children:"Have a funny selfie? Or maybe a picture of your favorite artist? Upload it now."}),(0,v.jsx)(M.A,{className:"margin-top-32",label:"Username",placeholder:"@username",lighterStyle:!0,text:k,onTextChange:e=>{A(null),""===e.trim()?S("@"):"@"!==e[0]?S(`@${e}`):S(e)}}),(0,v.jsx)("p",{class:"margin-top-12 highDarkGrey",children:"Your username is your unique identity on Musicboard. You can change it later."}),$&&(0,v.jsxs)("div",{className:`flex-row margin-top-32 ${oe.errorWrapper}`,children:[(0,v.jsx)(C.A,{icon:"warning",size:18,color:"var(--red)"}),(0,v.jsx)("p",{className:"margin-left-8 medium red",children:$})]})]})]}),(0,v.jsx)(y,{index:1,next:"/onboarding/genres",prev:"/onboarding",disableNext:!1,overrideNextClick:function(){h(!0);const t="@"===k.charAt(0)?k.substring(1,1e3):k;if(""!==t.trim())if(G){let i=new FormData;i.append("profile_picture",G),i.append("username",t),console.log({data:i,profilePicture:g,editedFile:G}),e((0,ue.Ih)(i))}else e((0,ue.Me)({username:t}));else A("You are required to enter a username.")},loadingNext:u&&d===E.h.BEGIN,nextText:"Continue",tooltipText:"Select your favorite genres to continue"})]})}}}]);
2//# sourceMappingURL=9168.716b98f2.chunk.js.map