Hi everyone.
In previous video we already added real time for create a new message, right?
Well in this video let's do similar for update.
Now if you can see right here we already have a message right.
And right here we have a sub way to do that.
Right.
Right here we can do that.
Similar with this thing.
This thing.
Now let me show you.
We have two ways right now.
Let me just copy paste this thing and put that over here.
Okay.
And I will put the message.
And we need to multiply.
And we also need to convert to radio.
And we will create a gateway.
Will handle public message.
Right.
In order to update the message what we need let's say right here we only need the.
Radio message right here.
Let's remove the composition.
We don't need that also.
Oh sorry.
But actually we are we still need the composition because we need to update the message inside the conversation.
Right.
So for that reason in this case we will add the real time stuff over here.
Let me show you.
Mm.
After we saved us, we will find the message and add the real time.
Over here.
Relay channel of that message.
Right.
And right here, we need to emit the event.
We will update message.
What is here?
We need to move the conversation away.
Well the conversation are they come from the message.
Right.
Not convert.
Session dot.
10.23.
Okay.
That's about how we can handle the update message.
Okay.
And this is the first one.
So let me show you the second one.
Okay.
Let me explain it for you.
Let me run the code and explain for you.
Now you can see right here we only update the test and media files.
Okay, so for that reason, we actually can send the message like that.
Let me show you this dot.
Versus y dot handle update message.
Maybe I will create the handle of that message.
Version two okay.
And right here we need to put some data over here.
Now you can say right here we need the data.
Maybe I will send with the object like ID okay.
Firstly, we read a message a day, right?
We read the message.id and you can see right here we need to convert.
Session ID will be message dot.
Session dot underscore array over here.
And maybe we need a test because we update the test right first right here we will message dot test.
And modify.
This y okay.
And right here is an update message.
So we only need the data okay.
And right here we still need to conversation when we come from the data dot convert session.
And let me change my name right now.
And right here we need to put the update message okay.
Maybe version two or something like that.
And with the data over here and okay you know the error.
Let me show you why it's work.
Now you can remember right here we we send exactly the new object.
Let me show you what I mean.
Right here.
We actually send the entire object.
If we use this way right into the front end and the front end, it will somehow update the spec.
Okay.
With the new information.
Well, here, what you can do in this is, uh, we will need to see everything.
The reason?
Because in order to update, we only need to update the test and modify.
And we need the some code, some ID and conversation.
So the conversation right here will be required because in order to update we need to know which the
conversation to join into the room right now.
Let me show you how it works okay.
With this?
Why?
Let me show you.
For example, it lights up inside the react application.
We have a state, right?
Possible icons and set messages over here.
We will use that with the right.
And what is that?
State the message right here.
It will contain the array like this.
Right.
It will contain an array of the object right here.
Right.
Let me try.
And add in a reboot over here.
Okay.
For example, we have a stack like that.
Okay.
And in order to update the stack of the front end, what we need to do.
Okay.
Right here we need to find the message.
Okay.
This is just the front end okay.
You don't need to write copy.
For example, like file message will be for message right here.
Not file.
Okay.
We will find the message with the underscore ID.
Equal with the ID from the data of the socket okay.
For example eye socket data underscore over here.
Okay.
If it match what we need to do, we just need to update the file message right here with the best will
be the new test write.
Test and file versus media file.
Data dot media file.
Okay.
We just need to do something like that.
And we will set the new style with the possible I o versus and file message.
Or we can replay it here.
But you got the idea right okay.
With this approach you should handle the front end a little bit okay.
And with this why we need to query into the database again.
But you don't need to uh, to uh write it in the front end.
So how about your solution?
Okay.
with my with my.
I prefer using this solution.
Okay.
I prefer using this solution because I on one hand on some lose it in the front end.
Okay, so I will comment this one for you.
Okay.
You still need to know.
Whereas with me I prefer using this way.
I want it will.
It will send entirely respond message and I want it to update with new information inside the startup
react.
Okay, so you got the idea right.
Let's test that.
Message.
We will update.
Right.
Let me.
Go to the react on message.
I got the idea over here.
Okay.
Collect all of that message and both the ID and half of that also.
And I will check the console log from the gateway over here.
Right.
Now you can see what we have.
We have media files.
Okay.
We have some sender information.
And since my information's over here, it means we already correctly.
Okay.
Let me go last and I will keep the here for you.
Okay.
If you prefer this way, feel free to do that.
Okay.
So that's for the video.
And I will see you in the next one.