1

I'm a complete JS n00b and I'm really struggling to figure this out. I'm trying to change the default colors used in graphs. There's a 'getColors' functions in web/views/graph/colors.js that simply returns an array of colors that are used for this and it seems best to me to just override this function with my own array of colors but I can't for the life of me figure out how to patch it because this function does not belong to a class.

The original code (that I want to patch) looks like this (notice that none of this is inside a class):

/** @odoo-module **/
const COLORS_BRIGHT = [
    "#1f77b4",
    // rest removed for brevity
];

const COLORS_DARK = [
    "#00ffff",
    // rest removed for brevity
];

// this is the function I want to replace with my own
export function getColors(colorScheme) {
    return colorScheme === "dark" ? COLORS_DARK : COLORS_BRIGHT;
}

// a few more functions that I don't care about

I've created my own colors.js like this

/** @odoo-module **/    
import { patch } from '@web/core/utils/patch';
import { getColors } from '@web/views/graph/colors';

const MY_COLORS_BRIGHT = [
    "#1f77b4",
    // rest removed for brevity
];

const MY_COLORS_DARK = [
    "#00ffff",
    // rest removed for brevity
];

patch(getColors, 'my_module.colors', {
    getColors(colorScheme) {
        return colorScheme === "dark" ? MY_COLORS_DARK : MY_COLORS_BRIGHT; 
    }
}

Obviously this doesn't work - it adds a new getColors function inside the old getColors function instead of replacing it. Normally I think I would patch the Class with getColors function and that would work I think but there is no class to patch in this case. How can I go about replacing this function without it having a parent to patch?

dwyatt
  • 111
  • 1
  • 6
  • If you created your own `colors.js` file then just don't import the `getColors` function and use your own. I don't get what you mean by "this is not a class" because it is just a simple function export within a module. you can't override that function (that's not the idea of modules) except you modify the source itself. the problem are the constants `MY_COLORS_BRIGHT` - these are returned in the function, you would need to change their values. – zangab Feb 03 '23 at 17:21
  • the `getColors` function (or actually `getColor` function in original `colors.js` file) is used in dozens of places across Odoo. I can't (or rather don't want to) inherit/patch/otherwise modify all locations that call this function to instead call my own. I need to instead patch the original function to call a different one. I've solved this problem - see my solution below. – dwyatt Feb 03 '23 at 20:23

1 Answers1

1

I've solved my own problem. The key here is importing the entire colors.js file with import * as colors and then patching colors with the new function. I'm not sure why, but when doing it this way I was unable to patch the getColors function directly (the original one would still be called). But patching getColor (which is what all other modules actually call) and using my own getMyColors function it works.

/** @odoo-module **/
import { patch } from '@web/core/utils/patch';
import * as colors from '@web/views/graph/colors';

const MY_COLORS_BRIGHT = [
    "#1f77b4",
    // rest removed for brevity
];

const MY_COLORS_DARK = [
    "#00ffff",
    // rest removed for brevity
];

function getMyColors(colorScheme) {
    return colorScheme === "dark" ? MY_COLORS_DARK : MY_COLORS_BRIGHT;
}

patch(colors, 'my_module.colors', { 
    getColor(index, colorScheme) {       
        const colors = getMyColors(colorScheme); 
        return colors[index % colors.length]; 
    } 
});
dwyatt
  • 111
  • 1
  • 6