How do I connect my login page to my Dynamic profile page?


Does anybody have an idea on how to get my custom login page to redirect to a user’s dynamic profile? I tried using the custom member login profile code but it shows an error in “.then” . I used the code example from totallycodable’s page here;

import wixUsers from ‘wix-users’; import wixWindow from ‘wix-window’; $w.onReady( function () { $w(“#forgotPassword”).onClick( (event) => { //This is only if you have the Forgot Password button //wixWindow.lightbox.close() wixUsers.promptForgotPassword() .then( ( ) => { // } ) .catch( (err) => { let errorMsg = err; //“The user closed the forgot password dialog” }); }); $w(“#registerButton”).onClick( (event) => { let email = $w(“#email”).value; let password = $w(“#password”).value; let first = $w(“#firstName”).value; let last = $w(“#lastName”).value; wixUsers.register(email, password, { contactInfo: { “firstName”: first, “lastName”: last } } ) .then( (result) => { let resultStatus = result.status; wixWindow.lightbox.close(); wixWindow.openLightbox(“login”); } ); } ); });

Please format your code first in a nicely code-format, like it should be and put it into a CODE-BLOCK.

Sorry!! here is the tottalycodable code again;

import wixUsers from ‘wix-users’;
import wixWindow from ‘wix-window’;

$w.onReady(function () {

$w("#forgotPassword").onClick( (event) => { //This is only if you have the Forgot Password button  
//wixWindow.lightbox.close() 

wixUsers.promptForgotPassword()
.then( ( ) => {
//
} )
.catch( (err) => {
let errorMsg = err; //“The user closed the forgot password dialog”
});
});

$w("#registerButton").onClick( (event) => { 

let email = $w(“#email”).value;
let password = $w(“#password”).value;
let first = $w(“#firstName”).value;
let last = $w(“#lastName”).value;

wixUsers.register(email, password, {
contactInfo: {
“firstName”: first,
“lastName”: last
}
} )
.then( (result) => {
let resultStatus = result.status;
wixWindow.lightbox.close();
wixWindow.openLightbox(“login”);
} );
} );

});

and if you can’t help me to direct my users through their dynamic profile page that way, then here’s is the code that I am struggling with;

import wixUsers from ‘wix-users’ ;
import wixData from ‘wix-data’ ;
import wixLocation from ‘wix-location’ ;

$w . onReady ( () => {
if ( wixUsers . currentUser . loggedIn ) {
$w ( “#loginButton” ). label = “Logout” ;
$w ( “#profileButton” ). show ();
}
else {
$w ( “#loginButton” ). label = “Login” ;
$w ( “#profileButton” ). hide ();
}
} );

export function loginButton_click_1 ( event ) { //Make sure that onclick event is on in properties
// user is logged in
if ( wixUsers . currentUser . loggedIn ) {
// log the user out
wixUsers . logout ()
. then ( () => {
// update buttons accordingly
$w ( “#loginButton” ). label = “Login” ;
$w ( “#profileButton” ). hide ();
} );
}
// user is logged out
else {
let userId ;
let userEmail ;

// prompt the user to log in
wixUsers . promptLogin ( { “mode” : “login” } )
. then ( ( user ) => {
userId = user . id ;
return user . getEmail ();
} )
. then ( ( email ) => {
// check if there is an item for the user in the collection
userEmail = email ;
return wixData . query ( “Profile” ) // Your own dataset name here
. eq ( “_id” , userId )
. find ();
} )
. then ( ( results ) => {
// if an item for the user is not found
if ( results . items . length === 0 ) {
// create an item
const toInsert = {
“_id” : userId ,
“email” : userEmail
};
// add the item to the collection
wixData . insert ( “Profile” , toInsert ) // Your own dataset name here
. catch ( ( err ) => {
console . log ( err );
} );
}
// update buttons accordingly
$w ( “#loginButton” ). label = “Logout” ;
$w ( “#profileButton” ). show ();
} )
. catch ( ( err ) => {
console . log ( err );
} );
}
}
export function profileButton_click_1 ( event ) { //Make sure that onclick event is on in properties
wixLocation . to ( /profile/{ID} ${ wixUsers . currentUser . id }); // Your o
}

there’s an error showing in “.then” and when I went to go tested it out on my published site, the login button works fine, however the MY PROFILE button only shows up when I refresh the page, and when I click on it, it redirects me to an error page and NOT my dynamic profile page. I don’t know if I am doing anything wrong, but the profile update dynamic page isn’t working neither. I tried just putting “/profile” as well but it still shows up as an error page.

@rayshrink

Try this one…

import wixUsers from 'wix-users';
import wixData from 'wix-data';
import wixLocation from 'wix-location';

var user, userID, userMail, isLoggedIn;

$w.onReady(async() => {
    console.log("----------");
    user = wixUsers.currentUser;        console.log(wixUsers)
    userID = user.id;                   console.log(userID);
    isLoggedIn = user.loggedIn;         console.log(isLoggedIn);
    userMail = await user.getEmail();   console.log(userMail);
    console.log("----------");

    if(isLoggedIn) {
        $w("#loginButton").label = "Logout";
        $w("#profileButton").show();
    } else {
        $w("#loginButton").label = "Login";
        $w("#profileButton").hide();
    }
    
    $w('#profileButton').onClick(()=>{wixLocation.to(`/profile/{ID}${wixUsers.currentUser.id}`);});

    $w('#loginButton').onClick(()=>{
        if(isLoggedIn) {LOGOUT();}
        else {LOGIN();}       
    }); 

    wixUsers.onLogin((user) => {
        userID = user.id;
        isLoggedIn = user.loggedIn;
        checkProfile(userID, userMail);
    });   
});

function LOGOUT() {console.log("Log-Out running...."); wixUsers.logout();}

function LOGIN() {console.log("LOGIN running...")
    let email = $w("#email").value;
    let password = $w("#password").value;
    wixUsers.login(email, password)
    .then(()=> {console.log("User is logged in");})
    .catch((err)=> {console.log(err);});
}


function checkProfile(ID, Mail) {
    wixData.query("Profile")
    .eq("_id", ID)
    .find()
    .then((results)=> {console.log(results);
        if (results.items.length === 0) {
            const toInsert = {
                "_id": ID,
                "email": Mail
            };
            wixData.insert("Profile", toInsert)
            .catch((err)=> {console.log(err);});
        }
    })
    .catch((err)=> {console.log(err);});
}