I am trying to create a pie graph in ExtJS 4.2.2.1144 (3rd party product that I have no control over). I need to set custom colors to my pie slices, which works as needed. However, the legend does not match. How do I fix it so that the legend uses those same custom colors as the pie slices?

_createPieChart: function (records) {
    var pieChart;
    if (this.pieChart) {
        this.remove(this.pieChart);
        this.titleByPlanEstimate.destroy();
        this.pieChart.destroy();
    }
    // Prepare data for pie chart based on radio button selection
    var radio1 = Ext.getCmp('radio1');
    var pieChartData = radio1.getValue() ? this._prepareDataByThemeCount(records) : this._prepareDataByPlanEstimate(records);

    var totalCount = 0;
    pieChartData.forEach(function (item) {
        totalCount += item.count;
    });

    const colors = pieChartData.map(item => item.color);

    pieChart = Ext.create('Ext.chart.Chart', {
        xtype: 'chart',
        width: 500,
        height: 350,
        animate: true,
        //colorSet: colors,
        store: {
            fields: ['theme', 'count'],
            data: pieChartData // Use the prepared pie chart data
        },
        series: [{
            type: 'pie',
            angleField: 'count',
            animate: true,
            showInLegend: true,
            renderer: function(sprite, record, attr, index, store) {
                const recordTheme = record.data.theme;
                const sectionColor = pieChartData.find(item => item.theme === recordTheme).color;
                attr.fill = sectionColor ?? 'red';
                return attr;
            },
            label: {
                field: 'theme',
                display: 'rotate',
                renderer: function (storeItem, item) {
                    var theme = storeItem;
                    var count = pieChartData.find(function (record) {
                        return record.theme === theme;
                    }).count;
                    return (count / totalCount * 100).toFixed(2) + "%";
                }
            },
            highlight: {
                segment: {
                    margin: 20
                }
            },
            listeners: {
                itemmousedown: function (series, item, event) {
                    console.log('Clicked on', item.record.get('theme'));
                }
            }
        }],
        legend: {
            position: 'right',
            labelFont: '12px Arial',
            itemSpacing: 8,
        },
        insetPadding: 30
    });

As it currently exists, the pie chart itself receives its colors from the renderer for series. colorSet doesn’t appear to do anything, so it is commented out.