Migration from v4 to v5 in microfrontend applications

[sergiidiak]

A bit of context:
Our React app is built from many remote modules (MF) where the host provides a react-query dependency as a singleton and sets up a query client, so other modules use the same context.

Problem:

1. Because remote modules live in many different repositories, we can't deploy all modules and the host with v5 at once.
   Modules can't migrate to v5, because the host is still using v4. If the host migrates to v5, all modules will break because of the 'missing' query client. The solution for this problem, most likely (don't see any other options for now), is to have 2 clients providers (v4 & v5) for the time of migration and somehow sync their caches (any suggestions how?). This way modules can gradually migrate from v4 to v5. Other ideas?

2. It would seem to be the only problem, but .. many of our modules provide an option to clients on how they want to handle data fetching (and error handling) inside the module: do it themselves via suspense (clients provide suspense boundary with fallback) or module provides default behavior. This means that clients could pass suspense: true to the module and it would pass it to query options. In v5, suspense option was moved into a separate hook (understandable), and because of this, we lost our way of abstraction. Atm I don't see a viable option for us to solve this problem without some duplication of modules/workarounds/bad practices. It would be great if useBaseQuery is exported (which supports suspense option) if there are no major concerns, but maybe there is an option I don't see?

Also, just want to say thanks for all the work on v5! Maybe in future major releases there could be a transitional version (where both old/new versions coexist with deprecation notes etc) to ease the migration for such MF projects? 🙏