Remove state dependencies in components.

[brodavi]

It is difficult to implement stories/documentation in Storybook due to state dependencies in components. Remove state dependencies in components. Create pure components and bound components. Separate HTML (create pure component) and pass attributes to component (already done for 3 or 4 components)

[becca-tiessen]

~~Hey I could take a stab at this one, are there specific example files that have been done already that I could reference?~~ Edit: I don't think I have enough context of the codebase to do this one justice, so I'll let someone else take over, sorry!

[litenull]

@becca-tiessen Hi! There is no example yet, but i think you could do something like this:

Example of component with state:

const Component = () => {
  const workbook = useWorkbookSelector();
  return (
    <Section> {workbook.name} </Section>
  )
}

What we need to do:

const Component = ({ name }) => {
  return (
   <Section> {name} </Section>
  )
}

Basically de-couple the views from the state. Let me know which components you would like to start with!