Redux News Reader

Projects Skill Path Projects
23

Hey guys,

I’m really struggling with the correct statement for postCommentsForArticleId.fulfilled section in the extraReducers object. Please help me to review my code, this is my current code that does not work when I submit a new comment:

[postCommentsForArticleId.fulfilled]: (state, action) => {
state.byArticleId.push[action.payload.articleId].push(comment => {
return action.payload.comment
});
state.createCommentIsPending = false;
state.failedToCreateComment = false;
}

Any feedback would be really helpful thanks!

1 Like
24

Hey there, unfortunately, I do not have a subscription anymore on Codecademy and I can’t see the exercise. Although I think I did spot a mistake in your code

state.byArticleId.push[action.payload.articleId].push(comment => {
return action.payload.comment

you are pushing an article id into state.byArticelId which so far is correct, but then you try to push again and the second push is handled like an arrow function. Maybe you should replace your second push with map or forEach. Remember that Array.push() is only for adding a new item in an array not for iterating through an array.

I would do it like this instead

state.byArticleId.push[action.payload.articleId].map(comment => {
return action.payload.comment
25

Thanks for the reply,

I’m stuck on the same step too. But anyway here’s my suggestion, try not to over-do when you use a nesting push statement inside another.

Here’s what I did

[postCommentForArticleId.fulfilled]: (state, action) => {
      state.byArticleId.push(action.payload);
      state.createCommentIsPending = false;
      state.failedToCreateComment = false;
},

Test the code out and see if you could experiment with it for a little by using the DevTools console. If you found the solution just notify me.

Good luck! :+1:

26

Okay, so one hour later I have discovered that using the .push() function is not for objects it is only for arrays so try using the spread operator to fix this.

I will post my code here once I figure it out.

27

Hi krisaog,

Thank you so much for your reply, I appreciate your time. I gave .map() a shot but the new comments still don’t seem to be getting added to the array. I’ll have to try play around in DevTools and see what is displayed on the console, maybe the error is somewhere else in my code but I’m pretty sure the issue is in this [postCommentsForArticleId.fullfilled]: section. I’m open to any alternative suggestions that I can try to tweak my code. Thanks again.

1 Like
28

Hi Larrence,

Thanks so much for getting back to me, I’m glad I’m not the only trying to solve this part of the code. I tried using the spread operator with a return statement, however it still didn’t seem to work in terms of displaying any new comments. I am still trying to play around with the code, and I will let you know if I run into any solutions. Please let me know if you manage to figure it out. :sweat_smile:

29

If you can send me the whole exercise as a message I will be more than happy to help you at. This exercise was quite a hassle so it’s normal to struggle a bit to solve it. Hope you can solve it :slight_smile:

1 Like
30

I figured out something, the push statement works on objects as long as you use it appropriately like this by using the square brackets and then the push statement after:

state.byArticleId[action.payload.articleId].push(action.payload);

Unfortunately that is returning an empty comment.

31

Hey after one hours I noticed what was wrong with my code the JSON.stringify thing needs to have an object within it’s parameters. I will post my code on Github and send the link soon. By the way I have travelled to Paris a few days ago for a tour, and right now the time is 10:11pm in Paris so I better get to bed. My code will be posted tomorrow Central European Time.

32

Sorry about the delay I’m trying to install stuff for react and redux so I can go off-platform, but it doesn’t seem to be working.

33

https://github.com/Jerrence/Redux-News-Reader-Project-Codecademy

All done!

My solution code has been posted, sorry for the wait. I just had a little bit of trouble with the mock service worker It was giving me a Uncaught (in promise) Error: [MSW] Failed to register the Service Worker error and I didn’t know how to fix it. So I just posted the code anyway even with that error. Does anyone know how to fix it?

34

I was checking your code, since I was not able to get my new comments to add up to the existing ones, and I found it interesting that yours is working, since articleId is not defined

   
 .addCase[postCommentForArticleId.fulfilled]: (state, action) => {
      const articleId = action.payload.articleId
      state.byArticleId[articleId].push(action.payload);

      state.createCommentIsPending = false;
      state.failedToCreateComment = false;
    }

The way I got it to wor was by writting it like this:

   .addCase(postCommentForArticleId.fulfilled, (state, action) => {
        state.createCommentIsPending = false;
        state.failedToCreateComment = false;
        state.byArticleId[action.payload.articleId].push(action.payload);
      })

I swear I tried this many times with no success. Then tried a thousand other things to finally find your code and, with that fix, it finally worked. So many thanks!

Regarding teh MSW error, no idea. I set it up following the documentation, and then I copied the content from codecademy in the generated files. I do not get any error whatsoever.

This project was really tough, but I got through! I will post my code here ASAP.

1 Like
35

Here’s my code:

https://github.com/Alvaro-LGPA/redux-news-reader.git