Good afternoon, I can’t figure out how to upload a photo (avatar) to firebase, but so that the avatar for each user is different and saved at each user login. User registration via firebase Authentication
const [user, loading] = useAuthState(auth);
const [image , setImage] = useState("");
const storage = getStorage();
//upload function
const upload = ()=>{
const storageRef = ref(storage, `usersAvatar/${image.name}`);
if(image == null) return;
uploadBytes(storageRef, image).then(() =>{
getDownloadURL(storageRef).then((url) => {
setUrl(url);
})
})
}
// return
<input type="file" onChange={(e)=>{setImage(e.target.files[0])}}/>
<button onClick={upload}>Upload</button>
Since you use this location in Cloud Storage to store the user's image:
const storageRef = ref(storage, `usersAvatar/${image.name}`);
Any user who uploads the same image.name will end up overwriting anyone else's image.
What you'll want to do instead is based the upload location on the UID of the user. So for example:
const storageRef = ref(storage, `usersAvatar/${user.uid}/${image.name}`);