I've created an extension library for PnP Modern Search Results so I can render a specific layout for my search results, which just consist of news pages. In essence the layout is just a grid of 4 items, with an image as a background and different text on top. I would like to use the MGT Person component to display the author's name and avatar. I'm importing the required components into my main component file
import { Person, ViewType } from '@microsoft/mgt-react';
And returning the component in jsx, passing in the CreatedBy value
<div className="newsSubTitle">
<Person personQuery={CreatedBy} view={ViewType.oneline}></Person>
</div>
Everything compiles fine, I can make a package and incorporate it into my sharepoint site. But when I add the webpart and configure it. I just get a host of errors saying that all the mgt components have already been registered. The person component is in the html, but without any data inside. I am assuming these errors are the reason nothing is being displayed.
I have tried following this thread but get different errors if I change the imports, essentially preventing the webpart from working at all. I'm using mgt-react v3.1.3, so I'm unsure if this fix is still relevant. link to mgt bug
These are the errors I get when I change the imports (following the bug thread above), which basically just tell me the library is broken
I have also tried to add disambiguation, which happily names the mgt-person component differently but I still get all the errors.
Any help or ideas would be greatly appreciated