Outlook Appointment Auto-populated using SPFx React

Question

Currently I use the ICS file to create an auto populated appointment and once the user clicks on the button it downloads the file and the user have to open it. But I am looking for a way to directly open the Outlook Appointment using 1 click without the use of ICS file.

Below is the code which I have used

createICS = (card: any) => {
    const { selectedDate, selectedStart, selectedEnd } = this.state;

    // Format start and end times
    const start = selectedStart.toISOString().slice(11, 16).replace(":", "");
    const end = selectedEnd.toISOString().slice(11, 16).replace(":", "");

    // Format date
    const year = selectedDate.getFullYear();
    const month = selectedDate.getMonth() + 1;
    const date = selectedDate.getDate();

    // Create ICS file
    const icsFile = `BEGIN:VCALENDAR
VERSION:2.0
BEGIN:VEVENT
ATTENDEE;CN=${
      card.displayName
    };CUTYPE=RESOURCE;ROLE=NON-PARTICIPANT;RSVP=TRUE:mailto:${card.emailAddress}
DTSTART:${year}${month < 10 ? "0" : ""}${month}${
      date < 10 ? "0" : ""
    }${date}T${start}00Z
DTEND:${year}${month < 10 ? "0" : ""}${month}${
      date < 10 ? "0" : ""
    }${date}T${end}00Z
SUMMARY:
DESCRIPTION:
LOCATION:${card.displayName}
BEGIN:VALARM
TRIGGER:-PT15M
REPEAT:1
DURATION:PT15M
ACTION:DISPLAY
DESCRIPTION:Reminder
END:VALARM
END:VEVENT
END:VCALENDAR`;

    // Create download link
    const link = document.createElement("a");
    link.href = `data:text/calendar;charset=utf-8,${encodeURIComponent(
      icsFile
    )}`;
    link.download = "my-event.ics";
    link.click();
  };