Hi @oscadev -
That's a common and important question regarding our React components.
Our React components, like ResourceTable or PatientTimeline, are designed to work directly with the Medplum API. They rely on our MedplumProvider and MedplumClient to handle data fetching, mutations, and real-time updates. This integration is optimized for direct frontend connections to Medplum.
For your Next.js SSR/ISR setup, where your backend is the intermediary and your frontend doesn't directly connect to Medplum, using our components as pure UI elements is achievable by implementing a custom MedplumClient.
This is a pattern we use ourselves; our MockClient, for instance, provides an in-memory API for testing. You can apply the same concept:
Custom MedplumClient: Create your own class that extends MedplumClient (or implements its core methods).
Backend Proxy: In this custom client, you'd implement methods like read, search, create, etc., to make calls to your own backend. Your backend would then communicate with the actual Medplum API (or your data source) and return data in the FHIR format our components expect.
Component Integration: Pass an instance of your custom client to the MedplumProvider. Our React components will then use your client for all data operations, fetching data via your backend.
This approach allows you to use our UI components as intended while maintaining your architectural separation and leveraging SSR/ISR. It requires implementing the necessary MedplumClient methods to proxy requests, ensuring your backend returns FHIR-compliant data.
Does this strategy align with your requirements?