the firebaseError error message display when trying to create new collection called message inside channelroom

Question

FirebaseError: Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field user in document channelroom/mfJm8DH7f5w14GO1W45y

the firebaseError error message display when trying to create new collection called message inside channelroom/mfJm8DH7f5w14GO1W45y/messages /6lUXO2mRwl75G0hV3HoA)

    import React,{useState,useContext} from 'react';
import db from './firebase';
import {AuthContext} from './StateProvider';
import firebase from 'firebase';

const ChatIput = ({channelName,roomId}) => {
    
    const [input,setInput] = useState("");
    const { currentUser } = useContext(AuthContext);

        const sendMessage = (e) =>{
            e.preventDefault();
            if(roomId){ 
                db.collection("channelroom")
                .doc(roomId).collection("messages")
                .add({
                    post:input,
                    user:currentUser.displayName,
                    userImg:currentUser.photoURL,
                    timestamp: firebase.firestore.FieldValue.serverTimestamp()
                });
            }
            setInput("");
        }

    return(
            <div className="chat_input">
                <form>
                    <input value={input}
                     onChange={(e)=>setInput(e.target.value)}
                     placeholder={`message ${channelName}`}/>
                    <button type="submit" onClick={sendMessage}>Send</button>
                </form>
            </div>
    )
}

export default ChatIput;

Please, instead of copying/pasting a screenshot of your IDE, paste the code as text and format it as code. This way we can copy it in order to write an answer. — Renaud Tarnec
I don't think the error message refers to this code. It's complaining about at call to set(), which you don't have here. Please find the code with the error, and copy it into the question (don't show a screenshot). — Doug Stevenson
You are still not showing a call to a method called set() anywhere in this code. — Doug Stevenson

Renaud Tarnec Renaud Tarnec · Accepted Answer · 2020-09-16T14:54:47

It should be currentUser.displayName and not currentUser.dispayName.

// ...
.add({
  post: input,
  user: currentUser.displayName,
  // ...
 })

the firebaseError error message display when trying to create new collection called message inside channelroom

1 Answers