import type { Metadata } from "next";
import { getSupabaseClient } from "@/lib/supabase";
import GaleraDaKtalogu from "./GaleraDaKtalogu";
import type { LojaDaGalera } from "./tipos";

/**
 * Vitrine publica das lojas — atende lojas.ktalogu.com.br.
 *
 * Os numeros vem da funcao get_public_store_directory(), que agrega tudo no
 * banco. Fazer isso aqui seria impossivel: catalog_events passa de 100 mil
 * linhas e tem RLS por dono.
 */

/* Revalida a cada 10 min: e um ranking, nao um placar ao vivo. Sem cache, cada
   visita dispararia a agregacao completa das ~90 lojas. */
export const revalidate = 600;

const BASE_URL = String(
  process.env.NEXT_PUBLIC_PUBLIC_CATALOG_BASE_URL || "https://ktalogu.com.br"
).replace(/\/$/, "");

const TITULO = "A Galera da Ktalogu — as lojas que estão bombando";
const DESCRICAO =
  "Conheça as lojas que vendem todo dia com a Ktalogu: ranking, mais acessadas, em alta e os catálogos mais completos do Brasil.";

export const metadata: Metadata = {
  title: { absolute: TITULO },
  description: DESCRICAO,
  alternates: { canonical: "https://lojas.ktalogu.com.br/" },
  robots: {
    index: true,
    follow: true,
    googleBot: { index: true, follow: true, "max-image-preview": "large", "max-snippet": -1 },
  },
  openGraph: {
    title: TITULO,
    description: DESCRICAO,
    url: "https://lojas.ktalogu.com.br/",
    siteName: "Ktalogu",
    type: "website",
    locale: "pt_BR",
    images: [{ url: "/brand-logo.svg", alt: "Ktalogu", width: 1200, height: 630 }],
  },
  twitter: { card: "summary_large_image", title: TITULO, description: DESCRICAO },
};

type LinhaRpc = {
  slug: string | null;
  nome: string | null;
  cidade: string | null;
  uf: string | null;
  logo: string | null;
  cor: string | null;
  slogan: string | null;
  produtos: number | null;
  visitantes: number | null;
  visitas: number | null;
  visitas_30d: number | null;
  produto_views: number | null;
  carrinhos: number | null;
  pedidos: number | null;
  pedidos_30d: number | null;
  score: number | null;
};

async function carregarLojas(): Promise<LojaDaGalera[]> {
  try {
    const supabase = getSupabaseClient();
    const { data, error } = await supabase.rpc("get_public_store_directory");
    if (error || !Array.isArray(data)) return [];

    return (data as LinhaRpc[])
      .filter((linha) => String(linha.slug || "").trim())
      .map((linha, indice) => ({
        posicao: indice + 1,
        slug: String(linha.slug),
        nome: String(linha.nome || "Loja"),
        cidade: linha.cidade || null,
        uf: linha.uf || null,
        logo: linha.logo || null,
        cor: linha.cor || "#4425A7",
        slogan: linha.slogan || null,
        produtos: Number(linha.produtos) || 0,
        visitantes: Number(linha.visitantes) || 0,
        visitas: Number(linha.visitas) || 0,
        visitas30d: Number(linha.visitas_30d) || 0,
        produtoViews: Number(linha.produto_views) || 0,
        carrinhos: Number(linha.carrinhos) || 0,
        pedidos: Number(linha.pedidos) || 0,
        pedidos30d: Number(linha.pedidos_30d) || 0,
        score: Number(linha.score) || 0,
        url: `${BASE_URL}/${String(linha.slug)}`,
      }));
  } catch {
    return [];
  }
}

/* Totais vem da propria funcao do banco, e nao de uma soma das linhas: o valor
   negociado sai de `payments`, que a listagem de lojas nem carrega. */
async function carregarTotais(lojas: LojaDaGalera[]) {
  const local = {
    lojas: lojas.length,
    produtos: lojas.reduce((soma, l) => soma + l.produtos, 0),
    visitas: lojas.reduce((soma, l) => soma + l.visitas, 0),
    estados: new Set(lojas.map((l) => l.uf).filter(Boolean)).size,
    negociado: 0,
    negociado30d: 0,
  };

  try {
    const supabase = getSupabaseClient();
    const { data, error } = await supabase.rpc("get_public_ktalogu_totals");
    const linha = Array.isArray(data) ? data[0] : null;
    if (error || !linha) return local;
    return {
      lojas: Number(linha.lojas) || local.lojas,
      produtos: Number(linha.produtos) || local.produtos,
      visitas: Number(linha.visitas) || local.visitas,
      estados: Number(linha.estados) || local.estados,
      negociado: Number(linha.negociado) || 0,
      negociado30d: Number(linha.negociado_30d) || 0,
    };
  } catch {
    return local;
  }
}

export default async function PaginaGalera() {
  const lojas = await carregarLojas();
  const totais = await carregarTotais(lojas);

  const dadosEstruturados = {
    "@context": "https://schema.org",
    "@type": "CollectionPage",
    name: TITULO,
    description: DESCRICAO,
    url: "https://lojas.ktalogu.com.br/",
    mainEntity: {
      "@type": "ItemList",
      numberOfItems: lojas.length,
      itemListElement: lojas.slice(0, 30).map((loja, indice) => ({
        "@type": "ListItem",
        position: indice + 1,
        name: loja.nome,
        url: loja.url,
      })),
    },
  };

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{
          __html: JSON.stringify(dadosEstruturados).replace(/</g, "\\u003c"),
        }}
      />
      <GaleraDaKtalogu lojas={lojas} totais={totais} />
    </>
  );
}