https://www.unrankedsmurfs.com/build/assets/Step2-R-hUR-v4.js

1import{r as n,R as e,c as m}from"./app-C5djzFBf.js";import{H2 as b}from"./Headings-Lx8AfFLR.js";import{Button as O,ButtonType as M,ButtonSize as T}from"./Button-C25Hs3h1.js";import{SKINS_AND_CHAMPION as a}from"./skinsAndChampions-PdtDdyTR.js";import{TextInput as D}from"./TextInput-6gon9gR4.js";import{Pagination as j}from"./Pagination-lyXcSQnT.js";import"./Label-D7bXms9P.js";import"./SelectInput-CVEmoy0k.js";import"./emotion-memoize.esm-3S_6p140.js";function q({onChange:y,skinsAndChampions:x}){const[s,C]=n.useState(a.champion),[E,k]=n.useState(1),[r]=n.useState(40),c=E*r,o=c-r,h=x.filter(t=>t.type===a.champion),[A,v]=n.useState(Math.ceil(h.length/r)),[i,N]=n.useState(h.slice(o,c)),[g,P]=n.useState("");function w(){y(3)}function u(t){C(t),S(t)}n.useEffect(()=>{N(p(s).slice(o,c))},[E]),n.useEffect(()=>{S(s)},[g]);function S(t){N(p(t).slice(o,c)),v(Math.ceil(p(t).length/r))}function p(t){return x.filter(l=>{const d=l.name?l.name.toLowerCase().indexOf(g.toLowerCase())!==-1:null,f=l.type===t;return(l.type===a.icon||d)&&f})}return e.createElement("div",null,e.createElement(b,{className:"mt-6 lg:mt-10"},"Step 2 - Describe your account"),e.createElement("p",{className:"text-left mt-6 lg:w-3/5 lg:mx-auto"},"Game"),e.createElement("div",{className:"text-left mt-6 lg:w-3/5 lg:mx-auto"},e.createElement("img",{className:"p-4 bg-smurfs-gold h-16",src:"/images/unrankedsmurfs-login/LoL.png",alt:"League of Legends"})),e.createElement("p",{className:"text-left mt-6 lg:w-3/5 lg:mx-auto"},"Collectables"),e.createElement("div",{className:"mt-4 text-md flex lg:w-3/5 lg:mx-auto"},e.createElement("p",{className:m("text-left cursor-pointer",s===a.champion?"text-medal-gold":"text-40"),onClick:()=>u(a.champion)},"Champions"),e.createElement("p",{className:m("ml-10 cursor-pointer",s===a.skin?"text-medal-gold":"text-40"),onClick:()=>u(a.skin)},"Skins"),e.createElement("p",{className:m("ml-10 cursor-pointer",s===a.icon?"text-medal-gold":"text-40"),onClick:()=>u(a.icon)},"Icons")),e.createElement("div",{className:"mt-4 justify-center items-center text-center lg:w-3/5 lg:mx-auto p-4 bg-medium-black"},s===a.icon?null:e.createElement(D,{value:g,onChange:P,placeholder:"Type something to Search",isSearch:!0,className:"bg-mid-black"}),e.createElement("div",{className:m("mt-4",i.length===0?"":"flex-1 flex flex-wrap text-left")},i.length===0?e.createElement("div",{className:"justify-center items-center"},e.createElement("div",{className:"mr-4"},e.createElement("img",{src:"/images/misc/teemo_crying.gif",alt:"unrankedsmurfs teemo crying"})),e.createElement("div",{className:"flex flex-col"},e.createElement("span",{className:"heading-4 heading-gold"},"NOTHING FOUND"),e.createElement("span",null,"Please adjust your filter and try again."))):i.map(({type:t,name:l,image_url:d,rare:f,url:I},L)=>e.createElement("div",{key:L,className:"flex-col pl-4 mt-4 w-1/5"},e.createElement("a",{href:I,target:"_blank",rel:"noopener noreferrer"},e.createElement("div",{className:"flex"},e.createElement("div",{className:"w-10"},e.createElement("img",{src:d,className:"h-8",alt:"image"})),e.createElement("div",{className:"leading-xxs"},e.createElement("p",{className:"text-xs ml-2"},l),e.createElement("p",{className:"text-xxs ml-2 text-40"},t?t.toUpperCase():null))))))),e.createElement(j,{totalPages:A,onChange:k})),e.createElement("div",{className:"text-sm mt-6 items-center flex justify-center text-center"},e.createElement(O,{type:M.DEFAULT,size:T.DEFAULT,onClick:w},"Next")))}export{q as Step2};