handleAuthClick not returning any Promise

[noblessem]

handleAuthClick doesnt return any promise, so it is imposible to use it with other methods in lib

Hi @noblessem , had the same problem, give it a try:

let GTokenClient;
 //...

  useEffect(() => {
    apiCalendar.onLoad(() => {
      console.info('> GAPI loaded');
      GTokenClient = apiCalendar.tokenClient;
    });
  }, []);

  const handleAuthClick = () => {
    return new Promise((resolve, _) => {
      GTokenClient.callback = (resp: any) => {
        resolve(resp);
      };

      if (gapi && GTokenClient) {
        if (gapi.client.getToken() === null) {
          GTokenClient.requestAccessToken({ prompt: 'consent' });
        } else {
          GTokenClient.requestAccessToken({
            prompt: ''
          });
        }
      } else {
        console.error('gapi not loaded');
      }
    });
  };

[Kubessandra]

Hi,
Yes because requestAccessToken(the google method used in the package) does not return a Promise unfortunately.

If you want @carlos-molero you can make this change to the package, if this is working for you.

As soon as I have some time I will submit a PR. I’m gonna rely heavily on this for a production project so I will be keeping an eye on the repo 😊

[Kubessandra]

As soon as I have some time I will submit a PR. I’m gonna rely heavily on this for a production project so I will be keeping an eye on the repo 😊

I will not have the time in the next two weeks to do it, but I will be able to review and approve it 😇

[oscarcusin]

Hi @Kubessandra, I have a working version which returns a promise that resolves if authentication is successful and rejects if unsuccessful:

  /**
   * Sign in Google user account
   * @returns {any} Promise resolved if authentication is successful, rejected if unsuccessful.
   */
  public handleAuthClick(): any {
    if (gapi && this.tokenClient) {
      return new Promise((resolve, reject) => {
        this.tokenClient!.callback = (resp: any) => {
          if (resp.access_token) {
            resolve(resp);
          } else {
            reject(resp);
          }
        }
        this.tokenClient!.error_callback = (resp: any) => {
          reject(resp);
        }
        if (gapi.client.getToken() === null) {
          this.tokenClient!.requestAccessToken({ prompt: "consent" });
        } else {
          this.tokenClient!.requestAccessToken({ prompt: "" });
        }
      })
    } else {
      console.error("Error: this.gapi not loaded")
      return Promise.reject(new Error("Error: this.gapi not loaded"))
    }
  }

In order for this to work I had to extend google.accounts.oauth2.TokenClient to include callback and error_callback as such:

interface ExtendedTokenClient extends google.accounts.oauth2.TokenClient {
  callback?: (resp: any) => void;
  error_callback?: (resp: any) => void;
}

And define tokenClient as of type ExtendedTokenClient | null = null;.

This works flawlessly for my project, and I will gladly submit a PR if this is of interest :).

[Kubessandra]

Hi,
Yes totally, lets submit a PR for this 🚀👌