Mqtt-mosq-chat-client.js is a client library that uses the mqtt.js library with the Mosquitto broker to implement a chat functionality. It communicates with its sister server side library mqtt-mosq-chat-server.js.

Table of Contents

• Upgrade notes
• Installation
• Config file
• Import
• API

Installation

npm install mqtt-mosq-chat-client

Config file

Creation

The library requires a config file from which it will read some of the data it needs. You will have to create that json file with a name of your choice (for our examples we will use the name config.json). It also needs to be in your project's src directory. The json structure should look something like this example:

{
  "backendUrl": "http://localhost:3001/",
  "brokerUrl": "ws://localhost:8083"
}

Replace the the example data with your own.

Importing the config into your project files

Most of the functions will take the config as an argument. There are two ways that you can import the config in order to use it.

• Import it in the component that you need it:

import configData from './config.json';

• Import it in your app router, and then pass it as a parameter in the component that you need it in:

function AppRouter() {

  return (
    <div>
      <Routes>
          <Route exact path="/" element={<App/>} />
          <Route path="/createroom" element={<CreateRoom config={configData}/>} />
          <Route path="/register" element={<Register config={configData}/>} />
          <Route path="/login" element={<Login config={configData}/>} />
          <Route path="/joinroom" element={<JoinRoom config={configData}/>} />
          <Route path="/rooms/*" element={<Rooms config={configData}/>} />
          <Route path="/account" element={<Account config={configData}/>} />
      </Routes>
    </div>
  );
}

export default AppRouter;

Import

import {example} from 'mqtt-mosq-chat-client';

API

• registerUser()
• loginUser()
• createRoom()
• joinName()
• joinCode()
• fetchUserRooms()
• fetchMessageHistory()
• useMqttListener()
• messageSend()
• generatePassword()
• disconnectMqtt()
• leaveRoom()
• deleteAccount()

registerUser(username, password, config)

Creates an account using the giiven username and password. It sends an axios request to the server library (URL taken from the config) which then saves the info in the mongoDB databse, after it has checked if the credentials are valid. Also stores the unique userID and username in the brower's local storage. Furthermore, it creates a "client" in the Dynamic Security Plugin for the user. Returns a string.

loginUser(username, password, config)

Logs the user in his account by sending an axios request to check the info. Gets the user's userID and saves it in the local storage along with his username.

createRoom(name, startDate, endDate, config)

Creates a chat room with the given name. The startDate and endDate are optional and they dictate the time period for which the room will be active. Also it creates a new role in the Dynamic Security Plugin for the current room (each room has a corresponding role, this way we manage room permissions). Then, it gives the current user permissions to join the room. Returns a string.

joinName(name, config)

Joins the room with the given name, after it makes all the needed checks. It retrieves the user's broker credentials and makes the mqtt connection, then subscribes to that room. The function is async and returns the mqttClient object which is needed as an argument for some other functions.

joinCode(code, config)

Very similar to joinName, but this time we use a random invitation string to join the room. That string is generated by the generatePassword function and is used to invite people to rooms that theydon't have access to.

fetchUserRooms(config)

An async function that makes a request to retrieve all the rooms that the current user has access to, Returns a list with these rooms.

fetchMessageHistory(name, config)

An async function that retrieve the message history of the room with that name. Should be used after a user joins are room. Return an array of objects for each message containing the sender and the message.

useMqttListener(name, client, onMessageReceived)

This is a custom hook for receiving messages in a room. The 3rd argument is the callback function that should handle the messages. For example:

const handleIncomingMessage = (message) => {
  setMessages((prevMessages) => [...prevMessages, message]);
};

useMqttListener(name, mqttClient, handleIncomingMessage);

messageSend(name, messageInput, username, mqttClient)

Packages and publishes the message to the room with that name.

generatePassword(name, config)

A function that generates an invitation code that can be used by a different user to join a room. The invitation is saved in the back end database and expires 1 hour after it is created. Only 1 invitation code can be active at a time. Returns the code.

disconnectMqtt(client, topic)

Unsubscribes from the room and disconnects from the broker.

leaveRoom(name, config)

Removes the user's permissions for that room.

deleteAccount(config)

Deletes the user's account both from the database and the Dynamic Security Plugin.

---s