Multiple dates and colors on Calendar

My app has multiple “jobs” in various stages, and each job has multiple dates for different phases of the job. This is all fine until it comes to showing the jobs on the calendar collection. Right now I use some computed columns to basically filter out the most relevant date right now and display that one on the calendar, and another computed column to set the color of the event on the calendar. Not really a problem, it works.

The only issue is: drag and drop will not work because dates are being displayed from a computed column. There’s 5 possible dates which all get filtered into one date depending on job status and/or some other criteria.

I know my explanation is a little bit vague, but I think if I want to retain drag and drop functionality, I either need to overhaul the way I deal with dates on the calendar, or run multiple calendars (I don’t want to do this), or alternatively be able to display multiple rows on one calendar AND be able to attribute a different color for each row (I don’t know if this is possible).

It’s purely a QOL issue, and the ladies in the office are transitioning from Google Calendar and do rely on this function to quickly change and organize work weeks. Right now the process is to click each thing you want to change on the calendar to bring up an overlay, and then change the date you need to change, and then submit it. Not the end of the world but it would be great if there was a way to just automatically change the date that’s being displayed (it’s already filtered).

Or alternatively just show all of the dates and have them in different colors. But since the Calendar collection only reads off one column, I’m not sure if that’s possible. Maybe an array of dates? But then how would you attribute a color to each one of them?

Just thinking out loud, any ideas are appreciated!

Natively you cannot achieve different colors for different events in the calendar component.

You probably won’t like the idea, but it might still do the trick: if you need different colors for categories or the status of an event/task (to-do, doing, review, blocked, done), have you considered using colored emojis (:black_circle::orange_circle::yellow_circle::red_circle::green_circle:) directly in the name of the event? You could make these dynamic with a template column as your colleagues would change the category or status of the event. Just an idea.

1 Like

So I am able to have different colors for different types of events currently.

Using the emojis for coloring is not a bad idea, at least that way I would be able to choose the color myself, and keep it the same as what we’re used to. If all the events were in black it might look cute.

If I could do that, and display multiple dates per row we’d be in business. But I still don’t think that’s possible… I did a little test and I cannot feed the calendar an array of dates. Would be cool if I could. I might just have to live with the limitations for now.

1 Like

A version of the Calendar component stripped of the day/week views and start/end times, that would allow picking multiple columns similar to the Fields component and display them as whole single day events would be a dream come true. One day per event, one color per column.

is this in Pages? how did you achieve different colored events? please share your wisdom, I really want to do this!

@Stephanie

1 Like

ah! so easy! thank you! would be amazing if it was that easy/possible for map pins!

2 Likes