@Ragged4310
According to the conditions you provided, the previous code cannot be used. Clear definition of the conditions is essential to come up with an appropriate solution.

First, we need to clearly define the events that need to be collapsed. Based on your description, it seems they are in the form of “Person’s Name - Task.” Are you looking to group them by “Person’s Name”? However, it also seems that you do not want the “Person’s Name” to be exposed. In that case, how should they be displayed? For example, would you like them to be labeled sequentially as “Reservation 1,” “Reservation 2,” and so on?

Please provide more details about the AS-IS and TO-BE states.

Alternatively, assigning additional properties to the events to be grouped might also be a good approach. For instance, you could write the person’s name (e.g., Jane Doe) in the location or description field, and only include the task (e.g., Deep Tissue Massage) in the event title. Then, you could group events with the same description together.

@cpcode
I have no idea about that module, so I cannot promise the cowork with that kind of module. I wish you luck.

@Ragged4310
Instead of eventTransformer, we’ll use eventPayload because, this conversion should be applied to whole events, not a single event.

Insert this property into your config section of CX3 in config/config.js

/* `MMM-CalendarExt3` config section in config/config.js */
eventPayload: (payload) => {
	const fulldays = payload.filter(ev => ev.fullDayEvent === true)
	const singleEvents = payload.filter(ev => ev.fullDayEvent === false).sort((a, b) => a.startDate - b.startDate || a.endDate - b.endDate)
	const EventsArranged = singleEvents.reduce((acc, ev) => {
		const dateObj = new Date(+ev.startDate)
		const key = `${ev.title}-${new Date(dateObj).toLocaleDateString('en-CA')}`
		if (!acc.has(key)) {
			acc.set(key, [ev])
		} else {
			acc.get(key).push(ev)
		}
		return acc
	}, new Map())
	const collapsed = Array.from(EventsArranged.entries()).map(([ key, value ]) => {
		const newEvent = { ...value[ 0 ] }
		if (value.length > 1) {
			newEvent.title = newEvent.title + ` <sub class="collapsed">${value.length}</sub>`
			newEvent.endDate = Math.max(...value.map(ev => ev.endDate))
			newEvent.startDate = Math.min(...value.map(ev => ev.startDate))
		}
		return newEvent
	})
	return [ ...fulldays, ...collapsed ]
},

And to beautify, add some CSS code into css/custom.css

/* css/custom.css */
.CX3 .title sub::after,
#CX3_POPOVER .title sub::after {
  content: "]";
}

.CX3 .title sub::before,
#CX3_POPOVER .title sub::before {
  content: "[";
}

It will work like;

BEFORE

AFTER

---

• This code will not affect the fullday events.
• Not considered every aspect, like inter-day events or untested errors.

@Ragged4310
Now I c. I’ll try, wait a little.

@cpcode
Sorry, I still cannot reproduce it even with your config.

It could collapse the modules of other regions, but in the same region, it works.

What is your screen resolution? And the environment?

@cpcode
Well, Could you show me the capture? Because, there is nothing issued on my test.

Maybe some CSS interference with other modules, but I’m not sure of your things.

To make things simple,

• Remove all other modules except helloworld and CX3J from config. Try what happens.
• If something is wrong, show me the config.js and custom.css (eouia0819@gmail.com)

@Ragged4310
Could you show me the example of the events?

@redfishbluefish
Could you show me the sketches or drawing? I’m not sure what you want exactly.

@JohnGalt
Nothing special. However, some feeds might have non-standard image enclosure, so in that case, image will not be shown.
That module was order-made, so not all the possible cases are considered. If you have some specific newsfeed, tell me the url.

@czabel

You can simply append this code to your css/custom.css

.CX3 .legend.useSymbol .symbol {
  display: none;
}