Integrate Storybook in the project

[zivnadel]

I suggest we add Storybook to the project. Storybook is a user interface development environment that allows us to build, test, and showcase our UI components in an isolated, reusable environment.
It will significantly improve collaboration, and will help keeping unified design language across the entire app.
I started testing it locally, and so far, it seems suitable for this project.

[zivnadel]

@yonatanmgr What do you think?

[yonatanmgr]

That's a good idea, though I do have a question - does it require us to copy all of our components manually to Storybook?

[zivnadel]

That's a good idea, though I do have a question - does it require us to copy all of our components manually to Storybook?

Yes. We need to create component.stories.tsx file for each component and pass props

[ErezBiren]

I would put there only the common reusable components.
It doesn't make sense to put there FilesSidebar , but we can put the ConfirmModal for example.

In addition, we can put all the stories in one file, although it's a best practice to separate to file for each component.

[yonatanmgr]

Sounds good! How do we start with this? If any of you wants this I'll assign you, if not I'll do it!

[zivnadel]

@yonatanmgr I can do it.

[yonatanmgr]

@zivnadel Assigning you!

[zivnadel]

According to the developers of Storybook, electron is not supported, and there are no plans to add support in the future as stated in storybookjs/storybook#1435. Although I was able to successfully initialize Storybook in the project, I'm concerned that it may not work seamlessly with electron's core. Therefore, I have decided to not proceed with it.