Chat Package React

A React package for chat functionality using Firebase.

Installation

npm i chat-package-react-firebase

example

import React from "react";
import { useChat } from "chat-package-react-v2";

const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
};

const ChatApp = () => {
  const { sendMessage, messages } = useChat(
    firebaseConfig,
    "myUserId",
    "otherUserId"
  );

  return (
    <div>
      <h1>Chat Application</h1>
      <div>
        {messages.map((msg) => (
          <div key={msg.id}>
            <strong>{msg.sender === "myUserId" ? "You" : "Other"}:</strong>{" "}
            {msg.text}
          </div>
        ))}
      </div>
      <input
        type="text"
        placeholder="Type a message"
        onKeyDown={(e) => {
          if (e.key === "Enter") {
            sendMessage(e.target.value);
            e.target.value = "";
          }
        }}
      />
    </div>
  );
};

export default ChatApp;