How the future and exception handling work together in dart? - flutter

Question

I have a problem with exception handling, I build the product manager app in which I use firebase rest API to post the data to the server, And use the exception if by chance any error occur then redirect to the home screen. But if any error occurs then it will only show the loading spinner so what is the problem here and Also tell that how the exception and future work here?
If there is a problem in url then it will show the alert dialog and show error message and after that it will show loading spinner but according to the code after catchError it will return future then it means next then block content should run but that doesn't work so what is the behavior behind this?
The function which has post method
Future<void> addProduct(Product product) {
const url =
'';
return http
.post(
Uri.parse(url),
body: json.encode(
{
'title': product.title,
'description': product.description,
'price': product.price,
'imageUrl': product.imageUrl,
'isFavorite': product.isFavorite,
},
),
)
.then(
(response) {
final id = json.decode(response.body)['name'];
final newProduct = Product(
id: id,
title: product.title,
description: product.description,
price: product.price,
imageUrl: product.imageUrl,
);
_items.add(newProduct);
notifyListeners();
},
).catchError(
(error) {
print(error.toString());
throw error;
},
);
}
Code which is used in fronted
Provider.of<Products>(context, listen: false)
.addProduct(_editedProduct)
.catchError((error) {
return showDialog(
context: context,
builder: (ctx) {
return AlertDialog(
title: const Text('An Error Occured!!'),
content: const Text('Something went wrong'),
actions: [
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: const Text('Okay'),
)
],
);
});
}).then((_) {
setState(() {
_isLoding = false;
});
Navigator.of(context).pop();
});
}
}

Answer 1

the issue you mentioned is that the loading spinner is not being shown after the alert dialog is displayed. This is because the then block after catchError is not being executed. This is because the error is being re-thrown in the catchError block and not being caught by the catchError block in the front-end code. To fix this, you need to catch the error in the catchError block in the front-end code, for example by adding a try-catch statement around the call to addProduct.