import type { TotaisPublicos } from "./data/totais";
import type { Parceira } from "./parceiras";
import Barra from "./components/Barra";
import Capa from "./components/Capa";
import Clientes from "./components/Clientes";
import Oficios from "./components/Oficios";
import ComoFunciona from "./components/ComoFunciona";
import Fiscal from "./components/Fiscal";
import Numeros from "./components/Numeros";
import LojaVirtual from "./components/LojaVirtual";
import Inventario from "./components/Inventario";
import Integracoes from "./components/Integracoes";
import Preco from "./components/Preco";
import Fecho from "./components/Fecho";
import Rodape from "./components/Rodape";
import Efeitos from "./components/Efeitos";

/*
  A landing: capa, quem já usa, os números, os ofícios, como funciona, a nota
  fiscal, a loja, o inventário, integrações, preço e o fecho.

  Cada seção é um arquivo. O que se repete entre elas (tokens, botões, tipos)
  mora em `landing.css`, escopado em `.lp`. Os efeitos de rolagem moram em
  `Efeitos.tsx`, ligados por atributos `data-revela` nas seções.
*/
export default function LandingApp({ totais, parceira }: { totais: TotaisPublicos; parceira?: Parceira }) {
  /* `data-parceira` desliga a conversão do Google Ads da Ktalogu no clique de
     assinar (script no layout): a venda ali é da parceira. */
  return (
    <div className="lp" data-parceira={parceira?.slug}>
      <Barra />
      <main>
        <Capa parceira={parceira} />
        <Clientes />
        <Numeros inicial={totais} />
        <Oficios />
        <ComoFunciona />
        <Fiscal />
        <LojaVirtual />
        <Inventario />
        <Integracoes />
        <Preco assinatura={parceira?.assinatura} />
        <Fecho />
      </main>
      <Rodape />
      <Efeitos />
    </div>
  );
}