Flutter/Dart/Firestore - Group documents by day in an AnimtedList - list

Question

How can I group messages between users by day? So far it just adds to the list and sorts it by day but I can't seem to add a gap between the messages that were sent in past days. The list is being displayed in an AnimatedList()
Code :
List<Message> _messages = [];
...
_initMessages() { // Being called in the initState
APIs().chats.messages(
chatID: widget.chat.chatID,
onEmpty: () {
if (mounted)
setState(() {
this._isLoading = false;
});
},
onAdded: (m) {
if (mounted)
setState(() {
if (m.type == 'Image') {
m.message = NetworkImage(m.message);
}
this._messages.add(m);
this._messages.sort((a, b) => a.createdAt.compareTo(b.createdAt));
if (mounted) this._listKey.currentState.insertItem(this._messages.length, duration: Duration(milliseconds: 500));
this._isLoading = false;
});
},
onModified: (m) {
int i = this._messages.indexWhere((message) => message.messageID == m.messageID);
if (mounted)
setState(() {
this._messages[i] = m;
this._messages.sort((a, b) => a.createdAt.compareTo(b.createdAt));
this._isLoading = false;
});
},
onRemoved: (m) {
int i = this._messages.indexWhere((message) => message.messageID == m.messageID);
if (mounted)
setState(() {
this._messages.removeAt(i);
this._messages.sort((a, b) => a.createdAt.compareTo(b.createdAt));
this._isLoading = false;
});
},
onFailure: (e) {
print(e);
});
}
It shows the messages in order but when I changed it to an AnimatedList it gives me an error:
[VERBOSE-2:ui_dart_state.cc(148)] Unhandled Exception: 'package:flutter/src/widgets/animated_list.dart': Failed assertion: line 279 pos 12: 'itemIndex >= 0 && itemIndex <= _itemsCount': is not true.
Kinda a two-part question, group the documents by day and try to get it to work in an AnimatedList. The date is of the Firestore Timestamp type.