Using fullstack recipe-react-frontend app from Lab10.1 please do the following Refactor at least one class based component into a hook : 25 points Add a conditional statement if the recipes array is empty it will render either a message "No recipes found in the database. Please use the form to add your own recipe", or the List component. The list component takes the recipes array, and passes each recipe to the Recipe component that renders it. You may want to read about conditional rendering of a component athttps://reactjs.org/docs/conditional-rendering.html(Links to an external site.)- 10 points Refactor the code in the src/api.js file to make it more DRY - 5 points Correct formatting, variable naming, declarations, comments - 50 points Extra credit if you convert all class based component into hooks.

Using fullstack recipe-react-frontend app from Lab10.1 please do the following Refactor at least one class based component into a hook : 25 points Add a conditional statement if the recipes array is...

Add a conditional statement if the recipes array is empty it will render either a message "No recipes found in the database. Please use the form to add your own recipe", or the List component. The list component takes the recipes array, and passes each recipe to the Recipe component that renders it. You may want to read about conditional rendering of a component athttps://reactjs.org/docs/conditional-rendering.html(Links to an external site.)- 10 points

Mar 23, 2022