Etapas de integração do Freshchat React Native SDK

# React Native requirements
pod 'React', :path => '../node_modules/react-native', :subspecs => [
'Core',
'CxxBridge', # Include this for RN >= 0.47
'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43
'RCTText',
'RCTNetwork',
'RCTWebSocket', # Needed for debugging
'RCTAnimation', # Needed for FlatList and animations running on native UI thread
# Add any other subspecs you want to use in your project
]
# Explicitly include Yoga if you are using RN >= 0.42.0
pod 'yoga', :path => '../node_modules/react-
native/ReactCommon/yoga'
pod 'DoubleConversion', :podspec => '../node_modules/react-
native/third-party-podspecs/DoubleConversion.podspec'
pod 'glog', :podspec => '../node_modules/react-native/third-party-
podspecs/glog.podspec'
pod 'Folly', :podspec => '../node_modules/react-native/third-party-
podspecs/Folly.podspec'

Migrando uma integração existente do Freshchat para o Freshchat SDK 2.0.0+

• Desvincule o SDK do Freshchat nativo do React do seu projeto de reação usando o seguinte comando. 

react-native unlink react-native-freshchat-sdk

• Remova a seguinte linha do Podfile dentro do seu projeto iOS. pod 'FreshchatSDK', :path=> '../node_modules/react-native-freshchat-sdk/ios/FreshchatSDK.podspec'
• Consulte a coluna tabular acima e escolha as etapas conforme sua necessidade.

1.2. Configuração do Android

Adicione maven { url " https://jitpack.io " } ao seu arquivo build.gradle de nível de projeto.

allprojects
{    repositories
{        .....        maven { url "https://jitpack.io"
}    }
}

react-native link react-native-freshchat-sdk

import { Freshchat, FreshchatConfig } from 'react-native-freshchat-sdk';
var freshchatConfig = new FreshchatConfig(APP_ID, APP_KEY);
freshchatConfig.domain = "YOUR-DOMAIN";
Freshchat.init(freshchatConfig);

var freshchatConfig = new FreshchatConfig(APP_ID, APP_KEY);
freshchatConfig.domain = "YOUR-DOMAIN";
freshchatConfig.teamMemberInfoVisible = true;
freshchatConfig.cameraCaptureEnabled = true;
freshchatConfig.gallerySelectionEnabled = true;
freshchatConfig.responseExpectationEnabled = true;
freshchatConfig.showNotificationBanner = true; //iOS only
freshchatConfig.notificationSoundEnabled = true; //iOS only
freshchatConfig.themeName = "CustomTheme.plist"; //iOS only
freshchatConfig.stringsBundle = "FCCustomLocalizable"; //iOS only
Freshchat.init(freshchatConfig);

import { FreshchatUser } from 'react-native-freshchat-sdk';
var freshchatUser = new FreshchatUser();
freshchatUser.firstName = "John";
freshchatUser.lastName = "Doe";
freshchatUser.email = "johndoe@dead.man";
freshchatUser.phoneCountryCode = "+91";
freshchatUser.phone = "1234234123";
Freshchat.setUser(freshchatUser, (error) =>
{    console.log(error)
⁦})

/var userPropertiesJson = {    "user_type": "Paid",    "plan": "Gold"
}
Freshchat.setUserProperties(userPropertiesJson, (error) => {    console.log(error);
});

Freshchat.resetUser();

Observação: a ID de restauração para um usuário geralmente é gerada apenas quando o usuário envia uma mensagem. 
As notificações são suportadas em apenas um dispositivo móvel a qualquer momento e é atualmente o último dispositivo restaurado ou dispositivo com o último token push atualizado

Freshchat.identifyUser("EXTERNAL_ID", null, (error) => {    console.log(error);
});

Freshchat.getUser((user) => {            var restoreId = user.restoreId;            console.log("restoreId: " + restoreId);        })

Freshchat.identifyUser("EXTERNAL_ID", "RESTORE_ID", (error) =>
{    console.log(error);
});

Freshchat.addEventListener(
Freshchat.EVENT_USER_RESTORE_ID_GENERATED,    () => {        console.log("onRestoreIdUpdated triggered");        Freshchat.getUser((user) =>
{            var restoreId = user.restoreId;            var externalId = user.externalId;            console.log("externalId: " + externalId);            console.log("restoreId: " + restoreId);        })    }
);

Freshchat.getFreshchatUserId((data) => 
{        console.log(data);        });

Observação: somente tópicos com visibilidade definida como "Visível para todos os usuários" serão exibidos ao usar a API showConversations()

Freshchat.showConversations();

import { ConversationOptions } from 'react-native-freshchat-sdk';
var conversationOptions = new ConversationOptions();
conversationOptions.tags = ["premium"];
conversationOptions.filteredViewTitle = "Premium Support";
Freshchat.showConversations(conversationOptions);

Nota: Se nenhum tópico correspondente for encontrado, o usuário será redirecionado para o tópico padrão. 
Os tópicos que normalmente não são visíveis ao usar a API showConversations() também serão exibidos quando marcados e a tag específica for passada para a API filterByTags da instância ConversationOptions passada para a API showConversations().

Freshchat.getUnreadCountAsync((data) => {    console.log(data);
});

Freshchat.addEventListener(
Freshchat.EVENT_UNREAD_MESSAGE_COUNT_CHANGED,    () => {        console.log("onUnreadMessageCountChanged triggered");        Freshchat.getUnreadCountAsync((data) => {            var count = data.count;            var status = data.status;
if (status) {                console.log("Message count: " + count);            } else {                console.log("getUnreadCountAsync unsuccessful");            }        });    }
);

const getUnreadCountAsyncForTags = () => {    Freshchat.getUnreadCountAsync(
{            tags: ["new", "test"]        },        (data) => {            console.log(data);        });
};

Freshchat.showFAQs();

import { FaqOptions } from 'react-native-freshchat-sdk';
var faqOptions = new FaqOptions();
faqOptions.tags = ["premium"];
faqOptions.filteredViewTitle = "Tags";
faqOptions.filterType = FaqOptions.FilterType.ARTICLE;
Freshchat.showFAQs(faqOptions);

Nota: Quando não houver correspondência no filtro aplicado, ele exibirá todas as categorias do FAQ por padrão.

import { FaqOptions } from 'react-native-freshchat-sdk';
var faqOptions = new FaqOptions();
faqOptions.tags = ["premium"];
faqOptions.filteredViewTitle = "Tags";
faqOptions.filterType = FaqOptions.FilterType.CATEGORY;
Freshchat.showFAQs(faqOptions);

Observação: as perguntas frequentes também herdam as marcas da categoria principal de perguntas frequentes.

import { FaqOptions } from 'react-native-freshchat-sdk';
var faqOptions = new FaqOptions();
faqOptions.tags = ["premium"];
faqOptions.filteredViewTitle = "Tags";
faqOptions.filterType = FaqOptions.FilterType.ARTICLE;
Freshchat.showFAQs(faqOptions);

O comportamento padrão para "Fale conosco" no fluxo de perguntas frequentes é o mesmo que invocar showConversations(), ou seja, exibirá todos os tópicos marcados como "Visível para todos os usuários", exceto quando a filtragem de tópicos estiver habilitada passando tags para a API filterContactUsByTags.

import { FaqOptions } from 'react-native-freshchat-sdk';
var faqOptions = new FaqOptions();
faqOptions.tags = ["payment_failure"];
faqOptions.filteredViewTitle = "Payments";
faqOptions.filterType = FaqOptions.FilterType.ARTICLE;
faqOptions.showFaqCategoriesAsGrid = true;
faqOptions.showContactUsOnFaqScreens = true;
faqOptions.showContactUsOnFaqNotHelpful = true;
faqOptions.contactusFilterTags = ["payments"];
Freshchat.showFAQs(faqOptions);

5. API de envio de mensagem

O aplicativo pode enviar uma mensagem em nome do usuário usando a API sendMessage(). 

Observação: esta API enviaria silenciosamente uma mensagem e não iniciaria a interface do usuário do Freshchat SDK

var freshchatNotificationConfig = new FreshchatNotificationConfig();
freshchatNotificationConfig.priority =
FreshchatNotificationConfig.NotificationPriority.PRIORITY_HIGH;
freshchatNotificationConfig.notificationSoundEnabled = true;
freshchatNotificationConfig.largeIcon = "notif"; // Drawable name
freshchatNotificationConfig.smallIcon = "notif"; // Drawable name
Freshchat.setNotificationConfig(freshchatNotificationConfig);

6.3 Lista de Verificação de Notificação Push

Identificamos algumas áreas potenciais onde o problema acontece. Então, consolidamos isso em listas de verificação, verifique se você fez tudo.

iOS

1. Certifique-se de ter carregado o certificado push correto no portal Freschat.
2. Certifique-se de que está verificando em ambiente de desenvolvimento ou produção e carregue o respectivo certificado no portal Freschat.
3. Não verifique no simulador do iOS, pois ele não possui capacidade de notificação por push. Verifique no dispositivo real.
4. O recurso de notificação por push deve ser ativado em seu projeto Xcode.
5. Certifique-se de que você deu permissão para enviar notificações para seu aplicativo. Caso contrário, vá para Admin -> em seu aplicativo, ative a notificação por push.
6. Confirme que você está passando o token do dispositivo para o Freshchat usando o seguinte método,

   Freshchat.setPushRegistrationToken(device.pushToken);

   Genérico

   
   

7. Na classe Appdelegate, certifique-se de ter métodos delegados UNUserNotificationCenter ou [UIApplicationDelegate application:didReceiveRemoteNotification:fetchCompletionHandler:] implementado. E se a estrutura UNUserNotificationCenter estiver sendo usada, verifique se o delegado foi definido para isso.
   
8. Adicione os respectivos códigos de ponte de reação nos métodos delegados de notificação por push.
9. Consulte os códigos aqui para a implementação do plug-in, confirme se você implementou todas as recomendações.
10. Se você tiver uma extensão de notificação em seu aplicativo, verifique se ela não está bloqueando a notificação.
    

Android

1. Certifique-se de ter adicionado a chave FCM correta do seu aplicativo no portal Freshchat
2. Não verifique o emulador, que não possui o serviço Google Play ativado. Verifique no dispositivo real.
3. Confirme que você está passando o token do dispositivo para o Freshchat usando o seguinte método,

   Freshchat.setPushRegistrationToken(device.pushToken);

   JavaScript
4. Verifique se você está recebendo uma notificação do FCM.
5. Consulte os códigos aqui para a implementação do plug-in, confirme se você implementou todas as recomendações

Se o problema persistir, tente o seguinte URL,

https://<<your-freshchat-account-domain-here>>/app/api/notif_debug?convId=CONV_ID onde,

CONV_ID é o ID da conversa para a qual você não recebeu notificação. CONV_ID é a última parte numérica da url quando você abre a conversa no navegador. 

Certifique-se de estar logado como Admin ao abrir este URL. Ele lhe dará o motivo por trás da falha na notificação por push.

7. Outras Notas

Para localização, personalização da interface do usuário, suporte a RTL e muito mais, consulte nossa documentação específica da plataforma para Android e iOS .