Question 33101 in React native Question posted in
The official React Native documentation can be found here.

How to show suggested Articles or FAQs on Zen-desk using react-native-zendesk-chat – React native

I want to show suggested Articles based on FAQs on mobile using
react-native-zendesk chat SDK. but I don’t find there is any
option that helps to achieve this.

Quick help will be highly appreciated

Thanks

Tags:

2

Answers


  1. 0

    this code snippet will help you.

    import React, { useState, useEffect } from 'react';

import { View, Text, FlatList } from 'react-native';

const App = () => {
  const [suggestions, setSuggestions] = useState([]);

  useEffect(() => {
    const fetchSuggestions = async () => {
      try {
        const response = await fetch(
          'https://<subdomain>.zendesk.com/api/v2/help_center/articles/search.json?query=How to resolve issue&per_page=5'
        );
        const data = await response.json();
        setSuggestions(data.articles);
      } catch (error) {
        console.error(error);
      }
    };

    fetchSuggestions();
  }, []);

  return (
    <View>
      <FlatList
        data={suggestions}
        renderItem={({ item }) => (
          <View>
            <Text>{item.title}</Text>
          </View>
        )}
        keyExtractor={item => item.id.toString()}
      />
    </View>
  );
};

export default App;
    Login or Signup to reply.
  2. 0

    Integrate Zendesk Chat SDK in your React Native app

    1: first Install the Zendesk Chat SDK

    npm install @zendesk/chat-client-sdk

    2: Import the Chat module in your React Native component:

    import Chat from '@zendesk/chat-client-sdk';

    3: Initialize the Chat module with your Zendesk account details:

    Chat.init({
  accountKey: 'YOUR_ACCOUNT_KEY',
});

    4: Start the chat session:

    Chat.startChat({
  departments: [1, 2, 3],
});

    Complete Example

    import React, { useState, useEffect } from 'react';
import { View, Text, TouchableOpacity } from 'react-native';
import Chat from '@zendesk/chat-client-sdk';

const App = () => {
  const [isChatStarted, setIsChatStarted] = useState(false);

  useEffect(() => {
    Chat.init({
      accountKey: 'YOUR_ACCOUNT_KEY',
    });
  }, []);

  const startChat = () => {
    Chat.startChat({
      departments: [1, 2, 3],
    });
    setIsChatStarted(true);
  };

  return (
    <View>
      {!isChatStarted && (
        <TouchableOpacity onPress={startChat}>
          <Text>Start Chat</Text>
        </TouchableOpacity>
      )}
    </View>
  );
};

export default App;

    Hope so it will help you.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search