Google API sign in listener run multiple times

I am developing a simple vue module to add events to google calendar. Once user signs in I am having a listener and I will call a method to add an event to the calendar. To get the gapi, I am using this vue library. https://github.com/cedpoilly/vue-gapi. But once I add the event and try to add another event, the addEvent method will run multiple times. For example if I add the event once all looks good. But If I press it again It will open the google calendar two times and add the same event two times. https://codesandbox.io/s/infallible-chaum-dg7nf

<template>
  <div class="row">
    <div class="col-md-6 ml-5 mt-3">
      <b-form>
        <b-form-group id="input-group-2" label="Add to" label-for="input-2">
          <b-button variant="outline-primary" @click="handleAuthClick">
            <b-icon icon="calendar3" aria-hidden="true"></b-icon> Google Calendar
          </b-button>
        </b-form-group>
      </b-form>
    </div>
 </div>
</template>
<script>
    export default {
     
      data(){
        return {
          show: true,
          disabled: false,
          items: '',
          event: '',
          gapi: null,
          partnerEmail: '',
          listner: null,
        }
      }
        methods: {
          onSubmit(evt) {
            evt.preventDefault();
            //alert(JSON.stringify(this.form));
            //this.meetingEdit(this.form);
            this.$router.push({ path: '/portal/meetingEdit/' })
          },
          deleteMeeting() {
            this.$router.push({ path: '/portal/meetingDelete/' })
          },
          addEvent() {

            var startDate = new Date(this.form.MeetingTime);
            var msDuration = (Number(this.form.Duration.split(':')[0]) * 60 * 60 + Number(this.form.Duration.split(':')[1]) * 60 + Number(this.form.Duration.split(':')[2])) * 1000;
            var endDate = new Date(startDate.getTime() + msDuration);
            var isoStartDate = new Date(startDate.getTime() - new Date().getTimezoneOffset() * 60 * 1000).toISOString().split(".")[0];
            var isoEndDate = new Date(endDate.getTime() - (new Date().getTimezoneOffset()) * 60 * 1000).toISOString().split(".")[0];
            var InviteesArr = [];
            var tempArr = this.form.Invitees.trim().split(',');
            for (var email of tempArr) {
              if (email !== "") {
                var obg = { 'email': email };
                InviteesArr.push(obg);
              }
            }

            var partner = { 'email': this.partnerEmail };
            InviteesArr.push(partner);

            this.event = {
              'summary': this.form.Topic,
              'location': this.form.InviteLink,
              'description': this.form.inviteDes,
              'start': {
                'dateTime': isoStartDate,
                'timeZone': this.form.Timezone
              },
              'end': {
                'dateTime': isoEndDate,
                'timeZone': this.form.Timezone
              },
              'attendees': InviteesArr,
              'conferenceData': null,
            }

            this.$getGapiClient().then((gapi) => {
              // gapi.sheets.spreadsheet.get(...)
              var request = gapi.client.calendar.events.insert({
                'calendarId': 'primary',
                'conferenceDataVersion': 1,
                'resource': this.event
              });

              request.execute( (event)=> {
                console.log(event);
                window.open(event.htmlLink, '_blank');
              });

              this.gapi.auth2.getAuthInstance().signOut();
              this.gapi = null;
            })
          },
          updateSigninStatus(bool) {
            if (bool) {
              console.log('login D');
              this.addEvent();
            } else {
              console.log('not login');
            }
          },
          handleAuthClick() {
            this.$getGapiClient().then((gapi) => {
              this.gapi = gapi;
              this.listner = this.gapi.auth2.getAuthInstance().isSignedIn.listen(this.updateSigninStatus);
              this.updateSigninStatus(this.gapi.auth2.getAuthInstance().isSignedIn.get());

              if (this.gapi.auth2.getAuthInstance().isSignedIn.get()) {
                this.addEvent();
              } else {
                this.gapi.auth2.getAuthInstance().signIn();
              }

            })
          }
        }
    }
    </script>

But I click the button addEvent() method will run more than once.