diff --git a/client/auth/google/getAccessToken.js b/client/auth/google/getAccessToken.js new file mode 100644 index 0000000..4e418a2 --- /dev/null +++ b/client/auth/google/getAccessToken.js @@ -0,0 +1,113 @@ +/** + * Type Definitions + * =============================================================================== + */ + +/** + * @typedef {object} GoogleIdentityPromptNotification + * @property {function(): string} getMomentType - Notification moment type + * @property {function(): string} getDismissedReason - Notification get Dismissed Reason + * @property {function(): string} getNotDisplayedReason - Notification get Not Displayed Reason + * @property {function(): string} getSkippedReason - Notification get Skipped Reason + * @property {function(): boolean} isDismissedMoment - Notification is Dismissed Moment + * @property {function(): boolean} isDisplayMoment - Notification is Display Moment + * @property {function(): boolean} isDisplayed - Notification is Displayed + * @property {function(): boolean} isNotDisplayed - Notification is Not Displayed + * @property {function(): boolean} isSkippedMoment - Notification is Skipped Moment + */ + +////////////////////////////////////////////////////////////////////////////////// +////////////////////////////////////////////////////////////////////////////////// +////////////////////////////////////////////////////////////////////////////////// +////////////////////////////////////////////////////////////////////////////////// +////////////////////////////////////////////////////////////////////////////////// +////////////////////////////////////////////////////////////////////////////////// + +/** + * Login with Google Function + * =============================================================================== + * @description This function uses google identity api to login a user with datasquirel + * + * @async + * + * @param {object} params - Single object passed + * @param {string} params.clientId - Google app client ID: {@link https://datasquirel.com/docs} + * @param {HTMLElement} params.element - HTML Element to display google login button + * @param {boolean} params.triggerPrompt - Whether to trigger Google signing popup or not: {@link https://datasquirel.com/docs} + * @param {function(): void} [params.readyStateDispatch] - React setState Function: sets whether the google login button is ready or not + * + * @returns {Promise} - Return + */ +module.exports = async function getAccessToken({ clientId, element, triggerPrompt, readyStateDispatch }) { + /** + * == Initialize + * + * @description Initialize + */ + const googleScript = document.createElement("script"); + googleScript.src = "https://accounts.google.com/gsi/client"; + googleScript.className = "social-script-tag"; + + document.body.appendChild(googleScript); + + const response = await new Promise((resolve, reject) => { + googleScript.onload = function (e) { + if (google) { + if (readyStateDispatch) readyStateDispatch(true); + + //////////////////////////////////////// + //////////////////////////////////////// + //////////////////////////////////////// + + if (element) { + /** + * Handle google credentials response + * ======================================================== + * @param {object} response - Google response with credentials + * @param {string} response.credential - Google access token + */ + function handleCredentialResponse(response) { + resolve(response.credential); + } + + google.accounts.id.initialize({ + client_id: clientId, + callback: handleCredentialResponse, + }); + + google.accounts.id.renderButton(element, { + theme: "outline", + size: "large", + logo_alignment: "center", + }); + } + + //////////////////////////////////////// + //////////////////////////////////////// + //////////////////////////////////////// + + if (triggerPrompt) { + google.accounts.id.prompt( + /** + * Google prompt notification callback + * ======================================================== + * @param {GoogleIdentityPromptNotification} notification - Notification object + */ + (notification) => { + notification.isDisplayed(); + } + ); + } + } + }; + }); + + ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// + ////////////////////////////////////////////////////////////////////////////////// + + return response; +}; diff --git a/client/auth/loginWithGoogle.js b/client/auth/loginWithGoogle.js index 9e5ca86..7ae4f0b 100644 --- a/client/auth/loginWithGoogle.js +++ b/client/auth/loginWithGoogle.js @@ -53,8 +53,6 @@ module.exports = async function loginWithGoogle({ username, database, clientId, document.body.appendChild(googleScript); googleScript.onload = function (e) { - console.log("GOOGLE script loaded!"); - console.log(element); if (google) { if (readyStateDispatch) readyStateDispatch(true); diff --git a/client/index.js b/client/index.js index 9400086..7769c47 100644 --- a/client/index.js +++ b/client/index.js @@ -7,6 +7,7 @@ const imageInputFileToBase64 = require("./media/imageInputFileToBase64"); const imageInputToBase64 = require("./media/imageInputToBase64"); const inputFileToBase64 = require("./media/inputFileToBase64"); const loginWithGoogle = require("./auth/loginWithGoogle"); +const getAccessToken = require("./auth/google/getAccessToken"); /** ****************************************************************************** */ /** ****************************************************************************** */ @@ -32,7 +33,9 @@ const media = { * ============================================================================== */ const auth = { - loginWithGoogle: loginWithGoogle, + google: { + getAccessToken: getAccessToken, + }, }; /** diff --git a/package.json b/package.json index 8aeaa7b..34a7303 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "datasquirel", - "version": "1.1.39", + "version": "1.1.40", "description": "Cloud-based SQL data management tool", "main": "index.js", "scripts": {