Developer Focused Demo

[jolanglinais]

Our demo needs updating and upgrading to easily develop and locally test all the components and their functionality.

Recommended to look into and utilize Storybook

The main components to include initially:

• ContractEditor
• TemplateLibrary
• ErrorLogger
• Navigation

Note: These components do NOT need to be hooked up to each other, just provided with dummy data.

[elit-altum]

I'd like to give this a try. I have some past experience with storybook.

[sanyamdogra]

Hey @elit-altum, are you working on this? Can we co-work?

[elit-altum]

@sanyamdogra Yeah sure! It looks like you have some good experience with StoryBook, I'd be happy to learn some as well. Could you please wait for sometime before we start working btw ? I have some other PR's being worked on and after I close them I'll get back at you asap.

Thank You!

[sanyamdogra]

Oh great, I'll get started with the initial setup of the storybook then. Let's connect when you are through these PRs. Thanks!

[sanyamdogra]

I was thinking of laying a basic roadmap, please provide your feedback to it.
We can create 3 PRs just to create modularity and better reviewing can be done.

1.) Adding all the dependencies and minimal stuff to get storybook up and running by npm run storybook.

After merging this PR we can change the Netlify deployment to the storybook, rather than Demo. The demo can be shifted to a single story afterward.

2.) Adding the Components and their stories eg ContractEditor, TemplateLibrary, ErrorLogger, and Navigation.

3.) Adding the leftovers or the stuff we missed in the above 2 PRs.

Please provide your feedback on this.
@irmerk @elit-altum @DianaLease @jeromesimeon
Thanks!

[jeromesimeon]

@irmerk Should we add a Testing component to that list?

[sanyamdogra]

@irmerk Should we add a Testing component to that list?

Yes, we can do that too. In storybook we can have storyshots testing as an addon. We can use jest too but we'll have to investigate a bit.
Ref: https://storybook.js.org/docs/testing/react-ui-testing/

[jolanglinais]

1.) Adding all the dependencies and minimal stuff to get storybook up and running by npm run storybook.

After merging this PR we can change the Netlify deployment to the storybook, rather than Demo. The demo can be shifted to a single story afterward.

I think the second part of 1 (1.5) should be near the last, because we still want access to the demo while Storybook is being built.

2.) Adding the Components and their stories eg ContractEditor, TemplateLibrary, ErrorLogger, and Navigation.

3.) Adding the leftovers or the stuff we missed in the above 2 PRs.

The rest sounds right. So I think the order should be 1, 2, 3, 1.5:

1. Adding all the dependencies and minimal stuff to get storybook up and running by npm run storybook.
2. Adding the Components and their stories eg ContractEditor, TemplateLibrary, ErrorLogger, and Navigation.
3. After merging this PR we can change the Netlify deployment to the storybook, rather than Demo. The demo can be shifted to a single story afterward.
4. Adding the leftovers or the stuff we missed in the above PRs.

[jolanglinais]

@irmerk Should we add a Testing component to that list?

Unsure I follow you, what do you mean?

[98lenvi]

@irmerk, can I try working on this issue? Thanks.

[jolanglinais]

Closing for #386