But now we have a problem that is occurring when we fetch our newsletter's. It's saying TypeError date.getDate is not a function and date.getMonth and all that right.

It's happening in two components so newsletter archive and newsletter box, let's start with the box. So I'm going to go to newsletterBox.js and let's parse it. We need to say if there's not a date then return it right, fetching newsletters or no newsletters or we can say something like no newsletters but we'll just say fetching news letters.

But then if there is a date then it's going to get passed there, it's going to get passed this if statement. So we'll say const parseDate, let is how you define constants in swift, but anyway const parsedDate is equal to new Date and then just pass in the date.

const parsedDate = new Date(date);

Now in our return we're just going to replace all these dates with parsedDate.

newsletterBox.js

return (
            <div className='newsletter-box'>
                <div className='newsletter-box__day'>{parsedDate.getDate()}</div>
                <div className='newsletter-box__month-year'>{months[parsedDate.getMonth()]} {parsedDate.getFullYear()}</div>
                <div className='newsletter-box__point'></div>
            </div>
        )

So parsedDate.getMonth, getDate, getFullYear instead of date, so that should fix that one. Now if we go to our application in the browser and login you'll see that we get less errors, we get two now which is really one.

So it says date.getMonth is not a function which is in newsletterArchived.js, okay if you click it, it will bring you to that file, in the browser here and I'll show you. All right so we need to go to newsletterArchived.js and you'll see that we're using it in the archive item.

We put the archived item in the newsletterArchived.js with the archive. So here's what we're doing, we have the date here so what we need to do is we need to parse the date and then use it. So let's do the same thing, let's say const parsedDate = new Date(date); then copy that parsedDate and replace all of these date. with parsedDate. so getMonth, getDate, getFullYear.

So I just parsed the date, now let's go back into the browser and login to the console and minimize it a bit. And you'll see we don't get any errors and it fetches the newsletter we built.

So yeah that's how we fetch a newsletter okay. It looks like our image is not there, chances are it's displaying for you because that's probably an issue on the backend that we'll fix in the upload process. I probably just didn't do anything with the imageUrl, perhaps maybe, we'll see I don't know. But let's try clicking on it, and we see it here and it's working properly.

So that's how you do that, it's completely functional. All we need to do now is we need to learn how to edit a newsletter, we need to implement an endpoint to edit a newsletter, not create a new one, just edit it.

So what we'll do in the next video is learn how to do that, so let's commit our code.

Terminal

git status
git add .
git commit -m "parsed date objects in newsletter components to remove date errors"

I'll see you in the next video.

Resources

Source code