'use client';
import {useEffect,useRef,useState} from 'react';
import {Gift,Users,Coins,Copy,Check,Mail,MessageCircle,ArrowLeft,Plus,Link2,ShieldCheck,RefreshCw,LoaderCircle,Percent,ChevronDown} from 'lucide-react';
import {Tabs,TabsList,TabsTrigger,TabsContent} from './ui/tabs';
import {Dialog,DialogContent,DialogTitle,DialogDescription} from './ui/dialog';
import {useSite} from './site-shell';
import {dashboardNumber} from '@/lib/dashboard';
import {referralCode,referralShare,type ReferralData} from '@/lib/referrals';
import {rialToToman} from '@/lib/trade';
export function ReferralDashboard(){
 const {user,locale}=useSite(),[data,setData]=useState<ReferralData|null>(null),[error,setError]=useState(''),[busy,setBusy]=useState(false),[origin,setOrigin]=useState(''),[copied,setCopied]=useState(''),[creating,setCreating]=useState(false),[label,setLabel]=useState(''),[selected,setSelected]=useState('');
 const subject=useRef(user?.id);subject.current=user?.id;const copyTimer=useRef<ReturnType<typeof setTimeout>|null>(null);
 useEffect(()=>{setOrigin(window.location.origin);return()=>{if(copyTimer.current)clearTimeout(copyTimer.current)}},[]);
 async function load(){const uid=user?.id;if(!uid)return;setBusy(true);setError('');try{const r=await fetch('/api/referrals',{cache:'no-store'});const d=await r.json() as ReferralData&{error?:string};if(!r.ok)throw new Error(d.error||'دریافت اطلاعات انجام نشد.');if(subject.current===uid)setData(d)}catch(e){if(subject.current===uid)setError((e as Error).message)}finally{if(subject.current===uid)setBusy(false)}}
 useEffect(()=>{setData(null);setSelected('');void load()},[user?.id]);
 const amount=(value:string)=>dashboardNumber(rialToToman(BigInt(value)),locale,1),num=(v:number)=>dashboardNumber(v,locale,2);
 const date=(v:string)=>new Intl.DateTimeFormat(locale,{dateStyle:'medium'}).format(new Date(v));
 async function copy(value:string,key:string){try{await navigator.clipboard.writeText(value);setCopied(key);if(copyTimer.current)clearTimeout(copyTimer.current);copyTimer.current=setTimeout(()=>setCopied(''),2200)}catch{setError('کپی انجام نشد؛ لینک را انتخاب و کپی کنید.')}}
 async function create(){if(busy)return;setBusy(true);setError('');try{const r=await fetch('/api/referrals',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({action:'create',label})});const result=await r.json() as {error?:string;code:string};if(!r.ok)throw new Error(result.error||'ساخت کد انجام نشد.');setCreating(false);setLabel('');setSelected(result.code);await load()}catch(e){setError((e as Error).message)}finally{setBusy(false)}}
 if(!data)return <div className="referral-loading">{busy?<><LoaderCircle className="ref-spin"/>در حال دریافت دعوت‌ها…</>:<><p role="alert">{error}</p><button onClick={()=>void load()}><RefreshCw size={16}/>تلاش دوباره</button></>}</div>;
 const availableCodes=data.codes.filter(c=>c.active&&referralCode(c.code)),code=availableCodes.find(c=>c.code===selected)||availableCodes.find(c=>c.is_primary)||availableCodes[0],share=origin&&code?referralShare(origin,code.code):null;
 return <div className="referral-page" aria-busy={busy}>
  {error&&<p className="ref-error" role="alert">{error}</p>}{!data.program.enabled&&<p className="ref-notice">محاسبه پاداش‌های جدید این طرح موقتاً متوقف است.</p>}
  <div className="referral-overview"><section className="referral-invite-card"><div className="referral-eyebrow"><Gift size={17}/>با هم، سهم بیشتری از آینده</div><h2>دوستانتان را به پلانک دعوت کنید</h2><p>لینک اختصاصی‌تان را به اشتراک بگذارید و از دعوت و معاملات دوستانتان پاداش بگیرید.</p>
   <div className="referral-offers"><div><span>پاداش هر دعوت واجد شرایط</span><strong>{amount(data.program.invite_reward_rial)} <small>تومان</small></strong></div><div><span>سهم شما از کارمزد معاملات</span><strong>{num(data.program.trade_share_bps/100)}<small>٪</small></strong></div></div>
   {code&&<><div className="referral-code-heading"><span>کد دعوت شما</span><button onClick={()=>void copy(code.code,'code')} aria-label="کپی کد دعوت"><strong dir="ltr">{code.code}</strong>{copied==='code'?<Check size={18}/>:<Copy size={18}/>}</button></div><div className="referral-link"><Link2 size={18}/><input readOnly aria-label="لینک دعوت شما" dir="ltr" value={share?.url||''} onFocus={e=>e.currentTarget.select()}/><button disabled={!share} onClick={()=>share&&void copy(share.url,'link')} aria-label="کپی لینک دعوت">{copied==='link'?<Check size={18}/>:<Copy size={18}/>}</button></div><div className="referral-share"><button disabled={!share} onClick={()=>share&&void copy(share.url,'share')}><Copy size={17}/>{copied==='share'?'کپی شد':'کپی لینک'}</button><a href={share?.whatsapp} target="_blank" rel="noopener noreferrer"><MessageCircle size={18}/>واتس‌اپ</a><a href={share?.email}><Mail size={18}/>ایمیل</a></div></>}
  </section><aside className="referral-stats"><article><Users size={22}/><span>دوستان دعوت‌شده</span><strong>{num(data.stats.invited)} <small>نفر</small></strong><p>{num(data.stats.qualified)} نفر واجد شرایط دریافت پاداش</p></article><article><Coins size={22}/><span>در انتظار پرداخت</span><strong>{amount(data.stats.accrued_rial)} <small>تومان</small></strong><p>پاداش محاسبه‌شده پس از تسویه معاملات</p></article><article><Check size={22}/><span>پاداش پرداخت‌شده</span><strong>{amount(data.stats.paid_rial)} <small>تومان</small></strong><p>بر اساس پرداخت‌های تأییدشده</p></article></aside></div>
  <section className="referral-steps"><h3>چطور پاداش دریافت کنم؟</h3><div>{[[Link2,'لینک خود را بفرستید','از طریق واتس‌اپ، ایمیل یا کپی لینک، دوستانتان را دعوت کنید.'],[ShieldCheck,'ثبت‌نام و احراز هویت','دوستتان با کد شما ثبت‌نام و احراز هویت را تکمیل می‌کند.'],[Gift,'معامله و دریافت پاداش','با اولین معامله واقعی و تسویه‌شده، پاداش دعوت و سپس سهم کارمزد محاسبه می‌شود.']].map(([Icon,title,text],i)=>{const I=Icon as typeof Gift;return <article key={i}><span><I size={21}/><b>{num(i+1)}</b></span><div><h4>{String(title)}</h4><p>{String(text)}</p></div></article>})}</div><details><summary>شرایط طرح دعوت <ChevronDown size={15}/></summary><p>پاداش ثابت دعوت تنها یک بار برای هر دوست واجد شرایط ثبت می‌شود. سهم معاملات از کارمزد دریافت‌شده محاسبه می‌شود. معاملات نمایشی، لغوشده و تسویه‌نشده مشمول پاداش نیستند. تنظیمات زمان تسویه هر معامله مبنای محاسبه است و تغییر نرخ‌ها، پاداش‌های قبلی را تغییر نمی‌دهد. ارقام در انتظار پرداخت، موجودی قابل برداشت نیستند.</p></details></section>
  <section className="referral-surface"><header><div><h3>کدهای دعوت شما</h3><p>{num(Math.max(0,20-data.codes.length))} کد از ظرفیت {num(20)} کد باقی مانده</p></div><button className="ref-primary" disabled={busy||data.codes.length>=20} onClick={()=>{setLabel('');setCreating(true)}}><Plus size={17}/>ساخت کد جدید</button></header><div className="ref-table-scroll"><table><thead><tr><th>کد دعوت</th><th>عنوان</th><th>دوستان</th><th>وضعیت</th><th>اشتراک‌گذاری</th></tr></thead><tbody>{data.codes.map(item=><tr key={item.id}><td><b dir="ltr">{item.code}</b>{item.is_primary&&<small className="ref-tag">اصلی</small>}</td><td>{item.label||'—'}</td><td>{num(item.invites)}</td><td><span className={'ref-status '+(item.active?'paid':'reversed')}>{item.active?'فعال':'غیرفعال'}</span></td><td><button className="ref-text" disabled={!item.active||!referralCode(item.code)} onClick={()=>{setSelected(item.code);window.scrollTo({top:0,behavior:'smooth'})}}>انتخاب لینک<ArrowLeft size={14}/></button></td></tr>)}</tbody></table></div></section>
  <section className="referral-surface"><header><div><h3>گزارش دعوت‌ها و درآمد شما</h3><p>پاداش دعوت: {amount(data.stats.invite_rial)} تومان · سهم معاملات: {amount(data.stats.trade_rial)} تومان</p></div><button className="ref-icon" aria-label="تازه‌سازی گزارش" disabled={busy} onClick={()=>void load()}><RefreshCw size={17}/></button></header>
   <Tabs defaultValue="invitees" className="referral-tabs"><TabsList><TabsTrigger value="invitees"><Users size={16}/>دعوت‌شده‌ها</TabsTrigger><TabsTrigger value="rewards"><Gift size={16}/>پاداش‌ها</TabsTrigger></TabsList><TabsContent value="invitees">{data.invitees.length?<div className="ref-table-scroll"><table><thead><tr><th>دوست دعوت‌شده</th><th>کد دعوت</th><th>تاریخ ثبت‌نام</th><th>وضعیت</th><th>پاداش</th></tr></thead><tbody>{data.invitees.map(item=><tr key={item.id}><td>{item.member}</td><td dir="ltr">{item.code}</td><td>{date(item.created_at)}</td><td><span className={'ref-status '+item.status}>{item.status==='registered'?'در انتظار احراز هویت / معامله':item.status==='rewarded'?'پاداش دعوت پرداخت شد':'واجد شرایط'}</span></td><td>{amount(item.reward_rial)} تومان</td></tr>)}</tbody></table></div>:<div className="ref-empty"><Users size={30}/><h4>اولین دوستتان را دعوت کنید</h4><p>پس از ثبت‌نام با کد شما، وضعیت دعوت در این قسمت نمایش داده می‌شود.</p></div>}</TabsContent><TabsContent value="rewards">{data.rewards.length?<div className="ref-table-scroll"><table><thead><tr><th>نوع پاداش</th><th>دوست</th><th>مبلغ</th><th>تاریخ</th><th>وضعیت</th></tr></thead><tbody>{data.rewards.map(item=><tr key={item.id}><td>{item.kind==='invite'?'پاداش دعوت':`سهم کارمزد ${num(item.share_bps/100)}٪`}</td><td>{item.member}</td><td>{amount(item.amount_rial)} تومان</td><td>{date(item.created_at)}</td><td><span className={'ref-status '+item.status}>{item.status==='paid'?'پرداخت‌شده':item.status==='reversed'?'برگشت‌شده':'در انتظار پرداخت'}</span></td></tr>)}</tbody></table></div>:<div className="ref-empty"><Gift size={30}/><h4>هنوز پاداشی ثبت نشده است</h4><p>پاداش‌ها پس از معامله واقعی و تسویه‌شده دوست واجد شرایط محاسبه می‌شوند.</p></div>}</TabsContent></Tabs><p className="ref-table-note">آخرین ۱۰۰ مورد نمایش داده می‌شود. مجموع‌ها شامل همه سوابق است.</p>
  </section>
  <Dialog open={creating} onOpenChange={v=>!busy&&setCreating(v)}><DialogContent className="planck-modal referral-create" dir="rtl"><DialogTitle>کد دعوت جدید</DialogTitle><DialogDescription>کد به‌صورت تصادفی و اختصاصی ساخته می‌شود. برای تشخیص کانال دعوت، عنوان دلخواه وارد کنید.</DialogDescription><label>عنوان کد <input value={label} maxLength={60} placeholder="مثلاً دوستان واتس‌اپ" onChange={e=>setLabel(e.target.value)}/></label>{error&&<p role="alert" className="ref-error">{error}</p>}<button className="ref-primary" disabled={busy} onClick={()=>void create()}>{busy?<LoaderCircle className="ref-spin" size={17}/>:<Plus size={17}/>}ساخت کد دعوت</button></DialogContent></Dialog>
 </div>;
}