This commit is contained in:
Benjamin Toby
2024-12-08 09:58:57 +01:00
parent 8a8257d17e
commit 7bd4b2fe65
76 changed files with 1783 additions and 1106 deletions
+18 -6
View File
@@ -1,7 +1,19 @@
declare function _exports({ clientId, element, triggerPrompt, readyStateDispatch, }: {
clientId: string;
element: HTMLElement;
triggerPrompt: boolean;
readyStateDispatch?: () => void;
}): Promise<boolean>;
declare namespace _exports {
export { GoogleGetAccessTokenFunctionParams };
}
declare function _exports(params: GoogleGetAccessTokenFunctionParams): Promise<boolean>;
export = _exports;
type GoogleGetAccessTokenFunctionParams = {
/**
* - Google app client ID: {@link https://datasquirel.com/docs}
*/
clientId: string;
/**
* - Whether to trigger Google signing popup or not: {@link https://datasquirel.com/docs}
*/
triggerPrompt?: boolean;
/**
* - React setState Function: sets whether the google login button is ready or not
*/
setLoading?: React.Dispatch<React.SetStateAction<boolean>>;
};
+69 -79
View File
@@ -1,9 +1,15 @@
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
// @ts-check
/**
* @typedef {object} GoogleGetAccessTokenFunctionParams
* @property {string} clientId - Google app client ID: {@link https://datasquirel.com/docs}
* @property {boolean} [triggerPrompt] - Whether to trigger Google signing popup or not: {@link https://datasquirel.com/docs}
* @property {React.Dispatch<React.SetStateAction<boolean>>} [setLoading] - React setState Function: sets whether the google login button is ready or not
*
*/
/** @type {any} */
let interval;
/**
* Login with Google Function
@@ -12,89 +18,73 @@
*
* @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
* @requires script "https://accounts.google.com/gsi/client" async script added to head
*
* @param {GoogleGetAccessTokenFunctionParams} params - Single object passed
* @returns {Promise<boolean>} - 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";
module.exports = async function getAccessToken(params) {
/** @type {any} */
document.body.appendChild(googleScript);
params.setLoading?.(true);
const response = await new Promise((resolve, reject) => {
googleScript.onload = function (e) {
interval = setInterval(() => {
// @ts-ignore
let google = window.google;
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 {import("../../../types/user.td").GoogleIdentityPromptNotification} notification - Notification object
*/
(notification) => {
notification.isDisplayed();
}
);
}
window.clearInterval(interval);
resolve(googleLogin({ ...params, google }));
}
};
}, 500);
});
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
params.setLoading?.(false);
return response;
};
/**
* # Google Login Function
*
* @param {GoogleGetAccessTokenFunctionParams & { google: any }} params
* @returns
*/
function googleLogin({ google, clientId, setLoading, triggerPrompt }) {
setTimeout(() => {
setLoading?.(false);
}, 3000);
return new Promise((resolve, reject) => {
/**
* # Callback Function
* @param {import("../../../package-shared/types").GoogleAccessTokenObject} response
*/
function handleCredentialResponse(response) {
resolve(response.access_token);
}
const googleAuth = google.accounts.oauth2.initTokenClient({
client_id: clientId,
scope: "email profile",
callback: handleCredentialResponse,
});
googleAuth.requestAccessToken();
if (triggerPrompt) {
google.accounts.id.prompt(triggerGooglePromptCallback);
}
/**
* Google prompt notification callback
* ========================================================
* @param {import("../../../package-shared/types").GoogleIdentityPromptNotification} notification
*/
function triggerGooglePromptCallback(notification) {
console.log(notification);
}
});
}