signinwith 1.1.0 → 1.1.2

package/index.js

@@ -79,7 +79,7 @@ export const verifySigninGithub = async (config, verificationData) => {
 	const apiHeaders = {
 		'Authorization': `Bearer ${accessToken}`,
 		'Accept': 'application/vnd.github+json',
-		'User-Agent': config.userAgent || 'signinwith',
+		'User-Agent': 'signinwith',
 	};
 
 	const profileRes = await fetch('https://api.github.com/user', { headers: apiHeaders });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "signinwith",
-	"version": "1.1.0",
+	"version": "1.1.2",
 	"description": "Simple and straightforward library for sign in / sign up with thirdparty oAuth services like Google, Facebook, Apple, Discord...",
 	"main": "index.js",
 	"scripts": {

package/react.jsx

@@ -68,69 +68,52 @@ export function SignInWithFacebook({ service, onSignin, onError }) {
 
 // Subcomponent: Google
 export function SignInWithGoogle({ service, onSignin, onError }) {
+	const codeClientRef = useRef(null);
+
 	useEffect(() => {
-		const scriptId = 'google-gsi-script';
+		const scriptId = "google-gsi-script";
 		let script = document.getElementById(scriptId);
 
+		const init = () => {
+			if (!window.google?.accounts?.oauth2) {
+				onError?.("Google OAuth library not available.");
+				return;
+			}
+
+			codeClientRef.current = window.google.accounts.oauth2.initCodeClient({
+				client_id: service.clientId,
+				scope: "openid email profile",
+				ux_mode: "popup",
+				callback: (res) => {
+					// res.code is the authorization code (send to backend)
+					if (!res?.code) return onError?.("No auth code received from Google.");
+					onSignin("google", { code: res.code });
+				},
+				error_callback: (err) => {
+					onError?.(err?.message || "Google sign-in failed.");
+				}
+			});
+		};
+
 		if (!script) {
-			script = document.createElement('script');
+			script = document.createElement("script");
 			script.id = scriptId;
-			script.src = 'https://accounts.google.com/gsi/client';
+			script.src = "https://accounts.google.com/gsi/client";
 			script.async = true;
 			script.defer = true;
-			script.onload = () => {
-				if (window.google?.accounts?.id) {
-					window.google.accounts.id.initialize({
-						client_id: service.clientId,
-						use_fedcm_for_prompt: true,
-						callback: (res) => {
-							onSignin('google', { credential: res.credential });
-						}
-					});
-				} else {
-					onError?.('Google Sign-In script loaded but initialization failed.');
-				}
-			};
-			script.onerror = () => {
-				onError?.('Failed to load Google Sign-In script.');
-			};
+			script.onload = init;
+			script.onerror = () => onError?.("Failed to load Google script.");
 			document.body.appendChild(script);
-		} else if (window.google?.accounts?.id) {
-			// If script already exists, ensure it's initialized (might be needed if component remounts)
-			window.google.accounts.id.initialize({
-				client_id: service.clientId,
-				use_fedcm_for_prompt: true,
-				callback: (res) => {
-					onSignin('google', { credential: res.credential });
-				}
-			});
+		} else {
+			init();
 		}
-
-
-		// Cleanup function does not remove the script to allow multiple instances
-		// or remounts without reloading. Google's script handles this internally.
-		return () => {
-			// Optional: You might want to hide the prompt if the component unmounts
-			// window.google?.accounts?.id?.cancel();
-		};
 	}, [service.clientId, onSignin, onError]);
 
 	const handleGoogleLogin = (e) => {
-		e.stopPropagation();
 		e.preventDefault();
-		if (window.google?.accounts?.id) {
-			window.google.accounts.id.prompt((notification) => {
-				// Handle prompt UI notifications (e.g., closed, error)
-				if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
-					// Potentially trigger a backup UX or just log
-					onError?.(notification.getNotDisplayedReason() || notification.getSkippedReason() || 'Google Sign-In prompt was not displayed or was skipped.');
-				} else if (notification.isDismissedMoment()) {
-					onError?.(notification.getDismissedReason() || 'Google Sign-In prompt was dismissed.');
-				}
-			});
-		} else {
-			onError?.('Google Sign-In is not initialized.');
-		}
+		e.stopPropagation();
+		if (!codeClientRef.current) return onError?.("Google not initialized yet.");
+		codeClientRef.current.requestCode();
 	};
 
 	return (

package/readme.md

@@ -125,7 +125,6 @@ const servicesConfig = {
 		clientId: process.env.GITHUB_CLIENT_ID,
 		clientSecret: process.env.GITHUB_CLIENT_SECRET,
 		redirectUri: process.env.GITHUB_REDIRECT_URI,
-		userAgent: 'your-app-name',
 	},
 };
 
@@ -180,6 +179,7 @@ The buttons have the base class `signinwith-button` and provider-specific classe
 *   `signinwith-button-facebook`
 *   `signinwith-button-apple`
 *   `signinwith-button-discord`
+*   `signinwith-button-github`
 
 You can override these styles in your own CSS. The container in the example uses `signinwith-container` for layout.