I am unable to get userInfo and profile button not working - CLONE RARIBLE IN 24 HORS

you can delete too, it should have same effect, I think that you comment a line in javascript with //

i don’t seem to understand what you said i should do.

I added the comment but its not working

What is the error that you get now?

Same error

main.js:82 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'length')
    at HTMLButtonElement.saveUserInfo (main.js:82)

Check it above I still got same error for undefined

at a first look it looks like userAvatarImg refers to imgAvatar and not to fileAvatar

After i reference ImgAvatar I got this error in my console

moralis.js:26650 Uncaught (in promise) RangeError: Maximum call stack size exceeded

how did you reference ImgAvatar?

I use this const userAvatarImg = document.getElementById("fileAvatar");

So i reference fileAvatar using the const

and you tried to save some avatar image?

That is what i tried to do and i got that error

ok, I don’t know why it doesn’t work, if you don’t try to upload an avatar image then everything else works fine?

This is my screenshot

If i don’t try to upload avatar, everything else works fine

Will you take a look at my code again?

ok, there may be some problems with that code that uploads the avatar

this is your code, right?

i will send a new one now

This is my new code

const serverUrl = "https://mzrhanzmogsu.moralishost.com:2053/server";
const appId = "gFnTLmvgt8ZDUYMXF80FIonsCRqosKxXcfzmO2bM";
Moralis.start({ serverUrl, appId });

async function hide_buttons() {
    let user = await Moralis.User.current();
    if (!user) {
        document.getElementById("btnConnect").style.display = "block";
        document.getElementById("btnUserInfo").style.display = "none";
        document.getElementById("btnLogout").style.display = "none";
        document.getElementById("userInfo").style.display = "none";
    } else {
        document.getElementById("btnUserInfo").style.display = "block";
        document.getElementById("btnConnect").style.display = "none";
        document.getElementById("btnLogout").style.display = "block";
    }
}

hide_buttons();

async function login() {
    let user = Moralis.User.current();
    if (!user) {
        try {
            user = await Moralis.authenticate({
                signingMessage: "Welcome to GrandPaDoge NFT MarketPlace",
            });
        } catch (error) {
            alert(
                (error =
                    "Please consider installing Metamask to connect to MrGrandPaDoge NFT MarketPlace")
            );
        }
    }
    console.log("logged in user:", user);
    hide_buttons();
    const isWeb3Active = Moralis.ensureWeb3IsInstalled();

    if (isWeb3Active) {
        console.log("Activated");
    } else {
        async function enable() {
            await Moralis.enable();
        }
    }
}

async function logOut() {
    await Moralis.User.logOut();
    console.log("logged out");
    hide_buttons();
}

async function openuserInfo() {
    user = await Moralis.User.current();
    hide_buttons();
    if (user) {
        const email = user.get("email");
        if (email) {
            userEmailField.value = email;
        } else {
            userEmailField.value = "";
        }
        userUsernameField.value = user.get("username");
        const userAvatar = user.get("avatar"); //Display user avatar
        if (userAvatar) {
            //user avatar function
            userAvatarImg.src = userAvatar.url(); //avatar source to get the url
            document.getElementById("imgAvatar").style.display = "block"; //display avatar
        } else {
            document.getElementById("imgAvatar").style.display = "none"; //hide avatar when user is connected
        }
        document.getElementById("userInfo").style.display = "block"; //Hide userinfo
    } else {
        login(); //if not,then login
    }
}

async function saveUserInfo() {
    //save user info
    user.set("email", userEmailField.value);
    user.set("username", userUsernameField);

    if (userAvatarImg.files.length > 0) {
        //get user avatar
        const avatar = new Moralis.File("avatar", userAvatarImg.files[0]);
        user.set("avatar", avatar);
    }

    await user.save();
    alert("User info saved successfully!");
    openuserInfo();
}

async function closeuserInfo() {
    user = await Moralis.User.current();
    hide_buttons();
    if (user) {
        document.getElementById("userInfo").style.display = "none";
    } else {
        logOut();
    }
}

document.getElementById("btnConnect").onclick = login;
document.getElementById("btnLogout").onclick = logOut;
document.getElementById("btnUserInfo").onclick = openuserInfo;
document.getElementById("btnCloseUserInfo").onclick = closeuserInfo;
document.getElementById("btnSaveUserInfo").onclick = saveUserInfo;

const userUsernameField = document.getElementById("txtUsername");
const userEmailField = document.getElementById("txtEmail");
const userAvatarImg = document.getElementById("fileAvatar");