In last video we made sure that anytime that a user goes to streams slash edits slash anything they
see the stream edit component on the screen.
We now need to make sure that we somehow get that little piece of information out of the Ural and communicate
it down to stream at it.
So I'm going to open up my stream at it component inside my code editor and on my components streams
stream at it file.
I'm going to add it on a reference to the prop's argument that this thing receives and then I'm going
to cancel log out props like so.
So I going to save this and I'll flip back over and we'll take a look at the props object that gets
passed down to our component.
All right so here's our prop's objects.
Now you'll notice that there are a couple of props that are showing up inside of here.
All of the props that you see are coming from re-act Rotterdam.
We only have access to these props right here specifically because the stream component inside of our
apts genius file is being rendered by a route component because stream at it is being rendered by route
re-act router Dom automatically is going to add in a bunch of different props to stream edit.
When it gets rendered onto the screen.
And so these are the props.
You see it right here being passed down from re-act router.
There's a couple of different props in here that are going to be very handy over time.
So history location and match right now to get our piece of information out of the well the prop that
we care about is match.
So I went to expand match now find prams and expand it.
And you'll notice that we have a Preem here of ID 3.
We see a 3 right here because the three is what is inside of the address bar.
If I instead went to nine nine nine nine like so and then expanded match again I would now have an idea
of 9 9 9 9.
We see a pram with the name of ID specifically because that is what we put after the colon inside of
our routing definition.
So again inside the component Here's our route.
We got streams at it and then Kolin ID.
So because we said Id right here that is why we got a gram value with a key of ID.
So if we wanted to we could change ideas well if I said Culin anything and then save this and went back
over.
I already got my refresh your soul ex-band match again.
And now to expand pro-ams you see that it says anything.
Now if you want to we could easily have multiple different harams or kind of these wildcard variables
inside of r u r l.
So we could have colon anything colon.
Something else if we wanted to.
So now we would only be able to see this component if we went to stream's at it slash some value and
then slash some other value.
Let's try that out really quickly just to make sure that we understand this.
So I'm going to save this feed back over and then I'm going to manually navigate to streams slash at
it slash 8:51 slash I'm some value like so.
Now I again see stream at it.
If I expand my props and expand match again I can look at Priam's and now I have anything with 9 9 9
and I have something else with I'm some value.
So in practice we are not limited to just putting one of these wild card values or one of these match
Paramo inside of or Euro u r l.
We can put as many as we want but right now we only need one value inside that Eurail because we just
want to know the idea of the stream that we are trying to edit.
So I got to go back over to my route over here and I'm going to revert this back to being just cool
and Id like the.
And now to make sure that I see the correct component on the screen I'm going to click on streaming
on the top left side and then click on the edit button.
One more time.
And now I again see stream at it.
OK.
So we now know the exact ID of the stream that we're trying to edit.
Anytime that we click on that edit button.
So now the next thing I want to try to do is load up some information about that particular stream and
show it on the on the screen.
Remember eventually we want to allow a user to edit this information right we want to show the two text
inputs inside there so will probably make use of redux farm or something like that.
But whenever we go to the edit stream page we want to show the existing title and the existing description
of the stream as it currently is.
So we need to make sure that we've already loaded up the stream and that we can show some information
from it.
So like I said right now we'll just set a very early goal and say let's try to just print up the title
and description and not worry about setting up Reebok's form or anything like that.
So let's take a quick pause right here and we'll start to tackle that in the next video.