Section 11 (Firebase): Lesson 9 - User specific data

Hey you.

And welcome.

In this video, we're going to work with user specific data.

So let's dive right into it.

Now, let me show you what I mean.

In our app currently, if I log in, I can see the contacts.

However, these contacts are the same for everyone.

That means whoever is using this app can see the contacts that I've added.

Also, I can see their contacts, so it's not very user specific, it's just a general collection of

contacts.

So we want to make it user specific.

All right.

In order to do so, first things first, I have to store the user data in my cloud Firestore.

So what I'm going to do if I go back to Firefox, you see how we have a collection of contacts.

I'm going to start a new collection of users and every user that logs in, they will get their own user

document and inside that document I will add their contacts rather than putting contacts on the root

level.

All right, let's do that.

So I'll go back to VS code.

And in our auth context, that's where we are listening to auth change.

And I can call set doc here.

So in order to store the data, we will just start with a reference.

So user ref.

Call it doc.

Import that auto from Firebase Firestore.

Pass it db which is going to come from our utils firebase.

Yes.

And then provide it with the collection name.

So users in this case.

And then we will provide it.

The ID and the ID in this case will be the user dot uid.

Oh, not a string.

Yeah, actually, we have to take away the null that we did before and make it so that the user will

never be null if there is no user, don't trigger the rest of my code, just return early.

So that will make it so that user ID is always true.

All right.

Next we have the reference already set.

Let's go to set doc function which will be imported from Firebase Firestore as well.

Pass it the ref and then await it and wait for user snapshot to come back.

There we are.

For, said Doc.

We have to provide the data that we want to store, so I'll store two things from user.

Let's destructure them.

That would be a much easier way to read the code later on.

So instead of user uid i will destructure uid from here I'll also destructure the email, the login

width and display name that should be enough to work with.

So I'll pass email and display name down to Firestore and using this user snapshot, I don't really

think I need to weight it, but I'll await it anyways and I'll set it afterwards.

So let's go ahead and save.

Perfect.

So as that happens, my browser has refreshed.

So if I go to my Firestore refresh the page.

There we are.

I can see the users collection has started and there is a ID assigned which is the UID For the authenticated

user.

It will always be the same and that's where I can see the person's name and email address if I refresh

this page again.

And refresh my firestore.

It doesn't add another entry, so set Doc is making sure that it's always the same entry and if there's

any changes to the email or display name, it will update that automatically.

So that part is taken care of.

Now we want to move contacts inside the user object or user document.

So let's see how we can do that.

I'll go back to my VS code and let's go to contact context and notice in contact context every time

we want to.

We want to write data is going to contact collection.

So first things first.

Let's move all of that, centralize it, and I'll call this up here a const and call it collection name.

It will be called contacts, so keep it the same.

So right now I'm just refactoring.

I'm not making any changes, just making it so that it is all coming from one variable name.

So that's for get contact by ID, add contact also has that edit contact also has that delete contact.

Also has that and handle fetch also has that.

I think that's all The area's perfect.