# React Native

Do zero ao SDK do Paywallo rodando no app. Leva uns 5 minutos.

## Requisitos

-   React Native (qualquer versão recente)
-   iOS 15 ou superior
-   Android API 24 ou superior (Android 7+)

## 1. Instalar o pacote

Roda no terminal, na raiz do projeto (a pasta onde está o `package.json`). Também funciona com yarn add ou pnpm add.

```bash
npm install @virex-tech/paywallo-sdk
```

expo-application, expo-device e expo-localization são peer deps **obrigatórias**. O SDK importa elas de forma estática, sem elas o build quebra (não há fallback):

```bash
npx expo install expo-application expo-device expo-localization
```

expo-tracking-transparency é opcional: só necessária se o app for pedir o prompt de ATT (ver "Configurar o Provider" abaixo).

## 2. Setup nativo

No terminal, a partir da raiz do projeto, entre na pasta ios e roda pod install. O autolinking cuida do resto. No Android não precisa fazer nada, o autolinking resolve tudo.

```bash
cd ios && pod install
```

Já tem um development build instalado? De volta na raiz do projeto, rebuilda depois de instalar o SDK. Módulo nativo novo não aparece só com reload de JS:

```bash
npx expo run:ios
# ou
npx expo run:android
```

## 3. Configurar o Provider

No arquivo raiz do app (App.tsx), envolve tudo com o PaywalloProvider. A appKey fica em **Configurações → Apps**: entre no app e copie o valor do card **SDK Key**. Abaixo estão todos os campos disponíveis em `PaywalloConfig`:

> **Resolva o ATT antes de montar o Provider (iOS):** No iOS, peça a permissão de App Tracking Transparency (ATT) e espere o usuário responder antes de renderizar o PaywalloProvider. Se o Provider montar primeiro, o SDK inicializa com attStatus=undetermined, sem IDFA e sem madid no CAPI, o que degrada a atribuição do install. Hoje isso acontece em 87,3% dos installs iOS.

O SDK não pede mais o prompt de ATT sozinho. Foi removido. Timing e copy do prompt são responsabilidade do app, e isso decide a taxa de opt-in: medido nos nossos clientes, já vimos apps com opt-in de 42,0% e outros com 1,8% — 23x de variação só por causa do timing/copy do prompt. Requer `NSUserTrackingUsageDescription` no Info.plist.

```tsx
import * as TrackingTransparency from "expo-tracking-transparency";
import { Platform } from "react-native";

async function bootstrap() {
  if (Platform.OS === "ios") {
    await TrackingTransparency.requestTrackingPermissionsAsync();
  }
  // só agora renderiza <PaywalloProvider>
}
```

```tsx
import { PaywalloProvider } from "@virex-tech/paywallo-sdk";
import * as Application from "expo-application";

export default function App() {
  return (
    <PaywalloProvider
      config={{
        // Obrigatório: Configurações → Apps → card "SDK Key"
        appKey: "pk_xxxxxxxx",
        // Versão real do app nos eventos (padrão: "unknown")
        appVersion: Application.nativeApplicationVersion ?? undefined,
        // Logs do SDK no console. Use __DEV__ pra não vazar em prod
        debug: __DEV__,
        // "Production" (padrão) ou "Sandbox" pra testar IAP sem cobrar
        environment: "Production",
        // Textos da tela de erro do paywall (todos opcionais)
        errorStrings: { title: "Ops", retry: "Tentar novamente", close: "Fechar" },
        // Placements pré-carregados: present fica quase instantâneo
        preloadPaywalls: ["onboarding"],
        // SKAdNetwork (iOS): conversion value do funil, ligado por padrão.
        // Deixe false se outro SDK do app já for dono do conversion value:
        // o valor é único por app e dois donos corrompem o sinal.
        skan: true,
      }}
    >
      <YourApp />
    </PaywalloProvider>
  );
}
```

O Provider dispara `$app_installed` assim que monta. Não é preciso chamar manualmente. Mas "disparar sozinho" não é "correto sozinho": a qualidade da atribuição desse evento depende do ATT já estar resolvido no momento em que o Provider sobe (ver acima).

## Verificar que funcionou

Primeiro, ative `debug: __DEV__` no config. Com o app rodando, esse log aparece no console confirmando que o SDK iniciou:

```text
[Paywallo] initialized successfully
```

Chamadas no boot: use `waitUntilReady()` antes de identify/track no cold start. Sem ele, o SDK pode não estar pronto ainda e vai lançar "SDK not initialized".

```tsx
// No boot (useEffect ou equivalente):
await PaywalloClient.waitUntilReady();
await PaywalloClient.identify({
  email: user.email,
  properties: { userId: user.id }, // obrigatório pra linkar o device ao usuário
});
```

Apps multi-língua: use `setCurrentLanguage()` e `setDefaultLanguage()` para localizar os paywalls.

Usa outra tecnologia?

SDK em SwiftSDK em KotlinSDK em Flutter