Redirect based on members roles

Hello I have a login page that has 2 conditions:
1- if user is logged in: Show/Hide elements + Redirect to —> Page
2- if user is not logged in: Email/Password Fields: Login button —> Page

Ive been trying to add another line to perform these functions based on roles
e.g: if Role A “Staff” —> Redirect to Page A
if Role B “Client” ----> Redirect to Page B

import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
 
$w.onReady(function () {    
    if (wixUsers.currentUser.loggedIn) {
      $w("#loginNow").label = "Logging in";
      $w("#loginUsername").hide();
      $w("#loginPassword").hide();
  
      // Redirect the user to the dashboard
      wixLocation.to('/account/Dashboard/');
    }
})

export function loginNow_click(event) {   
    let email = $w('#loginUsername').value;    
    let password = $w('#loginPassword').value;  
    wixUsers.login(email,password)  
    .then(()=>{
        wixLocation.to('/account/Dashboard/');   
    })
    .catch( (err) => {
        console.log(err);
        $w("#errorMessage").show();
    });
}

Any help, Thanks

//the imports....
function getRoleAndRedirect(){
return wixUsers.currentUser.getRoles()
.then(roles => {
if(roles.some(role => role.name === 'Staff')){
return wixLocation.to('/page-a');
}
if(roles.some(role => role.name === 'Client')){
return wixLocation.to('/page-b');
}
//if other roles or no role:
return wixLocation.to('/page-c');
})
}

function loginUser(){
wixUsers.propmptLogin()
.then(user => {
getRoleAndRedirect();
}).catch(loginUser)
}
}

$w.onReady(function () {    
    if (wixUsers.currentUser.loggedIn) {
     //the hide-show as you wish +
	getRoleAndRedirect();
} else {
//force log-in
loginUser();
})

Welcome back J.D. → where have you been so long? :smile:

Thanks.
Vacation + I’m working right now on a big project that can’t be done with Velo (lots of drag&drops + canvas drawing) so my mind is somewhere else :slight_smile:

@jonatandor35
Uderstand! I wish you success!:wink:

Thank you so much JD

@j.d. thanks for the code; however, when I am using this any visitor is forced to my login page and can’t explore any of the website that is non-member. Any thoughts on troubleshooting this?

What about just SHUT one function OFF ???

//-------------- USER-INTERFACE -----------------
let roles = [];
    roles[0] = 'Staff';
    roles[1] = 'Client';
    //roles[2] = 'ADMIN';
    //roles[3] = 'USER';
    //roles[4] = 'SUPPORT';
//-------------- USER-INTERFACE -----------------

$w.onReady(function() {  
    let loggedIn = wixUsers.currentUser.loggedIn  
    if (loggedIn) {getRoleAndRedirect();} 
    else {loginUser();} //--> force log-in
});

//the imports....
function getRoleAndRedirect(){
    return wixUsers.currentUser
    .getRoles()
    .then(roles => {
        if(roles.some(role => role.name === roles[0])){
            return wixLocation.to('/page-a');
        }
        if(roles.some(role => role.name === roles[1])){
            return wixLocation.to('/page-b');
        }
        //if other roles or no role:
        //return wixLocation.to('/page-c');
    });
}

function loginUser(){
    wixUsers.propmptLogin()
    .then((user)=> {getRoleAndRedirect();})
    .catch((loginUser)=>{});
}

BTW, it’s the same code written by J.D. (but a little bit modified).