https://fliplab.io.vn/assets/js/LevelPreviewModal-xLz68Cu5.js

1import{r as d,j as e,a as B}from"./react-vendor-Bmj5VlNT.js";import{aP as R,H as q,aO as A,a7 as I,C as K,M as V}from"./icons-hi2-BN_j_nRP.js";import{g as G,a as x,L as y,c as N,T as J}from"./Profile-DfPVoEjP.js";import{b as O}from"./study-modes-C76nMQ3U.js";import{A as Q,m as p}from"./motion-vendor-C7r_-Z0p.js";import"./icons-other-DiipBQ7p.js";import"./data-vendor-BOVf-I-t.js";import"./charts-vendor-Lc4STq0H.js";import"./useUnreadChat-CB0hL16I.js";import"./index-D7Jrz-4v.js";import"./sentry-vendor-ikJ5QM32.js";import"./effects-vendor-B04Tb7nA.js";import"./MainLayout-oGL5Yymk.js";import"./streakService-CieycMNA.js";import"./badgeService-DdW-MEmk.js";import"./dailyProgressTracker-UkhOyBpV.js";import"./xpService-BiDu3jBB.js";import"./index-6oe_etEa.js";import"./chatConversations-zuhuI0fl.js";import"./badgeConstants-DXkJa2dX.js";import"./BadgeNotificationManager-D1_cZKC_.js";import"./badgeI18n-h-8aUIAm.js";const $=a=>a>=1e6?`${(a/1e6).toFixed(1)}M`:a>=1e3?`${(a/1e3).toFixed(1)}k`:a.toLocaleString(),ve=({isOpen:a,onClose:c,currentLevel:o=1,currentXP:P=0})=>{const{t:s}=O(),[h,_]=d.useState(null),[C,L]=d.useState(!1);d.useEffect(()=>{L(!0)},[]),d.useEffect(()=>{if(a){const t=document.body.style.overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=t}}},[a]);const r=G(o),b=N(o),m=b.currentXP||0,f=b.maxXP||100,g=Math.max(P,m),u=f-g,T=f-m,v=Math.min(100,Math.max(0,(g-m)/T*100)),X=Math.ceil(u/500);if(!C)return null;const M=t=>{_(h===t?null:t)},w=t=>{const l=y.find(n=>n.tier===t);return s((l==null?void 0:l.nameKey)||`profile.level_tier_${t}`)},z=e.jsx(Q,{children:a&&e.jsxs(p.div,{className:"fixed inset-0 z-[9999] flex items-center justify-center p-2.5 sm:p-4 pb-[max(0.75rem,env(safe-area-inset-bottom))]",children:[e.jsx(p.div,{initial:{opacity:0}

1,animate:{opacity:1},exit:{opacity:0},transition:{duration:.2},className:"absolute inset-0 bg-black/80 cursor-pointer",onClick:c},"level-preview-backdrop"),e.jsxs(p.div,{initial:{opacity:0,scale:.94,y:16},animate:{opacity:1,scale:1,y:0},exit:{opacity:0,scale:.94,y:16},transition:{type:"spring",damping:25,stiffness:350},className:"relative z-10 w-full max-w-3xl h-[90dvh] sm:h-[85vh] max-h-[850px] bg-white dark:bg-slate-900 rounded-3xl sm:rounded-[2.5rem] border border-slate-200 dark:border-white/10 overflow-hidden flex flex-col shadow-2xl",onClick:t=>t.stopPropagation(),children:[e.jsxs("div",{className:"bg-slate-50 dark:bg-slate-800/40 border-b border-slate-200 dark:border-slate-800 px-4 sm:px-6 pt-4 sm:pt-5 pb-3.5 sm:pb-5 shrink-0 relative overflow-hidden",children:[e.jsx("div",{className:`absolute top-0 right-0 w-72 h-72 opacity-15 bg-gradient-to-br ${x(r.tier).gradient} blur-[70px] rounded-full -translate-y-1/2 translate-x-1/3 pointer-events-none`}),e.jsxs("div",{className:"flex items-center justify-between relative z-10 mb-3 sm:mb-4",children:[e.jsxs("div",{className:"flex items-center gap-2.5 sm:gap-3 min-w-0 pr-2",children:[e.jsx("div",{className:"w-10 h-10 sm:w-11 sm:h-11 rounded-2xl bg-amber-500/15 border border-amber-500/30 flex items-center justify-center text-amber-500 shadow-sm shrink-0",children:e.jsx(R,{className:"w-5 h-5 sm:w-6 sm:h-6"})}),e.jsx("div",{className:"min-w-0",children:e.jsx("h2",{className:"text-lg sm:text-xl font-black text-slate-900 dark:text-white leading-tight tracking-tight truncate",children:s("profile.level_modal_title")})})]}),e.jsx("button",{onClick:c,className:"w-8 h-8 sm:w-9 sm:h-9 rounded-full bg-slate-200/80 hover:bg-slate-300 dark:bg-slate-800 dark:hover:bg-slate-700 text-slate-600 dark:text-slate-300 flex items-center justify-center transition-all cursor-pointer active:scale-90 shrink-0 ml-1","aria-label":s("common.close"),children:e.jsx(q,{className:"w-4 h-4 sm:w-5 sm:h-5"})})]}),e.jsxs("div",{className:"relative z-10 bg-white dark:bg-slate-900 rounded-2xl p-3 sm:p-4 border border-slate-200/80 dark:border-slate-700/80 shadow-sm flex flex-col md:flex-row md:items-center gap-3 sm:gap-4 justify-between",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("div",{className:"relative flex-shrink-0",children:[e.jsx("div",{className:`w-11 h-11 sm:w-12 sm:h-12 rounded-2xl rotate-12 bg-gradient-to-br ${x(r.tier).gradient} opacity-25 absolute inset-0 blur-sm`}),e.jsxs("div",{className:"w-11 h-11 sm:w-12 sm:h-12 rounded-2xl bg-slate-50 dark:bg-slate-800 border-2 border-slate-200 dark:border-slate-700 flex flex-col items-center justify-center relative z-10 shadow-sm",children:[e.jsx("span",{className:"text-[8px] font-extrabold text-slate-400",children:"Lv"}),e.jsx("span",{className:"text-base sm:text-lg font-black text-slate-900 dark:text-white leading-none",children:o})]})]}),e.jsxs("div",{children:[e.jsx("div",{className:"flex items-center gap-2 mb-0.5",children:e.jsxs("span",{className:`px-2 py-0.5 rounded-md text-[9px] font-black tracking-wider uppercase bg-gradient-to-r ${x(r.tier).gradient} ${r.tier>=5?"text-white":"text-slate-800 dark:text-white"}`,children:[s("common.tier")," ",r.tier]})}),e.jsx("h3",{className:"text-base sm:text-lg font-black text-slate-900 dark:text-white leading-tight",children:w(r.tier)})]})]}),e.jsxs("div",{className:"flex-1 max-w-full md:max-w-sm",children:[e.jsxs("div",{className:"flex justify-between items-center mb-1",children:[e.jsx("span",{className:"text-[10px] sm:text-[11px] font-bold text-slate-500 dark:text-slate-400",children:s("profile.level_progress_to_next",{level:o+1})}),e.jsxs("span",{className:"text-xs font-black text-indigo-600 dark:text-indigo-400",children:[Math.round(v),"%"]})]}),e.jsx("div",{className:"h-2 sm:h-2.5 w-full bg-slate-100 dark:bg-slate-800 rounded-full overflow-hidden mb-1.5 border border-slate-200/50 dark:border-slate-700/50",children:e.jsx("div",{className:"h-full bg-gradient-to-r from-indigo-500 to-purple-500 transition-all duration-500 rounded-full",style:{width:`${v}%`}})}),e.jsxs("div",{className:"flex items-center gap-1.5 text-[10px] sm:text-[11px] text-slate-500 dark:text-slate-400 font-medium",children:[X<=3?e.jsx(A,{className:"w-3.5 h-3.5 text-amber-500 animate-pulse"}):e.jsx(I,{className:"w-3.5 h-3.5 text-indigo-500"}),e.jsx("span",{children:s("profile.level_xp_to_next",{xp:$(u)})})]})]})]})]}),e.jsx("div",{className:"overflow-y-auto flex-1 p-2.5 sm:p-4 space-y-2 sm:space-y-2.5 bg-slate-100/50 dark:bg-[#0B0F19] scrollbar-thin scrollbar-thumb-slate-300 dark:scrollbar-thumb-slate-700 overscroll-contain",children:y.map(t=>{var k;const l=h===t.tier,n=t.tier>=5,j=r.tier===t.tier,E=t.tier>r.tier,i=n?"text-white":"text-slate-900 dark:text-white",H=n?"bg-white/15":"bg-slate-300 dark:bg-white/10",F=n?"border-white/25":"border-slate-300 dark:border-white/20",S=N(t.minLevel),D=$((k=S.currentXP)!=null?k:0);return e.jsx("div",{className:"transition-all duration-300",children:e.jsxs("button",{onClick:()=>M(t.tier),className:`
2                    relative w-full text-left overflow-hidden rounded-2xl transition-all duration-200 group cursor-pointer
3                    border-[1.5px]
4                    ${l?"border-indigo-500/80 shadow-lg scale-[1.01] z-20":`${F} hover:shadow-md z-10`}
5                    ${j&&!l?"border-indigo-400":""}
6                  `,children:[e.jsx(J,{tier:t.tier}),e.jsx("div",{className:"absolute inset-0 bg-black/5 dark:bg-black/20 mix-blend-overlay pointer-events-none"}),e.jsxs("div",{className:"relative z-10 px-3.5 sm:px-4 py-2.5 sm:py-3 flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-2.5 sm:gap-3 min-w-0 pr-2",children:[e.jsxs("div",{className:`min-w-[44px] sm:min-w-[48px] px-2 sm:px-2.5 py-1 sm:py-1.5 rounded-xl flex flex-col items-center justify-center shrink-0 border ${n?"bg-black/25 border-white/20":"bg-white/60 dark:bg-white/10 border-black/5 dark:border-white/10"}`,children:[e.jsx("span",{className:`text-[8px] sm:text-[9px] font-extrabold tracking-wider up

6percase whitespace-nowrap opacity-80 leading-none mb-0.5 ${i}`,children:s("common.tier")}),e.jsx("span",{className:`text-base sm:text-lg font-black leading-none ${i}`,children:t.tier})]}),e.jsxs("div",{className:"flex flex-col min-w-0",children:[e.jsxs("div",{className:`font-bold text-sm sm:text-base leading-none flex items-center gap-1.5 sm:gap-2 truncate ${i}`,children:[e.jsx("span",{className:"truncate",children:w(t.tier)}),j&&e.jsx("span",{className:"text-[7px] sm:text-[8px] px-1.5 py-0.5 rounded-sm font-black tracking-wide bg-indigo-500 text-white shadow-sm shrink-0",children:s("profile.current_badge")}),E&&e.jsx(K,{className:"w-3.5 h-3.5 opacity-40 shrink-0"})]}),e.jsx("div",{className:`text-[9px] sm:text-[10px] mt-1 sm:mt-1.5 flex items-center gap-2 font-bold tracking-wide opacity-70 ${i}`,children:e.jsx("span",{className:"opacity-90",children:s("profile.level_label",{level:`${t.minLevel}–${t.maxLevel}`})})})]})]}),e.jsx("div",{className:`w-7 h-7 sm:w-8 sm:h-8 rounded-full flex items-center justify-center shrink-0 transition-transform duration-300 ${l?"rotate-180 bg-black/10":""} ${i}`,children:e.jsx(V,{className:"w-4 h-4 opacity-70"})})]}),l&&e.jsxs("div",{className:"relative z-10 px-3.5 sm:px-4 pb-3.5 sm:pb-4 animate-slide-up",children:[e.jsx("div",{className:`h-[1px] w-full my-2.5 sm:my-3 ${H}`}),e.jsxs("div",{children:[e.jsx("h4",{className:`text-[9px] sm:text-[10px] font-bold tracking-wide mb-1 opacity-70 ${i}`,children:s("profile.level_requirement_label")}),e.jsxs("div",{className:`flex items-baseline gap-1 ${i}`,children:[e.jsx("span",{className:"text-xl sm:text-2xl font-black",children:D}),e.jsx("span",{className:"text-[10px] font-bold opacity-80",children:"XP"})]})]})]})]})},t.tier)})}),e.jsx("div",{className:"p-3 sm:p-4 bg-white dark:bg-slate-900 border-t border-slate-200 dark:border-white/10 shrink-0 flex justify-end gap-3 z-20 shadow-[0_-5px_20px_rgba(0,0,0,0.1)]",children:e.jsx("button",{onClick:c,className:"w-full sm:w-auto px-6 py-2.5 bg-slate-900 hover:bg-slate-800 dark:bg-indigo-600 dark:hover:bg-indigo-700 text-white font-bold rounded-xl shadow-lg transition-transform hover:-translate-y-0.5 active:scale-95 text-sm cursor-pointer flex items-center justify-center",children:s("common.close")})})]},"level-preview-dialog")]})});return B.createPortal(z,document.body)};export{ve as default};