🛂Freshchat

Como utilizar o suporte de chat Freschchat no seu app Flutter.

Descrição Geral

O serviço OpenFreshChatService é projetado para integrar e manipular o SDK Freshchat em seu aplicativo. Ele facilita a comunicação e suporte ao cliente via chat, permitindo que os usuários visualizem as perguntas frequentes (FAQs) ou iniciem novas conversas.

É importante ler toda a documentação que eles possuem para as configurações para funcionamento:

https://support.freshchat.com/en/support/solutions/articles/50000003343-freshchat-flutter-sdk-integration-steps

Como funciona?

1. Rastreando Evento de Suporte

Ao chamar o serviço, o primeiro passo é rastrear um evento chamado supportRequested, indicando que um usuário solicitou suporte.

EventUtils.trackEvent(AllAppEvents.generalEvents.supportRequested);

2. Definindo Token de Push

O serviço recupera o token de registro de push do FirebaseMessaging e o define para o Freshchat SDK. Isso é essencial para notificações push relacionadas ao chat.

Freshchat.setPushRegistrationToken((await FirebaseMessaging.instance.getToken()) ?? "");

3. Inicialização do Freshchat

O SDK Freshchat é inicializado com IDs específicos e uma URL base. Um bundle de strings personalizado chamado FreshChatCustomBundle é usado para customizar as mensagens padrão do SDK.

Freshchat.init(...);

4. Configuração do Usuário

Antes de iniciar a conversa, o serviço configura detalhes do usuário no SDK Freshchat usando os detalhes do usuário armazenados em ProfileStore.

ProfileStore _profileStore = GetIt.I.get<ProfileStore>();
FreshchatUser freshchatUser = FreshchatUser(null, null);
freshchatUser.setFirstName(_profileStore.currentUserData?.name ?? "Usuário");
freshchatUser.setEmail(_profileStore.currentUserData?.email ?? "");
Freshchat.identifyUser(externalId: (_profileStore.currentUserData?.id ?? "").toString());
Freshchat.setUser(freshchatUser);

5. Definindo Propriedades do Usuário

Além dos detalhes básicos do usuário, o serviço define propriedades adicionais para o Freshchat SDK. Estas incluem a "FLAVOR" do aplicativo e a versão do aplicativo.

Freshchat.setUserProperties(...);

6. Mostrando FAQ ou Conversas

Finalmente, com base no argumento openFaq, o serviço ou mostra as FAQs ou inicia novas conversas para o usuário.

if (openFaq) {
  Freshchat.showFAQ();
} else {
  Freshchat.showConversations();
}

Por que usar o OpenFreshChatService?

• Integração Simples: A classe encapsula a lógica necessária para integrar o SDK Freshchat, tornando mais fácil adicionar funcionalidades de chat em qualquer parte do aplicativo.

• Customização: Utiliza um bundle de strings personalizado, permitindo maior controle sobre as mensagens padrão do SDK.

• Segurança: Ao lidar com possíveis nulidades (com o uso do null-aware em Dart), garante que o aplicativo não quebre, mesmo se alguns dados não estiverem presentes.

Recomendações

Certifique-se de que todas as chaves e IDs usadas na inicialização do Freshchat sejam mantidas em segredo e não expostas. Além disso, é importante manter o SDK Freshchat atualizado para aproveitar as correções de bugs e novos recursos.

Como ficaria nosso código final?

class OpenFreshChatService {
  void call({bool openFaq = true}) async {
    EventUtils.trackEvent(
      AllAppEvents.generalEvents.supportRequested,
    );

    Freshchat.setPushRegistrationToken(
      (await FirebaseMessaging.instance.getToken()) ?? "",
    );

    Freshchat.init(
      "",
      "",
      "msdk.freshchat.com",
      stringsBundle: "FreshChatCustomBundle",
    );

    ProfileStore _profileStore = GetIt.I.get<ProfileStore>();

    FreshchatUser freshchatUser = FreshchatUser(null, null);

    freshchatUser.setFirstName(
      _profileStore.currentUserData?.name ?? "Usuário",
    );

    freshchatUser.setEmail(
      _profileStore.currentUserData?.email ?? "",
    );

    Freshchat.identifyUser(
      externalId: (_profileStore.currentUserData?.id ?? "").toString(),
    );

    Freshchat.setUser(freshchatUser);

    Freshchat.setUserProperties(
      {
        "FLAVOR": SetupFlavors().currentFlavor.toString(),
        "APP_VERSION": (await PackageInfo.fromPlatform()).version,
      },
    );

    if (openFaq) {
      Freshchat.showFAQ();
    } else {
      Freshchat.showConversations();
    }
  }
}

TRADUÇÕES

Para traduzir os textos existentes no fluxo deles, basta fazer o seguinte: Para android, devemos criar uma arquivo dentro da nossa pasta do nosso flavor, no caminho: android/app/src/production-ou-staging/res/value/strings.xml e adicionar o seguinte contéudo: Todos os nomes de variaveis se encontram aqui: https://github.com/freshworks/freshchat-android/blob/master/freshchat_sdk/src/main/res/values/strings.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Freshchat SDK Strings -->
    <string name="freshchat_chat_deeplink_faq">Ver FAQ</string>
	<string name="freshchat_chat_message_composer_hint">Envie sua mensagem</string>
	<string name="freshchat_chat_capture_from_camera">Tira uma foto</string>
	<string name="freshchat_chat_select_from_gallery">Escolher imagem da galeria</string>
	<string name="freshchat_chat_select_file">Selecionar arquivo (&lt;20 MB)</string>
</resources>

Para iOS, devemos criar um arquivo no caminho: ios/Runner/FreshChatCustomBundle.bundle/en.lproj/FCLocalizable.strings

Com o contéudo:

/*
    Localizable.strings
    Freshchat

    Copyright (c) 2015 Freshdesk. All rights reserved.
    */

    /* Solution Categories*/
    "faq_title_text" = "Perguntas frequentes";
    "faq_close_button_text" = "Fechar";
    "contact_us_button_text" = "Entre em contato conosco";
    "faq_feature_not_enabled_text" = "A funcionalidade de Perguntas frequentes está desativada";

    /* Votação em Artigos */
    "article_vote_prompt_text" = "Nós solucionamos suas dúvidas?";
    "article_vote_prompt_yes_button_text" = "Sim";
    "article_vote_prompt_no_button_text" = "Não";

    /* Agradecimento por Votar em Artigo */
    "thank_you_prompt_text" = "Obrigado pelo seu feedback!";
    "thank_you_prompt_contact_us_button_text" = "Ainda precisa de ajuda? Fale conosco";

    /* Detalhe de Artigo */
    "offline_missing_content_text" = "Por favor, conecte-se à internet para visualizar o conteúdo de mídia disponível neste artigo.";

    /* Sem Conectividade com a Internet */
    "offline_internet_message" = "Uh-oh. Sem conexão com a internet";

    /* Canais */
    "channels_title_text" = "Conversas";
    "channels_close_button_text" = "Fechar";
    "channels_feature_not_enabled_text" = "A funcionalidade de Conversas está desativada";

    /* Restaurando a visualização */
    "restore_close_button_text" = "Fechar";

    /* Interface de Mensagem */
    "message_placeholder_text" = "Digite sua mensagem";
    "messages_close_button_text" = "Fechar";
    "send_button_text" = "Enviar";
    "messages_agent_label_text" = "Suporte";
    "default_action_button_text" = "Ver";
    "default_video_button_text" = "Assistir Vídeo";
    "default_file_button_text" = "Abrir Arquivo";

    "audio_message_title" = "Mensagem de Áudio";
    "picture_message_title" = "Imagem";
    "picture_message_upload_error" = "Erro ao carregar a imagem. Imagem não encontrada.";

    "audio_recording" = "Gravação de Áudio";
    "audio_recording_stopped" = "Gravação Interrompida";
    "audio_recording_permission_denied" = "Permissão não encontrada. Por favor, habilite a permissão de Microfone nas Configurações.";

    "cancel_audio_recording_alert" = "Tem certeza de que deseja cancelar a gravação?";

    "message_unsent_title" = "Sua mensagem não foi enviada";
    "message_unsent_info_text" = "Não foi possível enviar sua(s) mensagem(ns) no momento. Verifique a internet ou tente novamente mais tarde.";
    "server_error_info_text" = "Problema ao enviar mensagem. Por favor, tente novamente mais tarde.";

    /* Mensagens de Exclusão de Conta */
    "error_message_account_not_active_text" = "Esta seção não está mais disponível";
    "error_message_account_not_active_cancel" = "Cancelar";

    /* Alertas de Envio de Mensagem de Áudio */
    "short_audio_alert_title" = "Sua mensagem é muito curta.";
    "short_audio_alert_description_text" = "A gravação de áudio é muito curta. Por favor, tente novamente";
    "long_audio_alert_title" = "Muito longo, você não acha?";
    "long_audio_alert_description_text" = "Sua mensagem de áudio tem mais de 2 minutos. Tem certeza de que deseja enviar?";
    "long_audio_alert_post_button_text" = "Enviar";

    "search_placeholder_text"="Buscar FAQs";
    "search_empty_result_text"="Oops! Não encontramos o que você estava procurando.";
    "empty_channel_text" = "Oops, sem mensagens aqui!";
    "empty_faq_text" = "Desculpe! Não há FAQs disponíveis";
    "loading_channel_text" = "Carregando mensagens";
    "restoring_channel_text" = "Restaurando mensagens";
    "loading_faq_text" = "Carregando FAQs";

    /* Alerta de câmera indisponível */
    "camera_unavailable_title"="Sua câmera está indisponível";
    "camera_unavailable_description"="Oopsie! Seu dispositivo não tem câmera ou a câmera não está disponível para uso";
    "camera_unavailable_ok_button_text"="OK";
    "camera_permission_denied" ="Permissões de câmera são necessárias para capturar fotos";
    "photo_library_permission_denied" ="A permissão da biblioteca de fotos é necessária para acessar fotos";
    "camera_permission_alert_cancel" ="Cancelar";
    "photo_library_permission_alert_cancel" ="Cancelar";

    /* Imagem anexada */
    "pic_msg_attachment_close_btn"="Voltar";
    "pic_msg_attachment_title_text"="Capturar";

    /* Anexo de imagem */
    "image_attachment_cancel_button_text"="Cancelar";
    "image_attachment_select_existing_image"="Escolha uma imagem existente";
    "image_attachment_select_new_image"="Tirar uma foto";


    /* Notificações */
    "notification_message_default"="Você tem uma mensagem!";

    /* Pesquisa de satisfação do cliente */

    /* Prompt Sim/Não */
    "chat_resolution_prompt_text"="Todas as suas preocupações foram atendidas?";
    "chat_resolution_prompt_yes_button_text"="Sim!";
    "chat_resolution_prompt_no_button_text"="Não";

    "chat_resolution_survey_question_text"="";

    /* Prompt de pesquisa */
    "cust_sat_not_resolved_prompt"="Como poderíamos ter ajudado você melhor?";
    "cust_sat_user_comments_placeholder"="Feedback adicional";
    "cust_sat_submit_button_text"="Enviar";

    /* Formato do horário da mensagem */
    "chat_message_time_today"="hh:mm a";
    "chat_message_time_this_year_short"="dd MMM";
    "chat_message_time_this_year_long"="dd MMM',' hh:mm a";
    "chat_message_time_other_year"="MMM YYYY";

    /* Tipicamente respostas */
    "typically_replies_within_a_minute"="Normalmente responde em um minuto";
    "typically_replies_within_x_minutes"="Normalmente responde em";
    "typically_replies_within_an_hour"="Normalmente responde em uma hora";
    "typically_replies_within_2_hours"="Normalmente responde em 2 horas";
    "typically_replies_within_few_hours"="Normalmente responde em poucas horas";

    "placeholder_minutes"="minutos";

    /* Média de respostas */
    "currently_replying_in_a_minute" = "Respondendo atualmente em um minuto";
    "currently_replying_in_x_minutes"="Respondendo atualmente em";
    "currently_replying_in_an_hour"="Respondendo atualmente em uma hora";
    "currently_replying_in_2_hours"="Respondendo atualmente em 2 horas";
    "currently_replying_in_few_hours"="Respondendo atualmente em algumas horas";