Best practices for routing based on App State in flutter (navigator 2.0)

I am stuck on the Architecture design of my App. Assuming I have a Tristate (Error, Loading, Data), what is best practice in modern flutter (go_router, riverpod/provider, ...) for bringing this to life?

Two options:

• One page (so no routing) and complex widgets, one shown for each tristate. Statemanagement based on e.g. provider which triggers a rebuild when the state changes.
• Three pages (which allows for reuse based on e.g. different errors, data, etc) seems cleaner in design BUT now the router needs to decide based on what is happening in the Tristate

How can the three page way be implemented? A provider is not the way since this leads to all state being above the router, always. Further the loading page for example would need to navigate in the build method, which is only possible with hacks.

So while the three page design seems more clean to me (loading needs to know nothing about error needs to know nothing about data presentation) I feel like the implementation will not be clean in anyway.

How can the three page way be implemented? Or why should it not be? (Does anyone have some tips, pointers, articles or a best practice?)