Storybook renders question mark for SVG image

[hhimanshu]

Describe the bug
I am setting up a Gatsby project that renders SVG image. When I set up the storybook, I see question mark instead of the SVG I am looking for.
This is described in the image (left is image from the gatsby app, right is from storybook)

To Reproduce

• Clone https://github.com/hhimanshu/gatsby-svg-import-example
• Run yarn install
• Run yarn start to see the svg icon in the app
• Run yarn storybook to see question mark in the story

System
Please paste the results of npx sb@next info here.

Environment Info:

  System:
    OS: macOS 10.15.4
    CPU: (8) x64 Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz
  Binaries:
    Node: 14.17.4 - ~/.nvm/versions/node/v14.17.4/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 7.20.3 - ~/.nvm/versions/node/v14.17.4/bin/npm
  Browsers:
    Safari: 13.1
  npmPackages:
    @storybook/addon-actions: ^6.3.12 => 6.3.12
    @storybook/addon-essentials: ^6.3.12 => 6.3.12
    @storybook/addon-links: ^6.3.12 => 6.3.12
    @storybook/react: ^6.3.12 => 6.3.12

Additional context

• None