Show 7 days and actual day

[gruffat.florent]

Hi,

I am trying to display the 7 days of the week with the day (Monday, Tuesday…) and the day number (15,16…) as well as a mark on the active day. I also want when we click on the right arrow to go to the next week and the left arrow to go to the previous week. I spent 3 hours on it, impossible to get there (despite the help of GPT which lost me more than helped.). Can you help me?

[QIRO]

I think there’s a bit to unpack here.

You may want to share how you’ve got to where you are already so people can help you more easily.

Changing week with your arrows, for example, could be achieved with a custom state that is increased/decreased by a set amount, be it one day/week and so on.

But for that to work, your database would have to have week numbers, or be extracting week numbers from dates, assuming your dates adhere to Bubble’s default values.

[gruffat.florent]

I would create this for desktop app for a personal use with two arrows next and previous.

[bubble.trouble]

Use this plugin:

Templates for Bubble

I don’t have time to share all of the details but you can get a result like this:

[romanmg]

Hey @gruffat.florent , you’ll need to pull several components together, but it’s definitely possible! Here’s a list to get started with:

1. Get the “Calendar Tool” plugin (free) to generate a list of dates.
2. Use a custom state to store the first day of the week you want to display. You’ll reference the plugin’s output and manipulate it to find that date. E.g. “calendar tool’s dates :filtered (this date :extract week is current date :extract week) :rounded down to week :first item” … you may need to +/- 1 day depending on when you want the week to start.
3. Use a repeating group for the week view interface.
4. The plugin’s output will be the repeating group’s data source, but filter it so it only shows from the custom state’s value and forward, and use “items until 7” to limit it to 7 days.
5. Your Previous/Next arrows will update the custom state by subtracting/adding 7. This changes the start of the week, which then changes the entire week view.
6. Remember each cell in the RG represents a date. So use a condition inside the cell to add some visual to show today. E.g. “Cell’s date equals rounded down to current date (select date).”

There are many directions you can go with each of these steps, but hopefully this points you in a better direction!

Cheers,
Gaby
Coaching No Code Apps

[gruffat.florent]

Thank you for your response, for the moment I have managed to display the 7 days of the current week and to create two buttons to go to the next and previous week, however beyond the 31st there is no more date, and I would like it to continue forever.

[romanmg]

Ah yes. The calendar tool plugin generates dates for a single month at a time. I’m assuming you’ve just given it the current date and time. I whipped up a sample for how I’d address this. The custom state is also going to power the calendar tool. And, I’m using 2 calendar tools to fill in weeks that are split between 2 months:

Bubble Editor - coaching-sandbox

The custom state is on the page, and you’ll see the workflows that change its value . Pay attention to the data sources for repeating group and both calendar tools.

[gruffat.florent]

I can’t see : User does not have permission to view this document

[romanmg]

Sorry about that. Should be accessible as read-only now.