Create Dynamic Button for Upcoming Dates

ddhruv

Hi, I am trying to create and appointment booking bot for WhatsApp.

I want to create the a Dynamic Block for getting Upcoming Dates so that people can select the date they want to book and appointments.

i tried asking ChatGPT for generating script

Plain Text

function getUpcomingDates(daysCount) {
    const today = new Date();
    const upcomingDates = [];

    for (let i = 1; i <= daysCount; i++) {
        let futureDate = new Date();
        futureDate.setDate(today.getDate() + i);

        // Format the date as 'YYYY-MM-DD'
        const formattedDate = futureDate.toISOString().split('T')[0];
        upcomingDates.push(formattedDate);
    }

    // Set the upcoming dates in a Typebot variable
    setVariable('upcomingDates', upcomingDates);
}

// Call the function to get 5 upcoming dates and store them in 'upcomingDates'
getUpcomingDates(5);

but it dint work, is there any solution or other way around to approach this ?

25 comments

ddhruv

Attachment

VVilela

The function box never worked for me, when i want to set variable i put it in setVariable box, try this

Attachments

ddhruv

i have modified a littlebit to show more than one date

but the issue is i am getting the dates as i need in the Web. but in the WhatsApp i am getting and array instead of button.

as attached in the screenshot

Code used

Plain Text

Date.prototype.addDays = function(days) { 
    let date = new Date(this.valueOf());
    date.setDate(date.getDate() + days);
    return date;
};

function formatDate(date) {
    let day = date.getDate();
    let month = date.getMonth() + 1; // Months are zero-indexed
    let year = date.getFullYear();

    if (day < 10) {
        day = '0' + day; // Pad single digit days
    }
    if (month < 10) {
        month = '0' + month; // Pad single digit months
    }
    return year + '-' + month + '-' + day; // Return formatted date
}

// Get today's date
let today = new Date();

// Array to hold formatted dates
let futureDates = [];

// Loop through the next 7 days and format each date
for (let i = 0; i < 7; i++) {
    let futureDate = today.addDays(i);
    futureDates.push(formatDate(futureDate)); // Add the formatted date to the array
}

// Log all future dates
return(futureDates); // This will log an array of dates from today to the next 6 days

ddhruv

Attachment

ddhruv

Attachment

VVilela

Cool, I think you're in the same problem as me, like this post. We are waiting for answer from Batiste

https://discord.com/channels/1155799591220953138/1297939003051610163

VVilela

try again please, it worked for me

Attachment

ddhruv

here is my flow like

Attachment

VVilela

Are you having the same problem?

ddhruv

yes

ddhruv

But for me it's not fixed. I am still getting an array instead of Buttons in WhatsApp

VVilela

If you replace the "-" in date to "/", i use "-" to send to api, maybe it works to show in button

ddhruv

i tried but still dint work.

as you can see the attachment's in am i am getting the available dates from cal.com API, OpenAI then convert that response into Array. then i pass that into Button.

Attachments

ddhruv

I am randomly getting notifications that a new database is available, or error updating the new database. Something like this.

@Baptiste

Do I need to recreate the entire flow to fix my error?
not getting dynamic buttons in WhatsApp but in web chat it's perfectly fine and getting the buttons as I needed

ddhruv

Attachment