Form/Products List

[dianahime]

Value statement

As a user
I need a list of my cosmetic products with expiring dates
so that I know when to throw out products when they get bad.

Description (Text, Scribble, Wireframe, Design)

Acceptance criteria

• The second input is type date
• The third input is type number with a min of 1
• When the button is clicked, the input fields should be cleared
• Before the form is completed for the first time there should be a picture under the form where the list items will be later
• After the form is completed for the first time, the picture should be replaced with the first list item
• A list item consists of the product name, opening date, and expiration date

Tasks

• Create a feature branch
• Install styled components
• Install storybook
• Install React Testing Library
• Delete default react setup
• Add global styles
• Create component Button
• Add styling to Button
• Create Button in Storybook
• Write test for Button
• Create component Form
• Create Form in Storybook
• Add styling to Form
• Write test for Form
• Create component Products list
• Add styling to Products list
• Create Products list in Storybook
• Write test for Products list
• Add components to the app (feature implementation with the state)
• Add missing styles
• Write integration tests w/ Cypress ?

Size

medium