Storybook: Storybook Docs - Gatsby props not appearing correctly

[vinayg-cp]

Describe the bug

Not able to see additional metadata of props in the props table, when using the addon-docs.

To Reproduce
Steps to reproduce the behavior:

1. Clone the following repository: https://github.com/vinayg-cp/storybook-poc.git
2. Checkout the following branch: vinay/storybook-props-issue
3. Install the dependencies
4. Start the storybook.
5. Click on button, and then Navigate to Docs.
6. Here in the props table, we expect to see other information too like prop type and description. But nothing is seen.

Expected behavior
Expected to see the props and description.

System:

Environment Info:

  System:
    OS: Windows 10
    CPU: (4) x64 Intel(R) Core(TM) i7-7500U CPU @ 2.70GHz
  Binaries:
    Node: 10.15.3 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.17.3 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.17763.771.0

Storybook Versions:

[shilman]

@vinayg-cp I believe these lines in .storybook/webpack.config.js are the problem:

    // use @babel/plugin-proposal-class-properties for class arrow functions
    config.module.rules[0].use[0].options.plugins = [
        require.resolve('@babel/plugin-proposal-class-properties'),
        require.resolve('babel-plugin-remove-graphql-queries')
    ]

Your code is not running through babel-plugin-react-docgen, which is the default settings in @storybook/react

cc @patricklafrance

[vincebrown]

@shilman thank you I was running into the same issue and your suggestion of updating .storybook/webpack.config.js fixed it for me

  config.module.rules[0].use[0].options.plugins = [
    // use @babel/plugin-proposal-class-properties for class arrow functions
    require.resolve("@babel/plugin-proposal-class-properties"),

    // use babel-plugin-remove-graphql-queries to remove static queries from components when rendering in storybook
    require.resolve("babel-plugin-remove-graphql-queries"),

    require.resolve("babel-plugin-react-docgen"),
  ]