How to change state to previous state in bloc?-CodePudding

I have sigIn function that get data from Api and move to another screen if request is successful and if request is not successful then show alertDialog

I change state and before fetching data I show CircularProgressIndicator to make user know that data is fetching.

But when alertDialog window pops up and I close it then CircularProgressIndicator doesn't disappear. How to remove WaitingSignInAuth and show me Scaffold with inputs

When error comes then I emit ErrorSignInAuth but why there is WaitingSignInAuth to.. Why ErrorSignInAuth doesn't replace WaitingSignInAuth or it should work differently?

This is the code:

@override
Widget build(BuildContext context) {
    return BlocConsumer<AuthCubit, AuthState>(
      listener: (context, state) {
        if (state is WaitingSignInAuth) {
          showDialog(
              context: context,
              builder: (context) => Container(
                    width: MediaQuery.of(context).size.width,
                    height: MediaQuery.of(context).size.height,
                    color: Colors.black.withOpacity(0.6),
                    child: const Center(
                      child: CircularProgressIndicator(
                        strokeWidth: 1,
                        color: Colors.black,
                        backgroundColor: Colors.white,
                      ),
                    ),
                  ));
        }
        if (state is ErrorSignInAuth) {
          showDialog(
            context: context,
            builder: (BuildContext context) {
              return AlertDialog(
                title: Text("Bad request"),
                content: SingleChildScrollView(
                  child: ListBody(
                    children: <Widget>[
                      Text("Error")
                    ],
                  ),
                ),
                actions: <Widget>[
                  TextButton(
                    child: const Text("Close"),
                    onPressed: () {
                      Navigator.pop(context); // If i press it then alertDialog diappears but not the loading circle
                    },
                  )
                ],
              );
            }
          );
        }
      },
    );
}

This is how it looks like:

CodePudding user response：

The issue is, that you showDialog() twice. First is shown when WaitingSignInAuth state is fired, and the second one when you receive ErrorSignInAuth.

So Navigator.pop(context); in the "error" alert dialog closes only the showDialog that you've triggered in if (state is ErrorSignInAuth), the second dialog, which contains progress indicator is still visible.

To easy fix it, you can change your code to:

TextButton(
  child: const Text("Close"),
  onPressed: () {
    Navigator.pop(context);
    Navigator.pop(context);
  },
)

But in my opinion thats not the best fix to your issue. IMO you don't need to show ProgressIndicator for WaitingSignInAuth in the dialog. Adjust your UI in the way, that the container with progress indicator will be displayed over it, but this doesn't need to be a dialog.