NotifyListeners is not rebuilding Consumer Widget - flutter

Question

I am trying to build a chat application. but whenever i call a method to update the chat list
everything works, but the widget is not rebuilding.
i have tried with context.read() and context.watch() methods : Not working
i have tried with Provider.of(context,listen:true); : Not working
i have tried with ChangeNotifierProxyProvider : Not working
only restarting rebuilds the ui. any help would be appreciated.
below is my code.
void main() {
runApp(MultiProvider(providers: [
ChangeNotifierProvider(create: (context) => UsersProvider()),
ChangeNotifierProvider(create: (context) => ChatProvider()),
], child: const MyApp()));
}
class UsersProvider extends ChangeNotifier {
UsersProvider(){
getChats();
}
List<Chats> get chats=> _chats;
List<Chats> _chats = [];
Future getChats() async {
final json = await UsersRepo().getChatLists();
if (json == null) {
return;
}
if (json['status']) {
ChatListModel _model = ChatListModel.fromJson(json);
_chats = _model.chats ?? [];
notifyListeners();
}
}
}
and the ui looks like
class ChatList extends StatelessWidget {
const ChatList({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.appBg,
appBar: AppBar(
title: Text('Users'),
backgroundColor: AppColors.appBgLight,
),
body: chatListWidget(context),
);
}
Widget chatListWidget(BuildContext context) {
return Consumer<UsersProvider>(
builder: (BuildContext context, provider, Widget? child) {
return ListView.separated(
padding: EdgeInsets.symmetric(vertical: 20),
itemCount: provider.chats.length,
separatorBuilder: (c, i) => sbh(15),
itemBuilder: (c, i) {
Chats chat = provider.chats[i];
return ListTile(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (c) {
return ChatScreen(
user: Users(
name: chat.receiver?.name, sId: chat.receiver?.id),
);
},
),
);
context.read<ChatProvider>().connectToUser(chat.receiver?.id);
},
leading:
userImageWidget((chat.receiver?.name ?? "")[0].toUpperCase()),
subtitle: Text(
chat.lastMessage ?? "",
style: TextStyle(
color: Colors.white70,
fontSize: 12,
),
),
trailing: CircleAvatar(
radius: 15,
backgroundColor: Colors.green,
child: Center(
child: Text(
'${chat.unReadMessageCount}',
style: TextStyle(fontSize: 12, color: Colors.white),
)),
),
title: nameWidget(chat.receiver?.name ?? ''),
);
},
);
},
);
}
}
Chats model class
class Chats {
String? lastMessage;
String? messageTime;
int? unReadMessageCount;
Chats(
{this.lastMessage,
this.messageTime,
this.unReadMessageCount});
Chats.fromJson(Map<String, dynamic> json) {
lastMessage = json['lastMessage'];
messageTime = json['messageTime'];
unReadMessageCount = json['unReadMessageCount'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['lastMessage'] = this.lastMessage;
data['messageTime'] = this.messageTime;
data['unReadMessageCount'] = this.unReadMessageCount;
return data;
}
}

Answer 1

I suspect that your getChats() method is failing before it can execute the notifyListeners method.
You see, any "if" statement in dart has to evaluate to a boolean, so unless json['status'] returns true/false then the expression:
if (json['status'])
will throw an error that will end up in a failed future to be returned from your getChats() method.
It would be better to use a more specific condition for your if statement, maybe something like this (if json['status'] is supposed to contain the http response code for the call):
if (json['status'] == 200)
In the case json['status'] does indeed contains a boolean then there could be a few other reasons for your widget not rebuilding:
1- json['status'] always evaluates to false
2- The call to get the chats fails but you get a silent error since you don't have a handler for the failed future that is returned by the getChats method