How to add a filter to a popup window generated by javascript in Odoo 13

Question

I'm trying to extend file relational_fields.js from the web module in Odoo 13, so that in the request for quotation form, when i start entering a vendor name and the autocomplete options show with a Search More... link, when i click that link it adds a Vendors filter to the search.

I've found a way to get what I want if I edit the relational_fields.js file directly, though I cannot get it to work if I add a custom js file.

Any ideas on what I should do?

Here is the custom file I'm loading through the manifest. I've tried loading it by adding assets to the manifest as well as creating a view for the assets.

odoo.define('your_module_name.custom_relational_fields', function (require) {
    "use strict";

    var relational_fields = require('web.relational_fields');
    var FieldMany2One = relational_fields.FieldMany2One;

    var CustomFieldMany2One = FieldMany2One.extend({
        _manageSearchMore: function (values, search_val, domain, context) {
            values = values.slice(0, this.limit);
            values.push({
                label: _t("Search More..."),
                action: function () {
                    var prom;
                    if (context.res_partner_search_mode === 'supplier') {
                        domain = domain.concat([['supplier_rank', '>', 0]]);
                    }
                    if (search_val !== '') {
                        prom = this._rpc({
                            model: this.field.relation,
                            method: 'name_search',
                            kwargs: {
                                name: search_val,
                                args: domain,
                                operator: "ilike",
                                limit: this.SEARCH_MORE_LIMIT,
                                context: context,
                            },
                        });
                    }
                    Promise.resolve(prom).then(function (results) {
                        var dynamicFilters;
                        if (results) {
                            var ids = _.map(results, function (x) {
                                return x[0];
                            });
                            dynamicFilters = [{
                                description: _.str.sprintf(_t('Quick search: %s'), search_val),
                                domain: [['id', 'in', ids]],
                            }];
                            if (context.res_partner_search_mode === 'supplier') {
                                dynamicFilters = [{
                                    description: _.str.sprintf(_t('Quick search: %s, Vendors'), search_val),
                                    domain: [['id', 'in', ids], ['supplier_rank', '>', 0]],
                                }];
                            }
                        }
                        this._searchCreatePopup("search", false, {}, dynamicFilters);
                    }.bind(this));
                }.bind(this),
                classname: 'o_m2o_dropdown_option',
            });
            return values;
        },
    });

    return {
        CustomFieldMany2One: CustomFieldMany2One,
    };
});

I got the help from copilot for this, but it doesn't seem so effective at the moment. Here is my custom_relational_fields.js, which I have set in a custom pre-existing module, under static/src/js directory.

Here is my manifest file:

{
    "name": "my module name| Purchase enhancement",
    "summary": "Apply changes to core Odoo purchasing module to adapt changes to the customer requirement.",
    "license": "LGPL-3",
    "author": "much. GmbH",
    "auto_install": False,
    "application": False,
    "sequence": 100,
    "category": "Purchase",
    "version": "13.0.6.26.0",
    "depends": ["base", "product", "purchase", "purchase_stock", "web"],
    "data": [
        "views/purchase_order.xml",
        "views/product_views.xml",
        "views/res_partner_views.xml",
        "views/stock_picking_view.xml",
        "views/assets.xml",
        "wizard/display_dialog_box.xml",
        "data/ir_config_parameter_data.xml",
    ],
    # "assets": {
    #      "web.assets_backend": [
    #          "my_module/static/src/js/custom_relational_fields.js",
    #      ],
    #  },




}

Here is the assets.xml recommended by co-pilot:

<odoo>
    <template id="assets_backend" name="custom assets" inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <script type="text/javascript" src="/my_module/static/src/js/custom_relational_fields.js"></script>
        </xpath>
    </template>
</odoo>

Find the original relational_fields.js at: https://github.com/odoo/odoo/blob/13.0/addons/web/static/src/js/fields/relational_fields.js

And the updated part of the code which I found to be working inside the relational_fields file:

   _manageSearchMore: function (values, search_val, domain, context) {
        var self = this;
        values = values.slice(0, this.limit);
        values.push({
            label: _t("Search More..."),
            action: function () {
                var prom;
                /* if context res_parnter_search_mode key is supplier, then domain should*/
                /* be updated to include the supplier filter */
                if (context.res_partner_search_mode === 'supplier') {
                    domain = domain.concat([['supplier_rank', '>', 0]]);
                }
                if (search_val !== '') {
                    prom = self._rpc({
                        model: self.field.relation,
                        method: 'name_search',
                        kwargs: {
                            name: search_val,
                            args: domain,
                            operator: "ilike",
                            limit: self.SEARCH_MORE_LIMIT,
                            context: context,
                        },
                    });
                }
                Promise.resolve(prom).then(function (results) {
                    var dynamicFilters;
                    if (results) {
                        var ids = _.map(results, function (x) {
                            return x[0];
                        });
                        dynamicFilters = [{
                            description: _.str.sprintf(_t('Quick search: %s'), search_val),
                            domain: [['id', 'in', ids]],
                        }];
                        if (context.res_partner_search_mode === 'supplier') {
                            dynamicFilters= [{
                             description: _.str.sprintf(_t('Quick search: %s, Vendors'), search_val),
                             domain: [['id', 'in', ids], ['supplier_rank', '>', 0]],
                            }];
                            }

                    }
                    self._searchCreatePopup("search", false, {}, dynamicFilters);
                });
            },
            classname: 'o_m2o_dropdown_option',
        });
        return values;
    },