Userstory 11 - Create a unique component to replace for all those component which repeats

[YuriPadilla]

Value Proposition

As a developer, I want to have a unique piece of code (in form of a component or styled component), so that I can use it everywhere when I need it.

Description

In the code all over the pages and components, there is a lot of parts of the code which are the same, and it repeats again and again, like buttons, next/links, sections, headings h3, etc... The Object of this Userstory is to find those unnecessary repetitions of code and a create a respectively component (or styled component) to use it there instead where is need it.

Acceptance Criteria

• [ ]

Tasks

• [x] Create a styled component "StyledLinkAsButton" which is a link with a function as button and use it there where is need it,
  • [x] Write this "StyledLinkAsButton" in: components/Button/Button.styled,
  • [x] Use this "StyledLinkAsButton" in: PriceInfo, BikesPreview, ContactInfo,
• [x] Create a styled component "StyledButton" which is a button and use it there where is need it,
  • [x] Write this "StyledButton" in: components/Button/Button.styled,
  • [x] Use this "StyledButton" in: ProductDetails, ContactUsForm, SelectedProducts, LeaseTimeForm,
• [x] Create the component "StandardSectionApp" which will be used instead of the html section:
  • [x] This "StandardSectionApp" will return a "StyledSection" with a "StyledHeadingH3" and a <hr />,
  • [x] This "StandardSectionApp" will accept the tittle of the section as prop,
  • [x] This "StandardSectionApp" will return a children,
  • [x] This <StandardSectionApp> will be used instead <section> all over the WebApp,
• [x] Move all the style components in every "index.js" to the respectively "...styled.js",
• [x] In "Contact us" form, make the button disabled when the form is not fully filled out.

Complexity

M