[gatsby-theme-blog] Can't shadow bio-content.js with .jsx/.tsx

[yokomotod]

Description

in [gatsby-theme-blog],

src/components/bio.js imports bio-content with .js extension.

It makes impossible to shadow bio-content by bio-content.jsx, bio-content.tsx.

Steps to reproduce

gatsby new my-blog https://github.com/gatsbyjs/gatsby-starter-blog-theme
cd my-blog

make src/gatsby-theme-blog/components/bio-content.jsx

Expected result

bio-content will be shadowed.

Actual result

bio-content is not shadowed.

Environment

❯ gatsby info --clipboard

  System:
    OS: macOS 10.15
    CPU: (4) x64 Intel(R) Core(TM) i5-7267U CPU @ 3.10GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 12.11.1 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 78.0.3904.50
    Safari: 13.0.2
  npmPackages:
    gatsby: ^2.15.36 => 2.15.36
    gatsby-plugin-google-analytics: ^2.1.21 => 2.1.21
    gatsby-plugin-google-tagmanager: ^2.1.13 => 2.1.13
    gatsby-plugin-manifest: ^2.2.21 => 2.2.21
    gatsby-plugin-offline: ^3.0.14 => 3.0.14
    gatsby-plugin-typescript: ^2.1.12 => 2.1.12
    gatsby-theme-blog: ^1.2.1 => 1.2.1