Flutter bloc doesn't showing UI as per proper state - flutter

Question

Am using flutter bloc library and maintaining simple process for as per library for state management. In this code I am getting the state as expected but UI is not updating, its always returning the default state ui which a circle spinner . I have checked the state using bloc observer too. So need to know that what I have done wrong and need suggestions on that.
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: buildAppBar(context),
body: Column(
children: [
BlocBuilder<UserManageCubit, UserManageState>(
builder: (context, state) {
if (state is Initial) {
return const Center(
child: CircularProgressIndicator(
color: Colors.red,
));
}
if (state is UserDetailFetched) {
Column(
children: <Widget>[
Text(
'${state.userDetails.name}'.toUpperCase(),
style: kNavyTextStyleNormal.copyWith(
fontSize: 18.sp,
),
),
Text(
'${state.userDetails.email}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
'${state.userDetails.phone}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
'Registered on ${DateTimeUtils.format(
DateTimeUtils.fromString(state.userDetails.createdAt!),
).split("-")[0]}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
color: go11ThemeGreen,
),
),
SizedBox(height: 16.h),
],
);
}
return CircularProgressIndicator(
color: Colors.amber,
);
},
),
],
),
);
}
Calling bloc
#override
void initState() {
BlocProvider.of<UserManageCubit>(context).getUserDetails(widget.userId);
super.initState();
}
#Cubit impl
UserManageCubit({required this.userManageRepo})
: super(const UserManageState.initial());
void getUserDetails(int userId) async {
final FormData formData = FormData.fromMap({
'user_id': userId,
});
final Either<Failure, UserDetailsResponse> userDetailResponseEither =
await userManageRepo.getUserDetails(formData);
emit(const UserManageState.loading());
userDetailResponseEither.fold(
(failure) => {
emit(
UserManageState.loadFailure(
errorObject:
ErrorObject.mapFailureToErrorObject(failure: failure),
),
)
},
(response) => {
emit(
UserManageState.userDetailFetched(
userDetails: response.userDetails),
),
});
}
#state class
#freezed
class UserManageState with _$UserManageState {
const factory UserManageState.initial() = Initial;
const factory UserManageState.loading() = Loading;
const factory UserManageState.loadFailure({
required ErrorObject errorObject,
}) = LoadFailure;
const factory UserManageState.userDetailFetched(
{required UserDetails userDetails,
#Default(0) int currentDocType,
#Default(0) int currentCancelType}) = UserDetailFetched;
}

Answer 1

You are not returning your column
if (state is UserDetailFetched) {
return Column(
children: <Widget>[
Text(
'${state.userDetails.name}'.toUpperCase(),
style: kNavyTextStyleNormal.copyWith(
fontSize: 18.sp,
),
),
Text(
'${state.userDetails.email}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
'${state.userDetails.phone}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
),
),
Text(
'Registered on ${DateTimeUtils.format(
DateTimeUtils.fromString(state.userDetails.createdAt!),
).split("-")[0]}',
style: kNavyTextStyleNormal.copyWith(
fontWeight: FontWeight.bold,
color: go11ThemeGreen,
),
),
SizedBox(height: 16.h),
],
);
}