ColumnHeaderRender for Week mode does not return allDay events

[taauntik]

Forum post

Hello,

I want to display the sum of all events' value in the column header. This is my code for the week mode:

 week: {
          maxAllDayHeight: '100%',
          allDayEvents: { autoHeight: true },
          eventRenderer: eventRenderer,
          columnHeaderRenderer: (dayCell: DayCell) => {
            let sum = 0;
            console.log(dayCell); //the log in the screenshot comes from this line
            dayCell.events.forEach((event) => {
              const val = event.getData('value');
              sum += val;
            });
            return `${sum} `;
          },
        },

The allDay events were not returned by the columnHeaderRenderer function.
The column header value for the date 5/2/2025 in my screenshot should be 9, not 5.

[ExtAnimal]

DayView.js needs

    doRefresh() {
        const
            me                   = this,
            {
                    element,
                    noMatchingDates,
                    allDayEvents
            }                    = me,
            columnHeaderRenderer = me.resolveCallback(me.columnHeaderRenderer, me, false);

        if (me.isVisible) {
            // Opt out of animations while we refresh to avoid reused elements resizing
            // unless the refresh caller wanted to opt in to transitions.
            if (!me.allowTransitionsOnRefresh) {
                DomHelper.addTemporaryClass(element, 'b-no-transitions', 200, me);
            }
            // Null means it is not set, and allowed to be set.
            // CalendarDrag sets it to false
            me.allowTransitionsOnRefresh = null;

            const
                headerCells = [],
                dayCells    = [];

            // Calculate this for getDayDomConfig only once per refresh.
            me.today = me.dayTime.startOfDay(me.calendar?.dateTimeNow || new Date());

            // Create day cell child array. DomSync ignores null array entries which is what
            // getDayDomConfig returns for hidden days.
            for (let i = 0, date = new Date(me.startDate); date < me.endDate; i++, date.setDate(date.getDate() + 1)) {
                const dayCell = me.getDayDomConfig(date);

                if (dayCell) {
                    dayCells.push(dayCell);

                    // Create day header cells if we are configured with a columnHeaderRenderer
                    if (allDayEvents && columnHeaderRenderer) {
                        // dayCell will be nullish for skipped days due to hidden non working days
                        // or hideEmptyDays or the dateFilter callback rejecting the date
                        if (dayCells[i]) {
                            const
                                key        = me.dayTime.dateKey(date),
                                headerCell = {
                                    dataset : {
                                        syncId : key
                                    },
                                    className : {
                                        'b-day-column-header-cell' : 1
                                    }
                                },
                                headerContent = columnHeaderRenderer.handler.call(columnHeaderRenderer.thisObj, allDayEvents.cellMap.get(key));

                            if (headerContent) {
                                headerCell[typeof headerContent === 'string' ? 'html' : 'children'] = headerContent;
                            }
                            headerCells.push(headerCell);
                        }
                        else {
                            headerCells.push(null);
                        }
                    }
                }
            }

            if (columnHeaderRenderer) {
                element.classList.add('b-has-day-header');
                DomSync.sync({
                    targetElement : me.dayHeaderContentElement,
                    domConfig     : {
                        onlyChildren : true,
                        children     : headerCells,

                        // Match existing data-syncId elements first and ensure DOM order matches
                        // children order.
                        syncOptions : {
                            syncIdField      : 'syncId',
                            releaseThreshold : 0,
                            strict           : true
                        }
                    }
                });
            }
            else {
                element.classList.remove('b-has-day-header');
            }

            // Flag element if it's showing multiple day columns
            element.classList.toggle('b-multidayview', dayCells.length > 1);
            element.style.setProperty('--visible-column-count', dayCells.length);

            // Allow subclasses to mutate final cell DomConfig state
            me.onDayCellConfigGenerated?.(dayCells);

            DomSync.sync({
                targetElement : me.dayContainerElement,
                domConfig     : {
                    onlyChildren : true,
                    children     : dayCells.length ? dayCells : [{
                        className                                          : 'b-empty-text',
                        [noMatchingDates?.includes('<') ? 'html' : 'text'] : noMatchingDates
                    }],

                    // Match existing data-date elements first and ensure DOM order matches
                    // children order.
                    syncOptions : {
                        syncIdField      : 'date',
                        releaseThreshold : 0,
                        strict           : dayCells.length > 0
                    }
                }
            });
            me.element.classList.toggle('b-no-days', !dayCells.length);

            // In case height has changed since last refresh.
            me.refreshDayBackground();

            me.refreshCount = (me.refreshCount || 0) + 1;

            me.syncCurrentTimeIndicators();

            /**
             * Fires when this DayView refreshes.
             * @param {Calendar.widget.DayView} source The triggering instance.
             * @event refresh
             */
            me.trigger('refresh');
        }
    }