problem when trying to use firechat via npm package

[Error] Error: Unable to find chat templates!
(anonymous function) (app.js, line 1598)
(anonymous function) (app.js, line 2736)
s (app.js, line 1)
(anonymous function) (app.js, line 1)
(anonymous function) (app.js, line 5)
s (app.js, line 1)
e (app.js, line 1)
global code (app.js, line 1)

[anshulnegitc]

hey anyone has solved this issue?

I have solved this issue I have used global cdn for both firebase and firechat

Index.html In React Js

`<script src="https://www.gstatic.com/firebasejs/7.15.4/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.15.4/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.15.4/firebase-database.js"></script>
  
  <link rel="stylesheet" href="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.css" />
  <script src="https://cdn.firebase.com/libs/firechat/3.0.1/firechat.min.js"></script>
  <script>
    var config = {
      apiKey: "Your API Key",
      authDomain: "authDomain",
      databaseURL: "databaseUrl",
      projectId: "projectId",
      storageBucket: "storageBucket",
      messagingSenderId: "senderId",
      appId: "appId",
      measurementId: "measurementId"
    };

    firebase.initializeApp(config);
    window.auth = firebase.auth();
    window.database = firebase.database();

  </script>`

I have used signInWithCustomToken(), token is used to maintain session,you can use any other method,google it for more Info NodeJs Code to generate token `

const firebaseAdmin = require('firebase-admin');
const firebaseAdminConfig = require('../config/firebase-admin-sdk.json'); //this file you have to download from service console in firebase,google it for more info
firebaseAdmin.initializeApp({
    credential:firebaseAdmin.credential.cert(firebaseAdminConfig),
    databaseURL:"https://fir-11bde.firebaseio.com"
});

module.exports =
{

    generateCustomToken: async function (req, res) {
        console.log("Custom-Firebase-Token");
        firebaseAdmin.auth().createCustomToken(req.params.uid).then(customToken=>{
            res.status(200).json({message:"Success",data:customToken})
        }).catch((err)=>{
            console.log(err);
            res.status(400).json({message:"Token generating error"})
        })
    }
}

Component file In ReactJs

api.firebaseCtrl.generateCustomToken("Any Id").then((response) => {
      if (response.status === 200) {
        console.log(response.data.data)
        // eslint-disable-next-line no-undef
        window.auth.signInWithCustomToken(response.data.data).then((authData, error) => {
          if (error) {
            console.log("Login Failed!", error);
          } else {
            console.log("Login successful", authData);
            var elem = document.getElementById("firechat-wrapper");

            // eslint-disable-next-line no-undef
            var chatRef = window.database.ref("chat");

            // eslint-disable-next-line no-undef
            var chat = new FirechatUI(chatRef, elem);


            chat.setUser("Any Id", "UserName");
          }
        });
      }
    })
```
`

[JesseLisby]

I’m experiencing this issue when trying to use Firechat with a ReactJs app. (I’m new to ReactJs, so perhaps it’s obvious.) I’m doing the below:

import React, { Component } from 'react';

import firebase from 'firebase';
import $ from 'jquery';

window.jQuery = $;
window.$ = $;
global.jQuery = $;


var FirechatUI = require('firechat');

export default class ChatRooms extends Component {

  initChat(user){

        // Get a Firebase Database ref
        var chatRef = firebase.database().ref("chat");

        // Create a Firechat instance
        var chat = new FirechatUI(chatRef, document.getElementById("firechat-wrapper"));

        // Set the Firechat user
        chat.setUser(user.uid, user.displayName);
  }

Do you need any other information?