Reactive (Socket) - Server

Introduction

ReactiveTable is a module that adds reactive capabilities to your Sequelize models using Socket.IO. With ReactiveTable, you can easily make your Sequelize models reactive and update connected clients in real-time. This allows you to create reactive components and improve the user experience of your application.

ReactiveTable is integrated directly with the http module and the database module (Sequelize), making it easy to use and simplifying the setup process. Once you have created your ReactiveTable model, you can use Socket.IO to send updates to connected clients with minimal code.

ReactiveTable also provides several reactive hooks, including CREATE, UPDATE, and DELETE hooks, that allow you to customize the behavior of your reactive components. With these hooks, you can forward updates to specific clients based on their user IDs or the rooms they are in, making your application even more responsive.

Overall, ReactiveTable is a powerful tool that simplifies the use of Socket.IO with Sequelize and makes your application more reactive. With ReactiveTable, you can easily create reactive components and improve the user experience of your application.

Installation

To use ReactiveTable, you will need to add the following code to your config.js file after the database and http modules:

reactitypeve: {
    module: require('etherial/components/reactive').Reactive,
    config: {}
},

This code will load the ReactiveTable module and add it to your application.

You will also need to make the following modifications to your code:

1. Add the following code to etherial.d.ts to import the Reactive module:

import { Reactive } from "etherial/dist/components/reactive";

1. Add the reactive property to the Etherial class:

export declare class Etherial implements IEtherial {
    ...
    reactive: Reactive;
    ...
}

1. Modify the run function in app.ts to include the reactive parameter:

run({ http, database, reactive }: Etherial) {
    ...
}

1. Add reactive.listen() to the return statement of the run function:

return Promise.all([
    reactive.listen(),
    http.listen(),
    database.sequelize.sync({
        alter: true,
    }),
]);

These modifications will enable ReactiveTable and allow your application to handle reactive updates using Socket.IO.

This code will load the ReactiveTable module and add it to your application.

Required Modules

ReactiveTable requires the following modules to work properly:

• Http Module (Required)

• Database Module (Required)

• Http Security Module (Optional)

The Http Module is required to handle HTTP requests and responses, while the Database Module is required to connect to your database and manage your Sequelize models.

The Http Security Module is optional and is used to add security features to your application, such as authentication and authorization. If you are using Http Security, make sure to add it to your config.js file before the ReactiveTable module.

Usage

Here's how you can use the ReactiveTable class in your Sequelize model:

1. Import the necessary dependencies:

import { Sequelize, Model, DataTypes } from "etherial/components/database/provider";
import { ReactiveTable, ReactiveTableHookType } from "etherial/components/reactive/provider"

1. Create a Sequelize instance and pass it to the ReactiveTable constructor:

@ReactiveTable({
    sequelize,
    timestamps: true,
    tableName: "tests",
    freezeTableName: true,
    reactive: {
        [ReactiveTableHookType.CREATE]: ({forwardToRooms, instance}) => {
            forwardToRooms(["all"]);
        }
    },
})
export class Test extends Model {
    @AutoIncrement
    @PrimaryKey
    @AllowNull(false)
    @Column
    id: number;
    
    @AllowNull(true)
    @Column
    data: string;
}

In this example, we've defined a Test model with two columns - id and data. We've also defined reactive hooks for CREATE, UPDATE, and DELETE events. These hooks will forward updates to all connected clients using Socket.IO.

1. Use the model in your code:

await Test.create({ data: "Hello, world!" }); // This will trigger the CREATE hook and forward the update to all connected clients.

await Test.update({ data: "Hello, Sequelize!" }, { where: { id: 1 } }); // This will trigger the UPDATE hook and forward the update to all connected clients.

await Test.destroy({ where: { id: 1 } }); // This will trigger the DELETE hook and forward the update to all connected clients.

The forwardToRooms and forwardToUsers methods can be used in the reactive hooks to forward updates to specific clients. Here's how they work:

forwardToRooms

The forwardToRooms method is used to forward updates to all clients in a specific Socket.IO room. You can pass an array of room names to the method to forward the update to all clients in those rooms. For example:

Room Name	Description
all	Will forward to all socket
visitors	Will forward to all non authenticated socket
users	Will forward to all authenticated socket
user_${id}	Will forward to specific authenticated socket with user_id

@ReactiveTable({
    sequelize,
    timestamps: true,
    tableName: "tests",
    freezeTableName: true,
    reactive: {
        [ReactiveTableHookType.CREATE]: ({forwardToRooms, instance}) => {
            forwardToRooms(["room1", "room2"]); // Forward the update to clients in rooms "room1" and "room2"
        },
    },
})
export class Test extends Model {
    @AutoIncrement
    @PrimaryKey
    @AllowNull(false)
    @Column
    id: number;
    
    @AllowNull(true)
    @Column
    data: string;
}

In this example, the CREATE hook will forward updates to all clients in the "room1" and "room2" rooms.

forwardToUsers

The forwardToUsers method is used to forward updates to specific clients based on their user IDs. You can pass an array of user IDs to the method to forward the update to those specific clients. For example:

@ReactiveTable({
    sequelize,
    timestamps: true,
    tableName: "tests",
    freezeTableName: true,
    reactive: {
        [ReactiveTableHookType.CREATE]: ({forwardToUsers, instance}) => {
            forwardToUsers([1, 2, instance.user_id]); // Forward the update to clients with user IDs 1 and 2 and instance.user_id
        },
    },
})
export class Test extends Model {
    @AutoIncrement
    @PrimaryKey
    @AllowNull(false)
    @Column
    id: number;
    
    @AllowNull(true)
    @Column
    data: string;
}

In this example, the CREATE hook will forward updates to clients with user IDs 1 and 2.

How ReactiveTable hooks work

ReactiveTable hooks are functions that are called when a specific event occurs in the Sequelize model. There are three types of hooks: CREATE, UPDATE, and DELETE. Here's how each of them work:

ReactiveTableHookType.CREATE

The CREATE hook is called when a new record is created in the Sequelize model. The hook function receives two parameters: forwardToRooms and forwardToUsers. You can use these methods to forward updates to connected clients.

ReactiveTableHookType.UPDATE

The UPDATE hook is called when an existing record is updated in the Sequelize model. The hook function receives two parameters: forwardToRooms and forwardToUsers. You can use these methods to forward updates to connected clients.

ReactiveTableHookType.DELETE

The DELETE hook is called when an existing record is deleted from the Sequelize model. The hook function receives two parameters: forwardToRooms and forwardToUsers. You can use these methods to forward updates to connected clients.

ReactJS example:

// Coming

Conclusion

ReactiveTable is a great way to make your Sequelize models reactive and update connected clients in real-time using Socket.IO. With ReactiveTable, you can easily define reactive hooks to forward updates to specific clients based on their user IDs or the rooms they are in.