jeevadeepan / sleep-calculator Goto Github PK

Implement a reusable DurationSelect component that displays a dropdown of time duration (0 - 24 hours) in 30 min increments.

Doc reference - https://reactjs.org/docs/forms.html#the-select-tag

Acceptance criteria:-

• Needs to take in a render a dynamic label
• Accepts an 'onChange' callback to be invoked when dropdown value changes
• Selects passed 'value' from the list
• Should be accessible
• Should be unit tested

Implement SleepScore Component that lets a user select their duration in bed and the time they were asleep and provides a sleep score.

Acceptance criteria:-

• User should be able to select their duration in bed and duration asleep
• User should be able to see their sleep score when they hit 'Calculate' button
• 'Calculate' button should be enabled only after duration inputs are selected and valid
• User should see a graceful error message when score calculation fails
• Page elements should be accessible
• Component should be unit tested

Integrate /save API with SleepScore component to store user's sleep score when it's calculated.

Acceptance criteria:-

• Create a mock /save endpoint that accepts a POST request and returns a random 200 or 5xx
• Sleep score should be sent to /save endpoint whenever it's calculated
• Successful response should display calculated score in output
• Failed request should be gracefully handled to display an error message

https://create-react-app.dev/docs/getting-started

Update .README file with

• steps to install the project dependencies
• steps to run
• instructions to run tests