So I am trying to do an app using React and Firebase and by now everything was fine.
In my app there are a few options to auth a user. Google, Email and Password and also Twitter.
When a user is creating an account using his email I can easily structure how the data will look like in my firestore for that user and I do it that way:
firebase.createUser(
{ email, password },
{
firstName,
lastName,
emailAddress: email,
birthDate: null,
activeStatus: false,
dateJoined: new Date(),
avatarUrl: null,
friends: [],
posts: [
{
content: "I have just joined!",
date: new Date(),
likes: [],
comments: [],
shares: []
}
]
}
).then(() => {
history.push("/login")
})
And the output in my firestore is something like that: Firestore screen - email
Now I want to structure my data of users that Signed In using Google auth the same way.
This is how my Sign In using Google looks like:
const loginWithGoogle = () => {
firebase.login({ provider: 'google', type: 'popup' })
.then(() => {
localStorage.setItem('authUser', auth)
history.push("/home")
})
.catch(error => {
console.log(error.message)
})
}
And the output in the firestore by the default looks that way: Firestore screen - google
So my question is:
How do I even try to make both auth types collections look the same way?
Should I somehow find out that the user is signing in for the first time using google provider and then try to structure that collection or is there a better approach to do that?
Thanks for all responses.
*******************************
For people who are struggling with that:
I did it thanks to @Ajordat response and this is how it looks and works perfectly fine for me:
const loginWithGoogle = () => {
firebase.login({ provider: 'google', type: 'popup' })
.then((user) => {
const fullName = user.profile.displayName.split(" ")
const firstName = fullName[0]
const lastName = fullName[1]
if (user.additionalUserInfo.isNewUser) {
firestore.collection("users").doc(user.user.uid).set({
...user.profile,
firstName,
lastName,
birthDate: null,
activeStatus: false,
dateJoined: new Date(),
friends: [],
posts: [
{
author: firstName + " " + lastName,
content: "I have just joined!",
date: new Date(),
likes: [],
comments: [],
shares: []
}
]
})
} else {
console.log("user exists")
}
localStorage.setItem('authUser', auth)
history.push("/home")
})
.catch(error => {
console.log(error.message)
})
}