Beautiful.
And once we have the bar chart in place to do the same thing with area chart and the setup is exactly
the same.
So grab these components from the library first.
When we're accessing the same data, pretty much set up the responsive container, yada yada yada.
And we go with area chart instead.
We still passing that data.
So data prop equals to our data a little bit of margin.
Going grid x axis is going to be a date.
Then for y axis, we won't use the decimals.
We'll still use the tooltip.
And when it comes to area, we'll just pass there a few more drops.
But as far as the data key, it's going to be equal to our current property.
So let's start working on that.
Let's just remember that we need to rename the components are back in the area chart.
Let's copy and paste.
Say that we're looking for the component.
And let's also add that one to the export ban, let's look for our data and let's set up our return.
We're going to go with responsive container looking for some kind of with which in our case, it's going
to be equal to 100 percent, then let's set up the all right, which in this case is also going to be
under and running side of it.
Let's remove the area chart next and let's go with area chart component.
So not the actual component.
We're looking for area chart that is coming from the library.
One data is equal to our data.
And I also want to add the margin the same way we're passing the object and our setup is equal to a
50 then inside of the area chart.
Let's go with that.
Go ahead one.
So we'll go with Grid.
And let's add the strokes here and I want will be equal to three and three.
Let's close this and we want to go with x axis y axis.
So x axis pretty much is going to be exactly the same as well as the y axis as in the bar chart.
But I don't want to copy.
So let's just go here with key equal to a date.
Let's again close it and we have the same thing for the y axis where we don't want to use the decimal.
So let's go over here with allow decimals, and let's set it equal to a false.
And we want to the tooltip.
And lastly, let's go with that area, one area over here.
One type of set it equal to a monotone.
And we want to go with data key again now in this case, we're looking for a recount.
So for the x axis or state now for the area, it is actually count, then as far as the stroke.
I'm going to go with this value.
So hashtag.
And then to see be.
And one B.C., which essentially is the same as I have for the bar chart and then for to fill will go
with a little bit different ones or hashtag B, e f and F A.
And then the let's close the area, let's save it.
And once we navigate to the browser, not only do we have the bar chart, but once we click on area
chart, we also display that chart as well.
And with this in place now, we can start setting up the search functionality in the all jobs page.