Can I use the MDX files generated as components and import those in src/pages?

[santiagoejm]

Hello Community! Hopefully this happens to somebody else before :)

What I am trying to do is treat the MDX files generated after running this plugin (yarn docusaurus gen-api-docs all) like any other component and import those in the React components that are in src/pages, but when I try it, I get this error:

Please would somebody point me at the right direction of what am I missing here?
Cheers

[sserrata]

Hi @santiagoejm, the generated MDX would need to be wrapped in either DocItem or ApiItem to include the necessary providers. That said, if you wrap using ApiItem it will expect to receive props for the ApiDemoPanel portion, which are normally passed via the api frontmatter key.

[sserrata]

The only caveat is that ApiDemoPanel won't/cannot be included, as it both requires the redux provider AND frontmatter.api props to render. It also won't render unless the page is wrapped in ApiItem, which, AFAIK, is probably not possible with a page.

[santiagoejm]

Hey @sserrata, thanks for the clarification! following your steps it actually work and I am able to place the .mdx component where I like to. Cheers to that!

It is indeed a shame that the ApiDemoPanel is not included, I'm gonna have to work around this for a bit, if by any chance comes to mind a possible solution, it will be very much appreciate :)

Thanks a lot, it was a good progress on my end!

[santiagoejm]

Hi @sserrata, sorry that I haven't resolved this discussion, but I am happy that I didn't because I have just one more question after rethinking how to implement this plugin.

This is a different related issue than the previous one, but I am just wondering if by default this plugin generate in the sidebar next to each item the METHOD icons GET, POST, PUT, DEL... like the example:

In my case locally is generating the mdx files and the sidebar items properly but without those nice icons GET, PUT, DEL...

I am wondering if there is a missing info that I should add to the .yaml files from where the mdx is generated for each end point? I notice that the sidebar titles for each mdx is coming from the operationId property in .yaml Or it has to do with the sidebarOptions/customProps object, in which case I can not find the valid properties.

Thanks in advanced

[sserrata]

Please see this doc: https://docusaurus-openapi.tryingpan.dev/customization/styling

[santiagoejm]

@sserrata legend!

[tzvik15]

Good morning, Is it possible you have the wrong Daniel for this? Cheers,

…

On Thu, Jan 12, 2023 at 9:35 AM Steven Serrata ***@***.***> wrote: Hi @santiagoejm <https://github.com/santiagoejm>, the generated MDX would need to be wrapped in either DocItem or ApiItem to include the necessary providers. That said, if you wrap using ApiItem it will expect to receive props for the ApiDemoPanel portion, which are normally passed via the api frontmatter key. — Reply to this email directly, view it on GitHub <#376 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AMQU2LC4LLRYE2HBOU3ZJQTWSAJC5ANCNFSM6AAAAAATLJ4P3U> . You are receiving this because you were mentioned.Message ID: <PaloAltoNetworks/docusaurus-openapi-docs/repo-discussions/376/comments/4668282 @github.com>