Rewrite Class (4h)

A plugin can rewrite a class from core or other plugin.

Config Rewrite

In the plugin, we register rewrite in file etc/config.js.

For example: We rewrite MenuComponent

import rewriteMenu from "../view/menu";
import ModuleConfigAbstract from "../../ModuleConfigAbstract";

class HelloWorldConfig extends ModuleConfigAbstract{
    module = ['helloworld'];
    rewrite = {
        service: {
            // "UserService": BlaService
        },
        container: {
            // "LoginContainer": HelloWorldContainer
        },
        component: {
            MenuComponent: rewriteMenu
        },
    };
}

export default (new HelloWorldConfig());

We have 7 type of class can be rewrite:

service
resource_model
repository
epic
container
component
data_resource

To determine which type of class, we can find Factory type in source code. Example:

/**
 *
 * @type {MenuComponent}
 */
const component = ComponentFactory.get(MenuComponent);

Rewrite Implementation

To implement rewrite, we need using javascript function. For example, we implement rewrite for MenuComponent as:

import React, {Fragment} from "react";

/**
 * Rewrite MenuComponent
 *
 * @param {MenuComponent} MenuComponent
 * @returns {RewriteClass}
 */
export default function(MenuComponent) {
    return class Rewrite extends MenuComponent {
        template() {
            let template = super.template();
            return (
              <Fragment>
                Hello World!
                {template}
              </Fragment>
            )
        }
    }
}

Rewrite Epic

Epic is a Function, not a Class. So rewriting epic has a little difference. For example, we implement rewrite for LocationEpic as:

Exercise: Use rewrite to display Description of product to product list of POS

Dev Training Document

Rewrite Class (4h)

Analytics

Config Rewrite

Rewrite Implementation

Rewrite Epic

Related content