react-add-to-calendar all day event

Question

I'm using react-add-to-calendar package to render "add to my calendar" button on my app.

On their documentation you can find examples for the right way of passing event to their component. The only issue I have is how to pass startTime and endTime to notify my event is an all day event. I tried some options manually and to format my dates with momentJS but I failed to find the right way of doing it (if there is a one)

Hope someone has already dealt with this problem.

import React from "react";
import moment from 'moment';
import AddToCalendar from 'react-add-to-calendar';

let icon = { 'calendar-plus-o': 'left' };

class Calendar extends React.Component {

    createEvent = () => {
        const {finalDate} = this.props;

      // when i tried to format my date
      // const startTime = moment(finalDate).format("YYYY-MM-DD");
      // const endTime = moment(finalDate).format("YYYY-MM-DD");

        return {
            title: "My event",
            description: "my all day event",
            location: 'Portland, OR',
            startTime: "2020-06-21",
            endTime: "2020-06-21"
        }
    }

    render() {
        return (
            <AddToCalendar
                event={this.createEvent()}
                buttonTemplate={icon}
            />
        );
    };
}

export default Calendar;

edit: they just don't support this option.

Answer 1

Why don't you just set

{
    startTime: '2020-06-21T00:00:00',
    endTime: '2020-06-21T23:59:59'
}

Answer 2

Unfortunately, I don't think all day events are supported; c.f. https://github.com/jasonsalzman/react-add-to-calendar/blob/master/src/helpers/index.js#L67

Answer 3

I know this is quite some old question.

Still, in case anybody is struggeling and since the referenced code is no longer maintained:

Check out my open-source solution (also supporting all-day events): https://github.com/jekuer/add-to-calendar-button