import { and, desc, eq, sql } from 'drizzle-orm'
import { db, schema } from '@/db'
import { requireUser } from '@/lib/auth'
import { formatARS } from '@/lib/money'
import { referralMonths } from '@/lib/fees'
import CopyButton from '@/components/CopyButton'

export default async function ReferralsPage() {
  const user = await requireUser()
  const link = `${process.env.APP_URL ?? ''}/r/${user.referralCode}`
  const share = Number(process.env.REFERRAL_SHARE_BPS ?? 2000) / 100

  const orgs = await db.select({ name: schema.organizations.name, createdAt: schema.organizations.createdAt, endsAt: schema.organizations.referralEndsAt })
    .from(schema.organizations).where(eq(schema.organizations.referredByUserId, user.id)).orderBy(desc(schema.organizations.createdAt))

  const sums = await db.select({ status: schema.referralEarnings.status, total: sql<number>`sum(${schema.referralEarnings.amountCents})::bigint` })
    .from(schema.referralEarnings).where(eq(schema.referralEarnings.referrerUserId, user.id)).groupBy(schema.referralEarnings.status)
  const by = (s: string) => Number(sums.find(x => x.status === s)?.total ?? 0)

  const [{ last30 }] = await db.select({ last30: sql<number>`coalesce(sum(${schema.referralEarnings.amountCents}), 0)::bigint` })
    .from(schema.referralEarnings)
    .where(and(eq(schema.referralEarnings.referrerUserId, user.id), sql`${schema.referralEarnings.createdAt} > now() - interval '30 days'`))

  return (
    <div className="space-y-6">
      <header>
        <h1 className="text-2xl font-bold">Referidos</h1>
        <p className="mt-1 text-sm text-gray-500">Invitá organizadores y ganá el {share}% de la comisión que generen durante {referralMonths()} meses.</p>
      </header>

      <section className="card space-y-3 p-6">
        <p className="text-sm font-semibold">Tu link</p>
        <div className="flex flex-col gap-2 sm:flex-row">
          <p className="input flex-1 truncate bg-gray-50 font-mono">{link}</p>
          <CopyButton text={link} />
        </div>
      </section>

      <section className="grid grid-cols-2 gap-3 md:grid-cols-4">
        {[
          ['Organizaciones', String(orgs.length)],
          ['Últimos 30 días', formatARS(Number(last30))],
          ['A cobrar', formatARS(by('pending') + by('approved'))],
          ['Cobrado', formatARS(by('paid'))],
        ].map(([l, v]) => (
          <div key={l} className="card p-4"><p className="text-xs uppercase tracking-wide text-gray-400">{l}</p><p className="mt-1 text-xl font-bold tabular-nums">{v}</p></div>
        ))}
      </section>

      <section className="card p-6">
        <p className="mb-3 text-sm font-semibold">Organizaciones que trajiste</p>
        {orgs.length === 0 ? <p className="text-sm text-gray-400">Todavía ninguna. Compartí tu link con productoras, clubes y centros de estudiantes.</p> : (
          <ul className="divide-y divide-gray-50 text-sm">
            {orgs.map(o => (
              <li key={o.name + o.createdAt.toISOString()} className="flex justify-between py-2">
                <span>{o.name}</span>
                <span className="text-gray-400">hasta {o.endsAt?.toLocaleDateString('es-AR') ?? '—'}</span>
              </li>
            ))}
          </ul>
        )}
      </section>
    </div>
  )
}