Instalação

Ambiente de desenvolvimento

Antes de começar a utilizar nossa SDK, verifique se o seu ambiente de desenvolvimento possui o @ionic/cli , @angular/cli e o Apache Cordova, como estrutura de desenvolvimento do projeto.

Instalando as dependências

Instale as dependências externas utilizadas:

"dependencies": {
  "@awesome-cordova-plugins/app-version": "^6.14.0",
  "@awesome-cordova-plugins/device": "^6.12.0",
  "@awesome-cordova-plugins/local-notifications": "^6.14.0",
  "@awesome-cordova-plugins/globalization": "^6.14.0"
},
"devDependencies": {
  "cordova-plugin-firebase-messaging": "^8.0.1"
}

📘 Recomendação: Certifique-se de instalar as versões conforme especificado nesta documentação.

Importando o FCM Token (API Key)

Para aproveitar nossos SDKs, será necessário importar o FCM Token (API Key) do seu projeto Firebase em nossa plataforma. Siga o passo a passo neste link para executar essa ação.

Instalando nosso package

Para adicionar o SDK Flutter da Inngage ao seu projeto, execute o seguinte comando utilizando o NPM:

npm i @inngageregistry/inngageionic

Este comando adiciona a seguinte linha no arquivo package.json de seu pacote:

"dependencies": {
  "@inngageregistry/inngageionic": "^1.0.0"
}

Inclusão da dependência

Após configurar o SDK React Native da Inngage, é simples importá-lo em seu projeto. Para isso, basta adicionar o pacote ao seu código:

import Inngage from 'inngageionic';

🚧 Recomendamos que você utilize a versão estável do Ionic, definida no arquivo package.json. A SDK foi verificada pela última vez na versão: Ionic 7 / Angular 17 / Cordova 12 • canal estável.

Versões suportadas:
"Ionic CLI": "7.2.0", "Angular CLI": "17.3.11" e "Cordova CLI": "12.0.0"

Implementando a SDK

📘 Caso queiram verificar os logs da Inngage enquanto estão desenvolvendo, basta implementar no seu código o método Inngage.setDebugMode(true).

Notificações push

As notificações serão enviadas do servidor da Inngage para um ou mais dispositivos móveis, mesmo quando o aplicativo estiver em primeiro plano, segundo plano ou até mesmo fechado. Essas mensagens têm o objetivo de alertar o usuário sobre informações importantes, atualizações ou qualquer outro dado relevante relacionado ao seu aplicativo.

As notificações push aparecem na tela de bloqueio ou na barra de notificações do dispositivo. Quando o usuário toca na notificação, o aplicativo é aberto e pode direcioná-lo para uma página específica ou exibir mais detalhes sobre o conteúdo da notificação.

Inngage.subscribe()

Esta função desempenha a função de registrar ou inscrever o usuário na plataforma Inngage.

async subscribe() {
  let subscription = {
    appToken: "Adicionar o App Token do aplicativo",
    friendlyIdentifier: "[email protected]",
    customFields: {
      "name": "Saulo",
      "age": 27,
      "login": "inativo"
    }
  }

  try {
    await Inngage.subscribe(subscription);
  } catch (error) {
    console.error("Erro ao registrar usuário:", error);
  }
}

Explicação dos parâmetros:

• appToken: Token do aplicativo na plataforma Inngage.
• friendlyIdentifier: Identifica o usuário de forma única.
• customFields: Campos personalizados, como nome, idade, etc.
• phoneNumber: (Opcional) Número de telefone do usuário.
• email: (Opcional) E-mail do usuário.

📘 Recomendamos que esse método seja chamado a cada nova sessão do usuário para assegurar rastreabilidade.

InngageNotificationMessage.notificationMessage()

Essa função realiza as configurações de push no aplicativo:

async notification() {
  await InngageNotificationMessage.notificationMessage((data: any) => {
    if (data != null) {
      console.log('receive: ', data);
    }
  });
}

• data: Contém informações da notificação push recebida.

📘 No método ngOnInit(), adicione os métodos configurados da Inngage.

Alterando ícone de notificação em primeiro plano

await InngageNotificationMessage.notificationMessage('res://ic_notification');

Certifique-se de que o ícone esteja presente em platforms/android/app/src/main/res.

Envio de eventos

A SDK permite o envio de eventos customizados. Eles devem ser previamente configurados na plataforma Inngage.

onClickEvent() {
  let event = {
    eventName: "ionic_event",
    conversionEvent: true,
    conversionValue: 1090.00,
    conversionNotId: "2314klbkf41bsgav4hg12ab24v1h41",
    eventValues: {
      "nome_sdk": 'Inngage Ionic',
      "valor": '40'
    }
  }
  Inngage.sendEvent(event);
}

Campos:

• eventName: Nome do evento (obrigatório).
• eventValues: Dados adicionais em forma de chave-valor.
• conversionEvent: Define se é um evento de conversão.
• conversionValue: Valor monetário da conversão (float).
• conversionNotId: ID único da notificação push que originou a conversão.

👍 Você está pronto para começar!

Seguindo os passos acima da documentação você estará pronto para utilizar todas as ferramentas necessárias para as funcionalidades da SDK. 👏