firstName - wixData.query("Members/PrivateMembersData") - or something else?

When I try to get the firstName with a function on the site page when logged in it returns null “undefined”. It there a cheap and sleazy way to present get the logged in user’s first name so I can put it on the label of my custom login/logout button?

site code

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

function getfirstName() {
 let firstName = ''
  wixData.query("Members/PrivateMembersData") 
    .eq("_id", wixUsers.currentUser.id) 
    .find() 
    .then( (results) => {   
      firstName = results.items[0].firstName; 
    } );
 return firstName; 
  }

If the user is already logged on when they visit the page you can simply have a text box element which is linked to the first name of the Wix Members app collection.

As the user will already be logged in that text box will only show the specific users data and so should just display their first name.

If you want to do it through code like you have tried above with the example from Wix Users API.
https://www.wix.com/corvid/reference/wix-users.html

How can I get the current user’s name?
Use the currentUser property to get the current user’s id. Then query the Members/PrivateMembersData collection for the item with that _id.

wixData.query("Members/PrivateMembersData") \
  .eq("_id", wixUsers.currentUser.id) \
  .find() \
  .then( (results) => { \
    lastName = results.items[0].lastName; \
  } );

Then simply add it to your pages onReady function if they are already logged in when the page loads.

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

$w.onReady(function () {
let user = wixUsers.currentUser;
let userId = user.id;
let isLoggedIn = user.loggedIn;

wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#firstName').text = results.items[0].firstName;
});
});

Or use onLogin() to do it when they have logged in, although this might need the page to be refreshed for this to work.
https://www.wix.com/corvid/reference/wix-users.html#onLogin

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

$w.onReady(function () {
});

wixUsers.onLogin( (user) => {
let userId = user.id; 
let isLoggedIn = user.loggedIn;

wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#firstName').text = results.items[0].firstName;
});
});

Hey GOS,

I think that I have already done as you have suggested.

What I am saying is that after Login the function getfirstName is returning “undefined” not quite sure why. (note that I have this on site code NOT page code. I need to be able to leverage login/on ready from any page.

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

function getfirstName() {
  wixData.query("Members/PrivateMembersData") 
    .eq("_id", wixUsers.currentUser.id) 
    .find() 
    .then( (results) => {   
      return results.items[0].firstName; 
    } );
  }

$w.onReady(function () {
 if (wixUsers.currentUser.loggedIn) {
    $w('#loginButton').label = `Logout ${getfirstName()}`;
    // results in "Logout undefined" on the button label.
  } else {
    $w('#loginButton').label =  `Partner Signon`;
  }
});

wixUsers.onLogin(() => {
   $w('#PartnerSharebtn').show();
   // results in "Logout undefined" on the button label.
  $w('#loginButton').label = `Logout ${getfirstName()}`;
});


export function loginButton_click(event) {
 if ( $w('#loginButton').label === "Partner Signon" ) { 
    wixWindow.openLightbox("SignonLightbox");
  } else {
    wixUsers.logout();
    wixLocation.to("/");
  }
}

Funny that as I did think about if you used it as a button label, however I didn’t add the code for it in the end in the original reply.

To do it as a button label you have to work it differently, so it should be something like these below.

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

let user = wixUsers.currentUser;
let userId = user.id;
let isLoggedIn = user.loggedIn;

$w.onReady(function () {
});

if (isLoggedIn) {
wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#loginButton').label = "Logout " + results.items[0].firstName;
$w('#PartnerSharebtn').show();
});
} else {
$w('#loginButton').label = "Partner Signon";
$w('#PartnerSharebtn').hide();
}

export function loginButton_click(event) {
if ($w('#loginButton').label === "Partner Signon") {
wixWindow.openLightbox("SignonLightbox");
} else {
wixUsers.logout();
wixLocation.to("/");
}
}

wixUsers.onLogin(() => {
wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#loginButton').label = "Logout " + results.items[0].firstName;
$w('#PartnerSharebtn').show();
});
});
import wixUsers from 'wix-users';
import wixWindow from 'wix-window';
import wixData from 'wix-data';
import wixLocation from 'wix-location';

let user = wixUsers.currentUser;
let userId = user.id;

$w.onReady(function () {
if (wixUsers.currentUser.loggedIn) {
wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#loginButton').label = "Logout " + results.items[0].firstName;
$w('#PartnerSharebtn').show();
});
} else {
$w('#loginButton').label = "Partner Signon";
$w('#PartnerSharebtn').hide();
}
});

export function loginButton_click(event) {
if ($w('#loginButton').label === "Partner Signon") {
wixWindow.openLightbox("SignonLightbox");
} else {
wixUsers.logout();
wixLocation.to("/");
}
}

wixUsers.onLogin(() => {
wixData.query("Members/PrivateMembersData")
.eq("_id", wixUsers.currentUser.id)
.find()
.then((results) => {
$w('#loginButton').label = "Logout " + results.items[0].firstName;
$w('#PartnerSharebtn').show();
});
});