Is it possible to use the local payload api in custom react components in the admin dashboard ui?

Alessio 🍣

5 months ago

7

• 

  Hendrik

  5 months ago

  @Alessio 🍣 basically i try to build a dashboard overview in payload, loading several data from the payload db

• 

  Alessio 🍣

  5 months ago

  Since that's client-side, you can do that with hooks & fetch requests. So first check out

  https://payloadcms.com/docs/admin/hooks#useconfig

  - you can use those in your component, especially useConfig.

  
  
  

  Also check out

  https://github.com/AlessioGr/payload-plugin-lexical/blob/9c6a7672fd782d39e63139dafef4d6a9454170a2/demo/src/customLexicalFeatures/inlineProduct/nodes/ProductDisplayComponent.tsx#L40

  as an example for how I fetch collection data from the payload db. It's just a simple fetch in the end.

  
  

  
  

  Same thing happens in the payload core too, e.g.

  https://github.com/payloadcms/payload/blob/de2ae5ec15be37b84cdae5ed4e38291e6b2b8123/src/admin/components/views/collections/Edit/index.tsx#L50
  

  
  

  You could probably also make a custom endpoint to use the local API and get the data you want. And then fetch from your custom endpoint from your react component

• 

  Hendrik

  5 months ago

  thank you for this detailled answer! 🙂

• 

  Alessio 🍣

  5 months ago

  ur welcome!