Back at the office
The duo was back at work. Mike entered with a cup of coffee. It was morning and the office had just started to buzz.
"So Shawn, we did a lot of complex forms stuff last time. Our cart flow is now complete. However, now we have been asked to add a timeout to the cart. We need to show a timer to the user that they need to checkout and complete the order in 15 minutes."
"Any idea how we can do this?"
"Umm, maintain a state for timer and keep updating every second? Take some action when the timer hits zero."
"Right! We will use intervals to reduce the timeout values and keep updating our views to display the timer. As we have been storing the form data in a single place, our Bookstore
component, let's go ahead and add a state value that will track this timeout value. Let's change our initial state to something similar to the following:"
getInitialState() { return ({currentStep: 1, formValues: {}, cartTimeout: 60 * 15}); ...