How do I update field in my item in realtime database?

Question

I am trying to update one field in my Realtime database node. Currently it is working but I am getting errors after clicking the button even the value in the database changes. Basically changing favorite: true or favorite:false

These are the 2 errors I am receiving when button is pressed.

@firebase/database: FIREBASE WARNING: Exception was thrown by user callback. onValue@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.familyrecipebook&modulesOnly=false&runModule=true:149302:35

TypeError: this.snapshotCallback.call is not a function. (In 'this.snapshotCallback.call(null, expDataSnapshot, previousChildName)', 'this.snapshotCallback.call' is undefined)

This is my current code for updating the value.

const markOrRemoveFavorite = () => {
  const recipeRef = ref(db, 'users/' + userId + '/recepies' + `/${item.id}`)
  // const recipeData = {
  //   favorite: item.favorite ? false : true
  // }

  // const newRecipeKey = push(child(ref(db), 'users/' + userId + '/recepies' + `/${item.id}`)).key

  // const updates = {};
  // updates[newRecipeKey] = recipeData;
  return update(recipeRef, {favorite: item.favorite ? false : true})

}

Answer 1

I solved the issue by following. But text of the button doesnt change still in real time.

    const recipeRef = ref(db, 'users/' + userId + '/recepies' + `/${item.id}`)
     const recipeData = {
       favorite: item.favorite ? false : true
     }

    update(recipeRef, recipeData).then(() => {
      if (item.favorite === false) {
        Toast.show({
          type: 'success',
          position: 'bottom',
          text1: 'Recipe',
          text2: `Recipe ${item.recipe} was added to favorites`,
        })
      } else {
        Toast.show({
          type: 'success',
          position: 'bottom',
          text1: 'Recipe',
          text2: `Recipe ${item.recipe} was removed from favorites`,
        })
      }
    })