From f27d308cb12f7fce946328fefe5e7728c24a2c86 Mon Sep 17 00:00:00 2001 From: Artem Demchenkov Date: Sat, 19 Oct 2024 23:10:00 +0200 Subject: [PATCH] Google auth buttons only if configured --- backend/users/api/IsExternalAuthAvailable.go | 16 +++++++ backend/users/services/server/server.go | 1 + ui/src/components/login.component.js | 37 ++++++++++++--- ui/src/components/register.component.js | 47 +++++++++++++++----- ui/src/services/auth.service.js | 10 +++++ 5 files changed, 92 insertions(+), 19 deletions(-) create mode 100644 backend/users/api/IsExternalAuthAvailable.go diff --git a/backend/users/api/IsExternalAuthAvailable.go b/backend/users/api/IsExternalAuthAvailable.go new file mode 100644 index 0000000..8727ff1 --- /dev/null +++ b/backend/users/api/IsExternalAuthAvailable.go @@ -0,0 +1,16 @@ +package api + +import ( + "net/http" + "ylem_users/config" +) + +func IsExternalAuthAvailable(w http.ResponseWriter, r *http.Request) { + w.Header().Set("Content-Type", "application/json") + + if config.Cfg().Google.ClientId != "" { + w.WriteHeader(http.StatusOK) + } else { + w.WriteHeader(http.StatusNotFound) + } +} diff --git a/backend/users/services/server/server.go b/backend/users/services/server/server.go index 28e9e69..884bfc6 100644 --- a/backend/users/services/server/server.go +++ b/backend/users/services/server/server.go @@ -43,6 +43,7 @@ func (s *Server) Run(ctx context.Context) error { rtr.Handle("/email/{key}/confirm", http.HandlerFunc(api.ConfirmEmail)).Methods(http.MethodPost) rtr.Handle("/auth/{provider}", http.HandlerFunc(api.ExternalAuth)).Methods(http.MethodGet) + rtr.Handle("/auth/{provider}/available", http.HandlerFunc(api.IsExternalAuthAvailable)).Methods(http.MethodGet) rtr.Handle("/auth/{provider}/callback", authMiddleware.IsNotAuthCheck(http.HandlerFunc(authMiddleware.ExternalAuthCallback))).Methods(http.MethodPost) // The following endpoints are for the internal use only and should be diff --git a/ui/src/components/login.component.js b/ui/src/components/login.component.js index 2454eda..929e36e 100644 --- a/ui/src/components/login.component.js +++ b/ui/src/components/login.component.js @@ -30,17 +30,21 @@ class Login extends Component { this.onChangeEmail = this.onChangeEmail.bind(this); this.onChangePassword = this.onChangePassword.bind(this); this.handleSignInWithGoogle = this.handleSignInWithGoogle.bind(this); + this.handleGetSignInWithGoogleAvailability = this.handleGetSignInWithGoogleAvailability.bind(this); this.state = { email: "", password: "", loading: false, + isGoogleAuthAvailable: null, isDarkThemeEnabled: localStorage.getItem('darkTheme') !== "false", }; } componentDidMount() { - document.title = 'Login' + document.title = 'Login'; + + this.handleGetSignInWithGoogleAvailability(); }; onChangeEmail(e) { @@ -96,10 +100,26 @@ class Login extends Component { }); } + handleGetSignInWithGoogleAvailability() { + let isAvailable = AuthService.getSignInWithGoogleAvailability() + + Promise.resolve(isAvailable) + .then(isAvailable => { + this.setState({ + isGoogleAuthAvailable: true, + }); + }) + .catch(() => { + this.setState({ + isGoogleAuthAvailable: false, + }); + }); + } + render() { const { isLoggedIn, user, message } = this.props; - const { isDarkThemeEnabled } = this.state; + const { isDarkThemeEnabled, isGoogleAuthAvailable } = this.state; if (!validatePermissions(isLoggedIn, user, PERMISSION_LOGGED_OUT)) { return @@ -177,11 +197,14 @@ class Login extends Component { - + { isGoogleAuthAvailable === true + && + + } {message && ( diff --git a/ui/src/components/register.component.js b/ui/src/components/register.component.js index dc29160..0ccded1 100644 --- a/ui/src/components/register.component.js +++ b/ui/src/components/register.component.js @@ -45,6 +45,7 @@ class Register extends Component { this.onChangeConfirmPassword = this.onChangeConfirmPassword.bind(this); this.onChangeTermsAndConditions = this.onChangeTermsAndConditions.bind(this); this.onChangeNewsAndUpdates = this.onChangeNewsAndUpdates.bind(this); + this.handleGetSignInWithGoogleAvailability = this.handleGetSignInWithGoogleAvailability.bind(this); this.state = { firstName: "", @@ -59,12 +60,15 @@ class Register extends Component { newsAndUpdates: false, successful: false, loading: false, + isGoogleAuthAvailable: null, isDarkThemeEnabled: localStorage.getItem('darkTheme') !== "false", }; } componentDidMount() { document.title = 'Registration' + + this.handleGetSignInWithGoogleAvailability(); }; onChangeFirstName(e) { @@ -123,6 +127,22 @@ class Register extends Component { confirmPasswordType: confirmPasswordType === 'text' ? 'password' : 'text' })); + handleGetSignInWithGoogleAvailability() { + let isAvailable = AuthService.getSignInWithGoogleAvailability() + + Promise.resolve(isAvailable) + .then(isAvailable => { + this.setState({ + isGoogleAuthAvailable: true, + }); + }) + .catch(() => { + this.setState({ + isGoogleAuthAvailable: false, + }); + }); + } + handleRegister = async(e) => { e.preventDefault(); @@ -196,7 +216,7 @@ class Register extends Component { render() { const { isLoggedIn, message, user } = this.props; - const { isDarkThemeEnabled } = this.state; + const { isDarkThemeEnabled, isGoogleAuthAvailable } = this.state; if ( !validatePermissions(isLoggedIn, user, PERMISSION_LOGGED_OUT) @@ -224,18 +244,21 @@ class Register extends Component { -
- - -
-
-
OR
-
+ { isGoogleAuthAvailable + && +
+ + +
+
+
OR
+
+
-
+ }
{ diff --git a/ui/src/services/auth.service.js b/ui/src/services/auth.service.js index e488cf7..9c6ffe3 100644 --- a/ui/src/services/auth.service.js +++ b/ui/src/services/auth.service.js @@ -91,6 +91,16 @@ class AuthService { ); } + getSignInWithGoogleAvailability = async() => { + return axios + .get( + API_URL + 'auth/google/available', + { + withCredentials: true + } + ); + } + signInWithGoogle = async(queryString) => { return axios .post(