Code component with same name as page not getting props passed to it in production

Issues
1

Ran into a weird issue this week that I’d like to report.

I had a code component and a page that were both called the same thing. So e.g. the code component and page were both called ProfilePicture.

This component worked correctly in studio, but when displaying the page on our website proper, the code component ProfilePicture would not be able to access any of the props configured for it, and would therefore show up blank.

The component worked correctly when added to another page (e.g. ProfilePage) and started working when I renamed the original page to a different name (e.g. ProfilePictureNew).

2

Hi @native_woodpecker, are you using the headless API (loader-nextjs)?

3

Update: I can confirm reproducing the issue and heard from the team that conflicting component names would indeed cause issues. We’ll try to help prevent users from running into this case in the product. Thanks again for reporting!

4

Sorry for the late reply! Sounds like you have it all in hand, but just for completion’s sake I was using loader-react!