diff --git a/app/internal_packages/message-list/lib/message-list.jsx b/app/internal_packages/message-list/lib/message-list.jsx index 71a20bc8c..ee7b569a6 100644 --- a/app/internal_packages/message-list/lib/message-list.jsx +++ b/app/internal_packages/message-list/lib/message-list.jsx @@ -238,11 +238,22 @@ class MessageList extends React.Component { _messageElements() { const {messagesExpandedState, currentThread} = this.state; - const elements = [] + const elements = []; + let lastMessageIdx; - const lastItem = this.state.messages[this.state.messages.length - 1]; + const descendingOrderMessageList = NylasEnv.config.get('core.reading.descendingOrderMessageList'); + let messages = this._messagesWithMinification(this.state.messages); + + // Check on whether to display items in descending order + if (descendingOrderMessageList) { + messages = messages.reverse(); + lastMessageIdx = 0; + } else { + lastMessageIdx = messages.length - 1; + } + + const lastItem = this.state.messages[descendingOrderMessageList ? 0 : this.state.messages.length - 1]; const hasReplyArea = lastItem && !lastItem.draft; - const messages = this._messagesWithMinification(this.state.messages) messages.forEach((message, idx) => { if (message.type === "minifiedBundle") { @@ -251,7 +262,7 @@ class MessageList extends React.Component { } const collapsed = !messagesExpandedState[message.id]; - const isLastItem = (messages.length - 1 === idx); + const isLastItem = (lastMessageIdx === idx); const isBeforeReplyArea = isLastItem && hasReplyArea; elements.push( @@ -268,7 +279,7 @@ class MessageList extends React.Component { /> ); }); - if (hasReplyArea) { + if (hasReplyArea && lastItem) { elements.push(this._renderReplyArea()); } return elements; diff --git a/app/internal_packages/message-list/styles/message-list.less b/app/internal_packages/message-list/styles/message-list.less index de6d6a61e..f0b1cde43 100644 --- a/app/internal_packages/message-list/styles/message-list.less +++ b/app/internal_packages/message-list/styles/message-list.less @@ -504,7 +504,7 @@ body.platform-win32 { overflow: hidden; max-width: @message-max-width; - margin: -3px auto 0 auto; + margin: -3px auto 10px auto; position: relative; z-index: 2; diff --git a/app/src/config-schema.es6 b/app/src/config-schema.es6 index d987544bc..039643c5f 100644 --- a/app/src/config-schema.es6 +++ b/app/src/config-schema.es6 @@ -94,6 +94,11 @@ export default { 'default': false, 'title': "Swipe gesture and backspace / delete move messages to trash", }, + descendingOrderMessageList: { + 'type': 'boolean', + 'default': false, + 'title': "Display conversations in descending chronological order", + }, }, }, composing: {