How to transfer data to the second screen?

I have such a task, when I click on the button, I have to send a request with parameters to the server (pass the ID), and open the second screen, on which I will display the data that came to me from the server. How to do it with bloc.

This is what my provider looks like on the first screen (the first one is for the first screen, the second one is for transferring data to the second screen) –

return MultiBlocProvider(
        providers: [
          BlocProvider<HomeCubit>(
            create: (context) => HomeCubit()..home(),
          ),
          BlocProvider<DetailsCubit>(
            create: (context) => DetailsCubit(),
          ),
        ],
        child: HomeBody()
    );

Data transfer to the second screen –

 await context.read<DetailsCubit>().details(plans.data[index].id);

And here is my second screen –

return BlocBuilder<DetailsCubit, DetailsState>(
      builder: (context, state) {

Tell me how to fix the error and what did I do wrong?

With this code – I get the following error – that I need a provider on my second screen, but why, because I provided on the first
Error text –

The following ProviderNotFoundException was thrown building Details(dependencies: [MediaQuery]):
Error: Could not find the correct Provider<DetailsCubit> above this BlocBuilder<DetailsCubit, DetailsState> Widget

This happens because you used a `BuildContext` that does not include the provider
of your choice. There are a few common scenarios:

- You added a new provider in your `main.dart` and performed a hot-reload.
  To fix, perform a hot-restart.

- The provider you are trying to read is in a different route.

  Providers are "scoped". So if you insert of provider inside a route, then
  other routes will not be able to access that provider.

- You used a `BuildContext` that is an ancestor of the provider you are trying to read.

  Make sure that BlocBuilder<DetailsCubit, DetailsState> is under your MultiProvider/Provider<DetailsCubit>.
  This usually happens when you are creating a provider and trying to read it immediately.

  For example, instead of:

  ```
  Widget build(BuildContext context) {
    return Provider<Example>(
      create: (_) => Example(),
      // Will throw a ProviderNotFoundError, because `context` is associated
      // to the widget that is the parent of `Provider<Example>`
      child: Text(context.watch<Example>().toString()),
    );
  }
  ```

  consider using `builder` like so:

  ```
  Widget build(BuildContext context) {
    return Provider<Example>(
      create: (_) => Example(),
      // we use `builder` to obtain a new `BuildContext` that has access to the provider
      builder: (context, child) {
        // No longer throws
        return Text(context.watch<Example>().toString());
      }
    );
  }

>Solution :

If you want your Blocs to be accessible from all screens, make your MaterialApp a child of MultiBlocProvider like this:

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MultiBlocProvider(
      providers: [
        BlocProvider<HomeCubit>(
          create: (context) => HomeCubit()..home(),
        ),
        BlocProvider<DetailsCubit>(
          create: (context) => DetailsCubit(),
        ),
      ],
      child: MaterialApp(
        home: HomeBody(),
      ),
    );
  }
}