Home > front end >  React/Firebase. Why I can't update data in my Firestore Database?
React/Firebase. Why I can't update data in my Firestore Database?

Time:08-02

Why I can't update my data? I created a function, but when I want to change the data in my Firestore Database, when I click on the button, the following error occurs in the console FirebaseError: No document to update: projects/star-one-web-120f0/databases/(default)/documents/users/YVZ8kOtWSuOJJqlHqPVqnTOvl803. What am I doing wrong?

This is update function with state and UserAuth context:

    const [email, setEmail] = useState('')
    const [phone, setPhone] = useState('')
    const [language, setLanguage] = useState('')
    const [valute, setValute] = useState('')
    const [instagram, setInstagram] = useState('')
    const [name, setName] = useState('')



    const {user} = UserAuth()

    const updatePerson = async(email) => {
        await updateDoc(doc(db, 'users', user.uid), {email})
    }
    
    const updatePersonData = async() => {
        await updatePerson(email)
    }

      <input type="text" placeholder={user.displayName || user.email || user.phoneNumber} className='form-control' onChange={(e) => setName(e.target.value)}/>
     <input type="text" placeholder={instagram} className='form-control' onChange={(e) => setInstagram(e.target.value)}/>
     <input type="text" placeholder={email} className='form-control' onChange={(e) => setEmail(e.target.value)}/>
     <input type="text" placeholder={phone} className='form-control' onChange={(e) => setPhone(e.target.value)}/>
     <input type="text" placeholder={language} className='form-control' onChange={(e) => setLanguage(e.target.value)}/>
     <input type="text" placeholder={valute} className='form-control' onChange={(e) => setValute(e.target.value)}/>

    <button className="btn events1 btn-white" onClick={updatePersonData}>SAVE</button>

CodePudding user response:

The error message already says what you are doing wrong. The user you want to update doesn't exist.

The User with the id YVZ8kOtWSuOJJqlHqPVqnTOvl803 doesn't exists in your users collection in the Firestore.

If you want to update an actual document in the Firestore Database make sure user.uid points to an existing document in your users collection. Alternatively the document exists but the collection doesn't and the document is placed in a different collection.

If you want to update the Authentification Email the user uses to signin you have to use another function:

import { updateEmail, getAuth } = 'firebase/auth';

const auth = getAuth(firebaseApp);

const updatePerson = async (email) => {
    await updateEmail(auth.currentUser, email)
}

Edit (depending on the comments below): In order to keep your document ID in sync with the ID of the user in the Firebase Authentication you have to create the users document with the ID you get in return after creating the Auth User.

import { getAuth, createUserWithEmailAndPassword, setDoc } from "firebase/auth";

const firebaseApp = // your firebase app obj
const auth = getAuth(firebaseApp);
const db = getFirestore(firebaseApp);

createUserWithEmailAndPassword(auth, email, password)
  .then((userCredential) => {
    // Signed in 
    const user = userCredential.user;
    const uid = user.uid;
    setDoc(doc(db, 'users', uid), {
        // the data you want to store in your document
    });
    // now the document will have the same ID as the auth user
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
    // ..
  });
  • Related