How to display name of user who is already logged in?

Question

When registered, user is required to fill full name, email, and password. But when login user only needs to input email and password. I want to greet user but only "undefined" shown on the webpage.

I still cannot add key of full name to LocalStorage, I dont know how or whats wrong with my codes:

function authentication() {
    if (localStorage.getItem("access_token")) {
        $("#login-page").hide()
        $("#register-page").hide()
        $("#add-todo-page").hide()
        $('#welcome-name').text(localStorage.full_name);
        // $("#navbar").show()
        $("#home-page").show()
        // $("#todo-list").show()
        homePage()
    } else {
        loginPage()
        // console.log("gak ada akses token")
    }
}

function login() {
    // console.log("masuk login")
    let email = $("#login-email").val()
    let password = $("#login-password").val()
    $.ajax({
        url: `${baseUrl}/users/login`,
        method: "POST",
        data: {
            email,
            password
        }
    })
        .done((response) => {
            // console.log("masuk res login")
            localStorage.setItem("access_token", response.access_token)
            localStorage.setItem("full_name", response.full_name)
            authentication()

        })
        .fail((xhr, text) => {
            swal("Try again!", xhr.responseJSON.error, "error")
            console.log(xhr.responseJSON.error)
        })
        .always(_ => {
            $("#login-form").trigger("reset")
        })
}

is it possible to show user's full name even though user doesn't log in with user name (only with email and password)?

Answer 1

change localStorage.full_name to localStorage.getItem('full_name')