Atualizado em 11/10/2023
Módulo de Onboarding para MiniApps Desenvolvido e mantido por VR Shopping
| Parâmetro | Nivel | Descrição | Exemplo |
|---|---|---|---|
| environment | SuperApp | Ambiente de execução | 'development' |
| deviceHash | SuperApp | Hash gerada para positivação do dispositivo pelo SuperApp | |
| deviceId | SuperApp | ID do dispositivo gerenciado pelo SuperApp | |
| jwtVR | SuperApp | JWT Token que deve ser provido pelo SuperApp | |
| cardCode | SuperApp | Código do produto que deve ser provido pelo SuperApp | |
| appVersion | SuperApp | Versão do SuperApp que deve ser provido pelo SuperApp | |
| originRoute | SuperApp | Nome da rota do SuperApp que chamou o modulo | 'Home' |
| analytics | SuperApp | Função de analytics provido pelo SuperApp | |
| onEncryptCard | SuperApp | Função provida pelo SuperApp para encriptografar os dados do cartão | (cardData, publicKey) => Promise |
| setUserSessionData | MiniApp | Função para setar os dados da sessão no miniApp | |
| onLoadResources | MiniApp | Função para carregar recursos após nova sessão | Carregar dados de produtos para o modulo |
| nextRoute | MiniApp | Nome da rota a ser chama após conclusão do onboarding |
Use o comando abaixo para instalar o pacote em seu projeto. Lembre-se: Você precisará de uma permissão para acessar o pacote (fornecido pela Global Points)
yarn add @globalpoints/react-native-onboarding
Se certifique de estar utilizando as versões corretas para evitar qualquer conflito.
{
"react": ">= 17.0.2",
"react-native": ">= 0.66.0",
"react-native-gesture-handler": ">= 2.12.1",
"react-native-reanimated": ">= 2.14.4",
"react-native-svg": ">= 12.1.1"
"@react-navigation/native": ">= 6.0.8",
"@react-navigation/native-stack": ">= 6.5.0",
"react-native-safe-area-context": ">= 4.1.1",
"react-native-screens": ">= 3.10.1",
"@sentry/react-native": ">= 3.4.0",
"react-native-mask-input": "^1.2.2",
"react-native-localize": "^2.2.6",
"@react-native-community/netinfo": "^9.4.1",
"react-native-device-info": "^10.9.0"
}
- Além de instalar a versão correta do GestureHandler, siga a documentação de instalação para as etapas adicionais.
- Além de instalar a versão correta do ReactNative Reanimated, siga a documentação de instalação para as etapas adicionais.
Para utilizar basta importar o modulo e renderizar em uma tela ou rota.
import React from 'react';
import { Onboarding } from '@globalpoints/react-native-onboarding';
export default function App() {
return (
<Onboarding />
);
}Este módulo foi desenvolvido com o intuito de se encaixar dentro do Super App para que a navegação seja transparente e que não haja a impressão de serem dois aplicativos diferentes. Para tal, além de seguir o mesmo design system para elaboração das telas, também estaremos utilizando as mesmas fontes. A principal premissa neste caso é que os arquivos de fonte estejam nomeados da seguinte forma:
- Montserrat-Bold.ttf
- Montserrat-Medium.ttf
- Montserrat-Regular.ttf
- Montserrat-SemiBold.ttf
Caso haja qualquer alteração nesses arquivos ou no design system, essas alterações devem ser comunicadas com a Global Points para a devida atualização do módulo, mantendo assim a compatibilidade.
Para qualquer problema com a instalação ou utilização deste pacote, entre em contato diretamente com a Global Points. E-mail para contato: bruno.mayer@globalpoints.com.br