             else
                 div null,
                     #p null, @props.counterMessage
-                    ul className: 'list-unstyled',
-                        messages
+                    MessageListBody
+                        messages: @props.messages
+                        settings: @props.settings
+                        mailboxID: @props.mailboxID
+                        messageID: @props.messageID
+                        conversationID: @props.conversationID
+                        conversationLength: @props.conversationLength
+                        edited: @state.edited
+                        selected: @state.selected
+                        allSelected: @state.allSelected
+                        onSelect: (id, val) =>
+                            selected = _.clone @state.selected
+                            if val
+                                selected[id] = val
+                            else
+                                delete selected[id]
+                            if Object.keys(selected).length > 0
+                                @setState edited: true, selected: selected
+                            else
+                                @setState allSelected: false, edited: false, selected: {}
+
                     # If message list is filtered, we can't only rely on message count
                     # So we assume that if query.pageAfter is null, there's no more
                     # messages to display
-                    if @props.messages.count() < nbMessages and @props.query.pageAfter?
+                    if @props.messages.count() < parseInt(@props.counterMessage, 10) and @props.query.pageAfter?
                         p className: 'text-center',
                             if @props.fetching
                                 i className: "fa fa-refresh fa-spin"


module.exports = MessageList

MessageItem = React.createClass
    displayName: 'MessagesItem'

    mixins: [RouterMixin]

    shouldComponentUpdate: (nextProps, nextState) ->
        # we must do the comparison manually because the property "onSelect" is
        # a function (therefore it should not be compared)
        shouldUpdate =
            not _.isEqual(nextState, @state) \
            or not Immutable.is(nextProps.message, @props.message) \
            or not Immutable.is(nextProps.settings, @props.settings) \
            or nextProps.conversationLength isnt @props.conversationLength \
            or nextProps.key isnt @props.key \
            or nextProps.isActive isnt @props.isActive \
            or nextProps.edited isnt @props.edited \
            or nextProps.selected isnt @props.selected

        return shouldUpdate



    render: ->
        message = @props.message

    mixins: [RouterMixin]

    shouldComponentUpdate: (nextProps, nextState) ->
        should = not(_.isEqual(nextState, @state)) or not (_.isEqual(nextProps, @props))
        return should

    getInitialState: ->
        edited: false
