Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to tell React-Redux view when action has completed?

Tags:

reactjs

redux

Sorry for the possibly unclear subject line here.

My "add review" view fires off a start action. The reducer responds to the start action by setting isLoading to true, which causes the view to show that it's loading. When my action completes, both success and failure set isLoading to false in the reducer, and the activity indicator disappears.

In the case of failure I can write an error to the reducer and I can have the error rendered in my view when an error exists in the reducer, and I can clear the error in the reducer the next time the start action fires.

So I can inform my view of an error, but how do inform my view of success, and replace the review for with the review list?

All the solutions I can think of sound clunky and wrong:

  • A newReview property in the reducer, whereby my view renders the review list if newReview is truthy, and then fires off a "clear new review action"?
  • Somehow storing the attemptedReview and adding a showList logic that entails checking whether the attemptedReview exists in the current product's reviews? Where that showList logic also, more simply, includes the state of whether the user has chosen to show the list or show the form?
like image 639
Jonathan Tuzman Avatar asked Oct 27 '22 10:10

Jonathan Tuzman


1 Answers

I've managed to simulate this kind of behavior by creating a new resetAction that resets the redux store, and a new variable on the reducer state called isSuccess.

This way, when your initial action succeeds, you set the isSuccess to true, then you catch the isSuccess on your respective Component and handle the logic you want (Redirects or state changes) and finally call the resetAction so the redux store comes back to normal.

I guess it's kinda clunky and not elegant but it works.

like image 82
Japsz Avatar answered Nov 02 '22 11:11

Japsz