Added kitchen sink to sample app

[shilman]

Issue: #1220

What I did

Added notes, info, knobs, options to the test-cra and cra-storybook examples.

• test-cra tries to simulate what a user would see installing these packages but based on file links
• cra-storybook is uses lerna bootstrap to install the dependencies and is easier to develop on

What I found

info and knobs are apparently broken.

• info shows an error in the preview window. this also causes our test suite to fail (yay?!)
• knobs shows up but editing is broken (URL is not updated properly)

Update:

• info works on all platforms?
• knobs is fixed based on @ndelangen 's fix below

What I need

• any feedback on existing scenarios
• contributions for events, graphql addons
• are the bugs i'm seeing actually bugs?

How to test

npm run bootstrap
cd examples cra-storybook
npm run storybook

cd ../test-cra
npm install
npm run storybook

[codecov]

Codecov Report

Merging #1224 into master will not change coverage.
The diff coverage is 0%.

@@           Coverage Diff           @@
##           master    #1224   +/-   ##
=======================================
  Coverage   13.73%   13.73%           
=======================================
  Files         207      207           
  Lines        4638     4638           
  Branches      513      521    +8     
=======================================
  Hits          637      637           
+ Misses       3557     3547   -10     
- Partials      444      454   +10

Impacted Files	Coverage Δ
app/react-native/src/bin/storybook-start.js	0% <ø> (ø)	⬆️
app/react-native/src/bin/storybook-build.js	0% <ø> (ø)	⬆️
app/react-native/src/bin/storybook.js	0% <ø> (ø)	⬆️
...react-native/src/manager/components/PreviewHelp.js	0% <0%> (ø)	⬆️
addons/info/src/components/PropVal.js	0% <0%> (ø)	⬆️
app/react/src/client/preview/client_api.js	39.28% <0%> (ø)	⬆️
addons/knobs/src/components/types/Object.js	5.81% <0%> (ø)	⬆️
addons/knobs/src/components/PropForm.js	8.51% <0%> (ø)	⬆️
app/react/src/client/preview/render.js	0% <0%> (ø)	⬆️
...rc/modules/ui/components/left_panel/text_filter.js	33.33% <0%> (ø)	⬆️
... and 12 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update a81283f...b7b8080. Read the comment docs.

[danielduan]

looks good, thanks!

[danielduan]

out of scope of this PR, but we should standardize whether we do import withAddon or import { withAddon }.

[alexandrebodin]

#1238 Some cleaning I did on the propTypes :)

[shilman]

@tmeasday @ndelangen

Proposal based on what I've seen from both of you:

1. rename cra-storybook => cra-kitchen-sink (to line up with react-native-vanilla, crna-vanilla)
2. remove test-cra and port any interesting diffs over to cra-kitchen-sink
3. create a cra-vanilla that's the equivalent to running getstorybook in a CRA app
4. use bootstrap-style dependencies across the board rather than file: deps which are problematic

Happy to do all of this if you're good with it, except for (2) which I'd ask for help from @tmeasday

[tmeasday]

I'm happy with this and happy to help. I'm not sure what the best naming is. I chose react-native-vanilla in the sense of "not CRNA" but I guess you took it to mean "simplest possible storybook usage".

I think long term we want a RN kitchen sink too, and there's no reason not to use the same app for that. So maybe we should rename that app react-native-vanilla-kitchen-sink or just react-native-kitchen-sink if it's clear that it isn't CRNA.

[shilman]

Ok, I understand vanilla better now.

How about:

• x-getstorybook
• x-kitchen-sink
• x-whatever-we-want-to-demonstrate

[alexandrebodin]

Sounds good