Search code examples
javascriptiosauthenticationreact-nativesendbird

How do I import functions/files to a react native app?


I'm using Sendbird to build a chat application using react native, but I can't seem to get it to run. I know the app itself works, because I used the javascript debugger and I was parsing my information to the console, but I can't seem to get sendbird.init to work. Do I need to import methods from sendbird like you have to do in order to use react functions?

Here are screenshots for reference:

Login Error: Sendbird not Defined

And the line they refer to, login.js:41 is where I call sendbird.init

edit: heres my code for login.js (everything up to the stylesheet)

import React,  { Component } from 'react';
import {
    View,
    Text,
    StyleSheet,
    TextInput,
    TouchableHighlight
} from 'react-native';

var sendbird = require('sendbird');

module.exports = React.createClass({
    getInitialState: function() {
        return {
            username: ''
        };
    },
    render: function() {
        return (
            <View style={styles.container}>
                <View style={styles.loginContainer}>
                    <TextInput
                    style={styles.input}
                    value={this.state.username}
                    onChangeText={(text) => this.setState({username: text})}
                    placeholder={'Enter User Nickname'}
                    maxLength={12}
                    multiline={false}
                    />

                    <TouchableHighlight
                    style={styles.button}
                    underlayColor={'#328FE6'}
                    onPress={this.onPress}
                    >
                        <Text style={styles.label}>LOGIN</Text>
                    </TouchableHighlight>
                </View>
            </View>
        );
    },
    onPress: function() {
        sendbird.init({
            app_id: '879010F5-E064-4D1E-BD15-5956D4A47688',
            guest_id: this.state.username,
            user_name: this.state.username,
            image_url: "",
            access_token: "",
            successFunc: (data) => {
                console.log('success');
            },
            errorFunc: (status, error) => {
                this.setState({username: ''});
            }
        });
    }
});

and the error that comes up now about the mapping: New error - tried everything listed here


Solution

  • Now SendBird SDK V3 supports the latest React Native without any problems.

    Please update your SendBird SDK to V3 and then it should be fine.

    Here's a sample project you can take a look at.

    https://github.com/smilefam/SendBird-JavaScript

    Thanks!