@qiscus-integration/react-native-multichannel-widg

Dependency

Minimum RN >= 0.59

Installation

Using npm: npm i @qiscus-integration/react-native-multichannel-widget

USAGE

We use Hooks to synchronize data. To make it work we have to explicitly insert a mount point in your app like this:

// in your entry file like `App.js`
import {MultichannelWidgetProvider} from 'react-native-multichannel-widget';

// in your render function 
return (
  <MultichannelWidgetProvider>  // <- use MultichannelWidgetProvider
    <App />
  </MultichannelWidgetProvider>
);

Initialization Widget

import Widget from 'react-native-multichannel-widget';

const widget = Widget();
widget.setup(AppId, {
      title: 'selamat datang', //set custom title
      subtitle: 'ready to serve', //set custom subtitle
      avatar : '' //set custom avatar
    });

Initiate Chat Room

 widget.initiateChat('EMAIL', 'NAME', 'FCM_TOKEN')
            .then(result => {
                
            })
            .catch(e => {
                
            })

Use Header Component

<Header
    height={56}
    style={{
       backgroundColor : 'orange'
    }}
    textColor = 'white'
/>

Props

height (Integer) - Height of the Header, default is 56
headerRight (Object) - Extra props to be passed Component to the Right Header
headerLeft (Object) - Extra props to be passed Component to the Left Header
style (Object) - Extra props to be passed custom style header
textColor (String) - Custom text color header

Use Chat Component

<MultichannelWidget
            onSuccessGetRoom={room => {
            }}
            onDownload={onDownload}
            onPressSendAttachment={onPressSendAttachment}
        />

Props

onSuccessGetRoom (Function(room)) - Callback when success get room
onPressSendAttachment (Function) - Callback when button Send Attachment is tapped
onDownload (Function) - Callback when a download message attachment is tapped
renderSendAttachment (Object) - Extra props to be custom Component button Send Attachment
renderSendMessage (Object) - Extra props to be custom Component button Send Message
renderSendMessage (Object) - Extra props to be custom Component button Send Message
placeholder (String) - Extra props to be custom placeholder, default Type a message...
renderTickSent (Object) - Extra props to be custom Component Tick Sent
renderTickDelivered (Object) - Extra props to be custom Component Tick Delivered
renderTickRead (Object) - Extra props to be custom Component Tick Read
renderTickPending (Object) - Extra props to be custom Component Tick Pending