https://meetuponmain.com/assets/PinsCollection-DgZI-N6V.js

1import{h as y,u as L,r as o,b as T,t as A,j as e,m as c,A as F,f as C}from"./index-BOhYtOu1.js";import{A as z}from"./arrow-left-D0D7far7.js";import{S as j}from"./star-CjZT34B8.js";import{U as I}from"./users-CkwVut2b.js";import{U as R}from"./user-check-RR1PTTmR.js";import{L as E}from"./lock-QrdPgoLn.js";const U=[["path",{d:"M8.5 14.5A2.5 2.5 0 0 0 11 12c0-1.38-.5-2-1-3-1.072-2.143-.224-4.054 2-6 .5 2.5 2 4.9 4 6.5 2 1.6 3 3.5 3 5.5a7 7 0 1 1-14 0c0-1.153.433-2.294 1-3a2.5 2.5 0 0 0 2.5 2.5z",key:"96xj49"}]],O=y("flame",U);const H=[["polygon",{points:"6 3 20 12 6 21 6 3",key:"1oa8hb"}]],J=y("play",H);const W=[["path",{d:"m17 2 4 4-4 4",key:"nntrym"}],["path",{d:"M3 11v-1a4 4 0 0 1 4-4h14",key:"84bu3i"}],["path",{d:"m7 22-4-4 4-4",key:"1wqhfi"}],["path",{d:"M21 13v1a4 4 0 0 1-4 4H3",key:"1rx37r"}]],Y=y("repeat",W),P={play:J,repeat:Y,flame:O,"user-check":R,users:I},h={common:{color:"#9CA3AF",label:"Common",bg:"rgba(156,163,175,0.08)",border:"rgba(156,163,175,0.2)"},uncommon:{color:"#10B981",label:"Uncommon",bg:"rgba(16,185,129,0.08)",border:"rgba(16,185,129,0.2)"},rare:{color:"#3B82F6",label:"Rare",bg:"rgba(59,130,246,0.08)",border:"rgba(59,130,246,0.2)"},epic:{color:"#8B5CF6",label:"Epic",bg:"rgba(139,92,246,0.08)",border:"rgba(139,92,246,0.2)"},legendary:{color:"#F59E0B",label:"Legendary",bg:"rgba(245,158,11,0.1)",border:"rgba(245,158,11,0.3)"}},k=({pin:t,index:n,onSelect:r})=>{const l=h[t.rarity]||h.common,i=P[t.icon]||j;return e.jsxs(c.button,{initial:{opacity:0,scale:.9},animate:{opacity:1,scale:1},transition:{delay:n*.04},onClick:()=>r(t),className:`relative flex flex-col items-center p-3 rounded-2xl border transition-all ${t.earned?"bg-[#F7F1E0]":"bg-[#F7F1E0] opacity-40"}`,style:{borderColor:t.earned?l.border:"rgb(var(--t-text) / 0.06)"},"data-testid":`pin-card-${t.id}`,children:[t.earned&&e.jsx("div",{className:"absolute inset-0 rounded-2xl opacity-30 pointer-events-none",style:{background:`radial-gradient(circle at 50% 30%, ${l.color}15, transparent 70%)`}}),e.jsxs("div",{className:"relative w-16 h-16 flex items-center justify-center mb-2",children:[t.image?e.jsx("img",{src:t.image,alt:t.name,width:64,height:64,className:`w-full h-full object-contain ${t.earned?"":"grayscale"}`,style:t.earned?{filter:"drop-shadow(0 2px 8px rgba(0,0,0,0.3))"}:{filter:"grayscale(1) brightness(0.4)"}}):e.jsx("div",{className:"w-14 h-14 rounded-xl flex items-center justify-center",style:{background:t.earned?l.bg:"rgb(var(--t-text) / 0.05)",border:`1.5px solid ${t.earned?l.border:"rgb(var(--t-text) / 0.08)"}`},children:e.jsx(i,{className:"w-6 h-6",style:{color:t.earned?l.color:"rgb(var(--t-text) / 0.15)"}})}),!t.earned&&e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:e.jsx(E,{className:"w-5 h-5 text-[#2A2D1F]/20"})})]}),e.jsx("span",{className:`text-[11px] font-semibold text-center leading-tight ${t.earned?"text-[#2A2D1F]":"text-[#7A7A6A]"}`,children:t.name}),e.jsx("span",{className:"text-[9px] font-bold uppercase tracking-wider mt-1",style:{color:t.earned?l.color:"rgb(var(--t-text) / 0.15)"},children:l.label})]})},q=({pin:t,onClose:n})=>{if(!t)return null;const r=h[t.rarity]||h.common,l=P[t.icon]||j;return e.jsx(F,{children:e.jsx(c.div,{initial:{opacity:0}

1,animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 z-50 flex items-center justify-center p-6 bg-black/60 backdrop-blur-sm",onClick:n,"data-testid":"pin-detail-modal",children:e.jsxs(c.div,{initial:{scale:.85,opacity:0},animate:{scale:1,opacity:1},exit:{scale:.85,opacity:0},onClick:i=>i.stopPropagation(),className:"w-full max-w-xs bg-[#F1E9CE] border border-[#2A2D1F]/20 rounded-3xl p-6 text-center shadow-2xl",children:[e.jsx("div",{className:"relative w-28 h-28 mx-auto mb-4",children:t.image?e.jsx("img",{src:t.image,alt:t.name,width:112,height:112,className:`w-full h-full object-contain ${t.earned?"":"grayscale"}`,style:t.earned?{filter:"drop-shadow(0 4px 16px rgba(0,0,0,0.4))"}:{filter:"grayscale(1) brightness(0.4)"}}):e.jsx("div",{className:"w-28 h-28 rounded-2xl flex items-center justify-center mx-auto",style:{background:t.earned?r.bg:"rgb(var(--t-text) / 0.05)",border:`2px solid ${t.earned?r.border:"rgb(var(--t-text) / 0.08)"}`},children:e.jsx(l,{className:"w-12 h-12",style:{color:t.earned?r.color:"rgb(var(--t-text) / 0.15)"}})})}),e.jsx("span",{className:"inline-block text-[10px] font-bold uppercase tracking-widest px-3 py-1 rounded-full mb-3",style:{color:r.color,background:`${r.color}15`,border:`1px solid ${r.color}30`},children:r.label}),e.jsx("h3",{className:"text-lg font-heading font-bold text-[#2A2D1F] mb-1",children:t.name}),e.jsx("p",{className:"text-xs text-[#7A7A6A] mb-4",children:t.description}),t.earned?e.jsxs("div",{className:"flex items-center justify-center gap-1.5 text-[#10B981]",children:[e.jsx(C,{className:"w-4 h-4"}),e.jsxs("span",{className:"text-xs font-semibold",children:["Earned ",t.earned_at?new Date(t.earned_at).toLocaleDateString():""]})]}):e.jsxs("div",{className:"flex items-center justify-center gap-1.5 text-[#7A7A6A]",children:[e.jsx(E,{className:"w-3.5 h-3.5"}),e.jsx("span",{className:"text-xs font-semibold",children:"Not yet earned"})]}),e.jsx("button",{onClick:n,className:"mt-5 w-full py-2.5 rounded-xl bg-[#F1E9CE] border border-[#2A2D1F]/20 text-[#2A2D1F] text-sm font-bold","data-testid":"pin-detail-close",children:"Close"})]})})})},ee=()=>{const t=L(),[n,r]=o.useState([]),[l,i]=o.useState(!0),[N,D]=o.useState(0),[u,S]=o.useState(0),[_,p]=o.useState(null),[g,$]=o.useState([]),[d,x]=o.use

1State(null),v=o.useCallback(async()=>{try{i(!0);const{data:a}=await T.get("/pins/my-pins");r(a.pins||[]),D(a.earned_count||0),S(a.total_count||0),$(a.newly_earned||[])}catch{A.error("Failed to load pins")}finally{i(!1)}},[]);o.useEffect(()=>{v()},[v]),o.useEffect(()=>{if(g.length>0){const a=g.map(s=>n.find(b=>b.id===s)).filter(Boolean);if(a.forEach(s=>{A.success(`New Pin Earned: ${s.name}!`,{duration:4e3})}),a.length>0){x(a[0]);const s=setTimeout(()=>x(null),4e3);return()=>clearTimeout(s)}}},[g,n]);const m=n.filter(a=>a.earned),f=n.filter(a=>!a.earned),w=u>0?Math.round(N/u*100):0;return e.jsxs("div",{className:"min-h-screen bg-[#F7F1E0] pb-24","data-testid":"pins-collection-page",children:[e.jsx("header",{className:"sticky top-0 z-40 bg-[#F7F1E0] backdrop-blur-2xl border-b border-[#2A2D1F]/15",children:e.jsxs("div",{className:"max-w-md mx-auto px-4 py-4 flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("button",{onClick:()=>t(-1),className:"w-8 h-8 rounded-full bg-[#F1E9CE] border border-[#2A2D1F]/20 flex items-center justify-center","data-testid":"pins-back-btn",children:e.jsx(z,{className:"w-4 h-4 text-[#4A4D3A]"})}),e.jsx("h1",{className:"text-base font-heading font-bold text-[#2A2D1F]",children:"Pin Collection"})]}),e.jsxs("div",{className:"text-xs font-bold text-[#64260f]",children:[N,"/",u]})]})}),e.jsxs("div",{className:"max-w-md mx-auto px-4 py-5",children:[e.jsxs("div",{className:"mb-6",children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx("span",{className:"text-xs font-medium text-[#7A7A6A]",children:"Collection Progress"}),e.jsxs("span",{className:"text-xs font-bold text-[#64260f]",children:[w,"%"]})]}),e.jsx("div",{className:"h-2 bg-[#F7F1E0] rounded-full overflow-hidden",children:e.jsx(c.div,{className:"h-full rounded-full bg-gradient-to-r from-[#64260f] to-[#ce8790]",initial:{width:0},animate:{width:`${w}%`},transition:{duration:.6,delay:.2}})})]}),l?e.jsx("div",{className:"flex justify-center py-12",children:e.jsx("div",{className:"w-8 h-8 border-2 border-[#64260f] border-t-transparent rounded-full animate-spin"})}):e.jsxs(e.Fragment,{children:[m.length>0&&e.jsxs("div",{className:"mb-6","data-testid":"earned-pins-section",children:[e.jsxs("h2",{className:"text-xs font-bold uppercase tracking-widest text-[#10B981] mb-3 px-1",children:["Earned (",m.length,")"]}),e.jsx("div",{className:"grid grid-cols-3 gap-2.5",children:m.map((a,s)=>e.jsx(k,{pin:a,index:s,onSelect:p},a.id))})]}),f.length>0&&e.jsxs("div",{"data-testid":"locked-pins-section",children:[e.jsxs("h2",{className:"text-xs font-bold uppercase tracking-widest text-[#7A7A6A] mb-3 px-1",children:["Locked (",f.length,")"]}),e.jsx("div",{className:"grid grid-cols-3 gap-2.5",children:f.map((a,s)=>e.jsx(k,{pin:a,index:s+m.length,onSelect:p},a.id))})]}),n.length===0&&e.jsxs("div",{className:"text-center py-12",children:[e.jsx(j,{className:"w-10 h-10 text-[#2A2D1F]/10 mx-auto mb-3"}),e.jsx("p",{className:"text-sm text-[#7A7A6A]",children:"No pins available yet"})]})]})]}),e.jsx(q,{pin:_,onClose:()=>p(null)}),e.jsx(F,{children:d&&e.jsxs(c.div,{initial:{opacity:0}

1,animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 z-[90] flex items-center justify-center px-6",style:{background:"rgba(42,45,31,0.7)"},onClick:()=>x(null),"data-testid":"pin-celebration-overlay",children:[[...Array(14)].map((a,s)=>{const b=s/14*Math.PI*2,M=Math.cos(b)*160,B=Math.sin(b)*160;return e.jsx(c.span,{className:"absolute pointer-events-none select-none",initial:{x:0,y:0,opacity:0,scale:.4},animate:{x:M,y:B,opacity:[0,1,0],scale:[.4,1.3,.6]},transition:{duration:1.4,delay:.15+s*.04,ease:"easeOut"},style:{fontSize:22,color:s%2===0?"#F5C8D2":"#E8DC7F",textShadow:"0 0 8px rgba(255,255,255,0.4)"},children:"✺"},s)}),e.jsxs(c.div,{initial:{scale:.6,opacity:0,rotate:-8},animate:{scale:1,opacity:1,rotate:0},exit:{scale:.85,opacity:0},transition:{type:"spring",damping:14,stiffness:260},onClick:a=>a.stopPropagation(),className:"relative w-full max-w-xs rounded-3xl p-7 text-center",style:{background:"#F1E9CE",border:"1.5px solid #2A2D1F",boxShadow:"0 16px 40px -12px rgba(0,0,0,0.45)"},children:[e.jsx("p",{className:"text-[10px] font-bold tracking-[0.28em] uppercase mb-3",style:{fontFamily:"JetBrains Mono, monospace",color:"#64260f"},children:"✺ New Pin Earned ✺"}),e.jsx(c.div,{initial:{rotate:-10,scale:.8},animate:{rotate:[-10,10,-6,6,0],scale:[.8,1.1,1]},transition:{duration:.9,ease:[.34,1.56,.64,1]},className:"relative w-32 h-32 mx-auto mb-4",children:d.image?e.jsx("img",{src:d.image,alt:d.name,className:"w-full h-full object-contain",style:{filter:"drop-shadow(0 6px 18px rgba(0,0,0,0.4))"}}):e.jsx("div",{className:"w-32 h-32 rounded-2xl flex items-center justify-center mx-auto",style:{background:"rgba(212, 169, 92, 0.15)",border:"2px solid rgba(212, 169, 92, 0.5)"},children:e.jsx(C,{className:"w-14 h-14",style:{color:"#D4A95C"}})})}),e.jsx("h3",{className:"mb-1",style:{fontFamily:"'Old Standard TT', serif",fontSize:26,fontWeight:700,color:"#2A2D1F",lineHeight:1.05},children:d.name}),e.jsx("p",{className:"text-xs mb-5",style:{color:"#7A7A6A"},children:d.description}),e.jsx("button",{onClick:()=>x(null),className:"px-6 py-2 rounded-full text-[11px] tracking-[0.18em] uppercase font-bold",style:{fontFamily:"JetBrains Mono, monospace",background:"#2A2D1F",color:"#F7F1E0",border:"1.5px solid #2A2D1F"},"data-testid":"pin-celebration-close",children:"✺ Wear it proud ✺"})]})]})})]})};export{ee as default};