How to hide a menu bar when the user loggs in?

Hello everyone, I’m new at wix coding and I was trying to find a way to hide the menu when the user loggs in the website. The idea is that, when the user is logged in I would show another information that only users are allowed to see with 3 pages inside.

My code is:

//code to hide or show menu when logged in or out.
//imports wix user database
import wixUsers from ‘wix-users’;
//let user = wixUsers.currentUser;

wixUsers.onLogin((user) => {

let userId = user.id; // “r5cme-6fem-485j-djre-4844c49”
let isLoggedIn = user.loggedIn; // true
let userRole = user.role; // “Member”
$w(‘horizontalMenu1’).colapse();
});

Does everyone knows how to do that?

Cheers,

Marco Arruda

Have you tried something like the below on you onReady function

if ( user.role === Member ) {
     $w("#menuId").collapse();
  }

Hi,
You can try the following code

$w.onReady(() => {
  let user = wixUsers.currentUser;
  let isLoggedIn = user.loggedIn; // true 
  let userRole = user.role; 
  
  if (userRole === "Member" && isLoggedIn){
     $w("#menuId").collapse();
  }
}

Checkout the documentation here.

Best,
Tal.

Hi,
You can try the following code

//add a module named secureModule.jsw in backend part
// In backend file: secureModule.jsw

import wixUsers from ‘wix-users-backend’;

export function secureCheck() {
let currentUser = wixUsers.currentUser;
return currentUser.getEmail()
.then( (userEmail) => {
// here you test use email but you can test other element like role, name etc.
if(userEmail === “useremail@provider.com”) {
return “allowed”;
}
return “not-allowed”
} )
.catch((err) => {
return err;
} );
}

//in your page code
import {secureCheck} from ‘backend/secureModule’;

$w.onReady(function () {
//when page is loaded call HideMenuBar function
HideMenuBar();
});

export function HideMenuBar() {
return secureCheck()
.then( (message) => {
if (message === “allowed”) {
$w(‘#menuBar’).expand();
}
else {
$w(‘#menuBar’).collapse();
}
} );
}

wixUsers.onLogin( (user) => {
return secureCheck()
.then( (message) => {
if (message === “allowed”) {
$w(‘#menuBar’).expand();
}
else {
$w(‘#menuBar’).collapse();
}
} );
} );

Regards

@shantanukumar847 and everyone

I am trying to achieve a button menu collapse when a matching member’s role & members login matched.

I’ve tried this code and still doesnt work.

Please help.

    **let**  user  = . currentUser ; 
**let**  isLoggedIn  =  user . loggedIn ;  // true 
**let**  userRole  =  user . role ; 

**if**  ( user . role  ===  "Member"  && 

isLoggedIn ){
$w ( ‘#ButtonGlobalre’ ). collapse ();
$w ( ‘#ButtonFornasier’ ). collapse ();
}

let user = .currentUser;

What is this?

It should be:

import wixUsers from 'wix-users'; //Top of the page

let user = wixUsers.currentUser; //Under an event or page's onReady function

Place this code under the page’s onReady function or under an event, do not copy it anywhere in the code panel

& btw you should consider using the new wix member api instead wix-members-frontend - Velo API Reference - Wix.com