I’m rather new to using code, and I’ve managed fine so far except for today. I cannot seem to get my buttons working properly, despite spending close to 4 hours on google.
Could someone PLEASE help me?
I have ‘signup’, ‘login’ and ‘logout’ buttons. All I want is for the signup and login buttons to be hidden, and the logout button visible if a user is logged in - and vice-versa if they’re logged out.
The problem I’m having is that the logout button refuses to work - nothing happens when I click it. I just want a user to be fully logged out, and redirected to homepage. The code I’ve got is below, if someone can tell me what I’ve done wrong so I don’t do it again, I’ll be forever grateful.
Thanks in advance
import wixUsers from 'wix-users';
$w.onReady(async function(){
let user = wixUsers.currentUser; console.log("Wix-User-Data: ", user)
let userId = user.id; console.log("User-ID: ", userId)
let isLoggedIn = user.loggedIn;
if(isLoggedIn) {console.log("User already logged in!")
$w("#login").hide('fade'), $w("#logout").show('fade'), $w("#signup").hide('fade');
}
else{console.log("User not logged in!")
$w("#login").show('fade'), $w("#signup").show('fade'), $w("#logout").hide;}
$w('#logout').onClick(logoutAndRedirect);
});
function logoutAndRedirect(event) {Promise.all([wixLocation.to('/home'), wixUsers.logout()]);
}
Hey there! wix-users is deprecated, therefore I suggest you use wix-members instead.
Try this code and let me know if this works for you:
import { authentication } from 'wix-members-frontend';
import wixLocationFrontend from 'wix-location-frontend';
$w.onReady(function () {
const isLoggedIn = authentication.loggedIn();
if (isLoggedIn) {
// WHEN USER IS LOGGED IN
$w('#login').hide();
$w('#signup').hide();
$w('#logout').show();
} else {
// WHEN USER IS NOT LOGGED IN
$w('#logout').hide();
$w('#login').show();
$w('#signup').show();
}
$w('#logout').onClick(() => {
//WHEN LOGOUT BUTTON IS CLICKED
authentication.logout();
});
authentication.onLogout(() => {
//WHEN USER IS LOGGED OUT SUCCESSFULLY
wixLocationFrontend.to("/home");
});
});
Thanks so much - the logout button is now hidden, but when I log in, the login and sign up buttons remain - and the logout button is still hidden so I can’t log out to test it. I’ll try clearing history and checking again.
The sign up and login buttons have their own pages with forms on. Clicking the button for login takes you to login page, and once logged in I’m sent to the members page (which is correct)
About your code - There’s no need to get the current user email or user id (that is unless you specifically want to log it for your record) and you don’t need a special, dedicated function for logout and redirect. Also you had not imported wixLocation without which you won’t be able to redirect to another URL.
But hey - still a good job for a newbie! I love how you tried it yourself and almost got it working. That’s how I started out with coding too!
And remember if you ever get stuck - the community is here to help you (:
I think I made it more complicated than it needed to be! I might need to collect emails and names on signup for mailing list purposes, but that can probably wait now the important bit is done - my brain is about to burst!
Thank you so much - I’m sure I’ll be back for more questions at some point!
Sorry - should have clarified a little there! When a user clicks on"forum" without logging in or signing up the generic one appears. I’m trying to figure it out on my test site but can’t seem to do it.