Updating Moralis Database with new column

I’m having issues updating my database when saving edit. I am trying to retrieve Github data via API and with that data, add it to the Moralis database. Code is as follows:

export const Dashboard = () => {
  const [userSearch, setUserSearch] = useState<string>("");
  const [foundUser, setFoundUser] = useState<IGitHubUser>();

  const performSearchRequest = async () => {
    try {
      const response = await axios.get<IGitHubUser>(
        `https://api.github.com/users/${userSearch}`
      );
      setFoundUser(response.data);
    } catch (error) {
      console.log(error);
    }
  };

  const searchForUser = (event: FormEvent<HTMLFormElement>) => {
    event.preventDefault();
    performSearchRequest();
  };

  const { Moralis, isInitialized } = useMoralis();

  const user = isInitialized ? Moralis.User.current() : undefined;

  const saveEdits = async () => {
    const User = Moralis.Object.extend("_User");
    const query = new Moralis.Query(User);
    const myDetails = await query.first();

    if (foundUser) {
      myDetails?.set("github", foundUser.name);
      console.log("details saved");
    }

    try {
      await myDetails?.save();
    } catch (err) {
      console.log(err);
    }
    window.location.reload();
  };

  return (
    <>
      <h2>Search for a user</h2>
      <form className="search-user" onSubmit={searchForUser}>
        <input
          value={userSearch}
          onChange={(e) => setUserSearch(e.target.value)}
          placeholder="Enter a username..."
        />
        <button>Search</button>
      </form>
      <button onClick={saveEdits}>Search</button>
    </>
  );
};

Here’s a little fix to the code. Make sure the user saving the data is an authenticated user

export const Dashboard = () => {
  const { user } = useMoralis();
  const [userSearch, setUserSearch] = useState<string>("");
  const [foundUser, setFoundUser] = useState<IGitHubUser>();

  const performSearchRequest = async () => {
    try {
      const response = await axios.get<IGitHubUser>(
        `https://api.github.com/users/${userSearch}`
      );
      setFoundUser(response.data);
    } catch (error) {
      console.log(error);
    }
  };

  const searchForUser = (event: FormEvent<HTMLFormElement>) => {
    event.preventDefault();
    performSearchRequest();
  };

  const saveEdits = async () => {
    if (foundUser) {
      user?.set("github", foundUser.name);
      console.log("details saved");
    }

    try {
      await user?.save();
    } catch (err) {
      console.log(err);
    }
    window.location.reload();
  };

  return (
    <>
      <h2>Search for a user</h2>
      <form className="search-user" onSubmit={searchForUser}>
        <input
          value={userSearch}
          onChange={(e) => setUserSearch(e.target.value)}
          placeholder="Enter a username..."
        />
        <button>Search</button>
      </form>
      <button onClick={saveEdits}>Search</button>
    </>
  );
};

Hi thanks for the reply. How will this save the changes to the database if you remove the const User?

It gets the user from the useMoralis hook. Since it’s done in react, Just refactored the code to be done in react way. The user object is handled behind the scene with the hook

No sadly that didn’t work. I think I need const User as that should create a new column for the user in the database and I believe mydetails.set should set what I set the name to be, this case github to the information pulled from the GitHub API.

Hope you’re using an authenticated account ?
And did console.log("details saved"); logged anything ?

Yes the console log loads as it should and my it is only possible to view that page if the user is authenticated else they’ll be sent to the sign in page.

You can try refresh the db to be sure if the data is added or not since the message was logged. You can also check the attributes of the user to see if the data is added

Tried both of these, no luck unfortunately :frowning:

Try add console.log(user) in the saveEdits to see what you got