signinwith 1.1.1 → 1.1.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/react.jsx +35 -52
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "signinwith",
3
- "version": "1.1.1",
3
+ "version": "1.1.3",
4
4
  "description": "Simple and straightforward library for sign in / sign up with thirdparty oAuth services like Google, Facebook, Apple, Discord...",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/react.jsx CHANGED
@@ -20,8 +20,8 @@ const DiscordIcon = () => (
20
20
  const GithubIcon = () => (
21
21
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
22
22
  <path
23
- fill-rule="evenodd"
24
- clip-rule="evenodd"
23
+ fillRule="evenodd"
24
+ clipRule="evenodd"
25
25
  d="M12 0C5.37 0 0 5.42 0 12.108c0 5.354 3.438 9.892 8.205 11.496.6.115.82-.264.82-.585 0-.288-.01-1.049-.016-2.06-3.338.737-4.042-1.642-4.042-1.642-.547-1.412-1.336-1.788-1.336-1.788-1.09-.758.083-.743.083-.743 1.205.086 1.84 1.255 1.84 1.255 1.07 1.864 2.807 1.326 3.492 1.015.108-.793.42-1.326.763-1.63-2.665-.31-5.466-1.366-5.466-6.075 0-1.342.465-2.44 1.232-3.3-.124-.311-.535-1.565.118-3.263 0 0 1.007-.33 3.3 1.26a11.23 11.23 0 0 1 3.004-.41c1.02.004 2.047.14 3.004.41 2.29-1.59 3.296-1.26 3.296-1.26.655 1.698.244 2.952.12 3.263.77.86 1.23 1.958 1.23 3.3 0 4.724-2.807 5.76-5.48 6.064.43.379.823 1.126.823 2.27 0 1.64-.015 2.96-.015 3.363 0 .324.216.704.826.583C20.565 22 24 17.46 24 12.108 24 5.42 18.627 0 12 0Z"
26
26
  fill="#FFFFFF"
27
27
  />
@@ -68,69 +68,52 @@ export function SignInWithFacebook({ service, onSignin, onError }) {
68
68
 
69
69
  // Subcomponent: Google
70
70
  export function SignInWithGoogle({ service, onSignin, onError }) {
71
+ const codeClientRef = useRef(null);
72
+
71
73
  useEffect(() => {
72
- const scriptId = 'google-gsi-script';
74
+ const scriptId = "google-gsi-script";
73
75
  let script = document.getElementById(scriptId);
74
76
 
77
+ const init = () => {
78
+ if (!window.google?.accounts?.oauth2) {
79
+ onError?.("Google OAuth library not available.");
80
+ return;
81
+ }
82
+
83
+ codeClientRef.current = window.google.accounts.oauth2.initCodeClient({
84
+ client_id: service.clientId,
85
+ scope: "openid email profile",
86
+ ux_mode: "popup",
87
+ callback: (res) => {
88
+ // res.code is the authorization code (send to backend)
89
+ if (!res?.code) return onError?.("No auth code received from Google.");
90
+ onSignin("google", { code: res.code });
91
+ },
92
+ error_callback: (err) => {
93
+ onError?.(err?.message || "Google sign-in failed.");
94
+ }
95
+ });
96
+ };
97
+
75
98
  if (!script) {
76
- script = document.createElement('script');
99
+ script = document.createElement("script");
77
100
  script.id = scriptId;
78
- script.src = 'https://accounts.google.com/gsi/client';
101
+ script.src = "https://accounts.google.com/gsi/client";
79
102
  script.async = true;
80
103
  script.defer = true;
81
- script.onload = () => {
82
- if (window.google?.accounts?.id) {
83
- window.google.accounts.id.initialize({
84
- client_id: service.clientId,
85
- use_fedcm_for_prompt: true,
86
- callback: (res) => {
87
- onSignin('google', { credential: res.credential });
88
- }
89
- });
90
- } else {
91
- onError?.('Google Sign-In script loaded but initialization failed.');
92
- }
93
- };
94
- script.onerror = () => {
95
- onError?.('Failed to load Google Sign-In script.');
96
- };
104
+ script.onload = init;
105
+ script.onerror = () => onError?.("Failed to load Google script.");
97
106
  document.body.appendChild(script);
98
- } else if (window.google?.accounts?.id) {
99
- // If script already exists, ensure it's initialized (might be needed if component remounts)
100
- window.google.accounts.id.initialize({
101
- client_id: service.clientId,
102
- use_fedcm_for_prompt: true,
103
- callback: (res) => {
104
- onSignin('google', { credential: res.credential });
105
- }
106
- });
107
+ } else {
108
+ init();
107
109
  }
108
-
109
-
110
- // Cleanup function does not remove the script to allow multiple instances
111
- // or remounts without reloading. Google's script handles this internally.
112
- return () => {
113
- // Optional: You might want to hide the prompt if the component unmounts
114
- // window.google?.accounts?.id?.cancel();
115
- };
116
110
  }, [service.clientId, onSignin, onError]);
117
111
 
118
112
  const handleGoogleLogin = (e) => {
119
- e.stopPropagation();
120
113
  e.preventDefault();
121
- if (window.google?.accounts?.id) {
122
- window.google.accounts.id.prompt((notification) => {
123
- // Handle prompt UI notifications (e.g., closed, error)
124
- if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
125
- // Potentially trigger a backup UX or just log
126
- onError?.(notification.getNotDisplayedReason() || notification.getSkippedReason() || 'Google Sign-In prompt was not displayed or was skipped.');
127
- } else if (notification.isDismissedMoment()) {
128
- onError?.(notification.getDismissedReason() || 'Google Sign-In prompt was dismissed.');
129
- }
130
- });
131
- } else {
132
- onError?.('Google Sign-In is not initialized.');
133
- }
114
+ e.stopPropagation();
115
+ if (!codeClientRef.current) return onError?.("Google not initialized yet.");
116
+ codeClientRef.current.requestCode();
134
117
  };
135
118
 
136
119
  return (