import { OdinClient } from '@4players/odin';
import { TokenGenerator } from "@4players/odin-tokens";

// Prepare the token to connect
const generator = new TokenGenerator(apiKey);
const token = generator.createToken("My Room", "John Doe");
const odinRoom = await OdinClient.initRoom(token);

// Handle events for new peers joining the room
odinRoom.addEventListener('UserDataChanged', (event) => {
    // Update the chat
    renderChat(event.payload.room.data)
});

// Connect the room
await odinRoom.join();

// Send a message to other clients
const data = {
    messages: []
};

const onSendButtonPressed = async function(message: Message) {
    data.messages.push(message);
    const encoder = new TextEncoder();
    odinRoom.data = encoder.encode(JSON.stringify(data));
    await odinRoom.update();
}

In all our SDKs, every Room has a UserData property that can be used to store arbitrary data. You can store the history of your chat in this property and our servers will make sure they are synced in real-time to all clients.

Instead of sending messages, add to or modify a message within the Room data array and the message will be synced - to all clients. This way, clients that connect later have access to the whole chat trail.

The SDKs automatically optimize bandwidth usage by only sending and processing changed bytes. Just update the room data as often as you like and use the Update function to update them on the servers. The callback UserDataChanged gets the whole user data. There is no requirement on your side to process that data.