Hello, im trying to make a customization to add a new component into the 

pos_self_order module but im not sure what im doing wrong. Im trying to add a new page into the self order enviroment to show this page first.  Here is my code where i inherit the template and the js code : 

<?xml version="1.0" encoding="UTF-8"?>

<templates xml:space="preserve">

    <t t-name="cysa_pos_self_order.selfOrderIndex" t-inherit="pos_self_order.selfOrderIndex" t-inherit-mode="extension" owl="1">

        <xpath expr="//Router" position="inside">

            <t t-set-slot="customer_index" route="`/pos-self/${selfOrder.pos_config_id}/customers`">

                <CustomerIndexPage/>

            </t>

        </xpath>

    </t>

</templates> 

import { patch } from "@web/core/utils/patch";

import { selfOrderIndex } from "@pos_self_order/app/self_order_index";

import { CustomerIndexPage } from "@cysa_pos_self_order/app/customer_page/customer_page";

patch(selfOrderIndex.prototype, {

    setup() {

        super.setup();

        this.constructor.components = {

            ...this.constructor.components,

            CustomerIndexPage

        };

    },

});