From 4ea0bdcb8583a83176b69687c2ffbf842b165e0c Mon Sep 17 00:00:00 2001
From: Vitaliy Filippov <vitalif@yourcmc.ru>
Date: Wed, 5 Oct 2016 13:52:02 +0300
Subject: [PATCH] Fix message display for new DB structure, show message flags

---
 MessageList.js | 17 ++++++++++++-----
 MessageView.js | 25 ++++++++++++++++++-------
 Util.js        |  2 +-
 3 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/MessageList.js b/MessageList.js
index 57bd438..71b10af 100644
--- a/MessageList.js
+++ b/MessageList.js
@@ -6,20 +6,27 @@ const StoreListener = require('./StoreListener.js');
 const Util = require('./Util.js');
 
 var MessageInList = React.createClass({
-    msgClasses: [ 'unread', 'unseen', 'replied', 'pinned', 'sent', 'unloaded' ],
+    msgClasses: { unread: 'unread', unseen: 'unseen', answered: 'replied', flagged: 'pinned', sent: 'sent' },
     render: function()
     {
         var msg = this.props.msg;
-        return <div data-i={this.props.i} className={'message'+(this.msgClasses.map(c => (msg[c] ? ' '+c : '')).join(''))+
-            (this.props.selected ? ' selected' : '')+(msg.thread && this.props.threads ? ' thread0' : '')} onMouseDown={this.props.onClick}>
+        return <div data-i={this.props.i} className={'message'+
+            (msg.body_text || msg.body_html ? '' : ' unloaded')+
+            (msg.flags.map(c => (this.msgClasses[c] ? ' '+this.msgClasses[c] : '')).join(''))+
+            (this.props.selected ? ' selected' : '')+
+            (msg.thread && this.props.threads ? ' thread0' : '')} onMouseDown={this.props.onClick}>
+
             <div className="icon" style={{ width: (20+10*(msg.level||0)), backgroundPosition: (10*(msg.level||0))+'px 7px' }}></div>
             <div className="subject" style={{ paddingLeft: (20+10*(msg.level||0)) }}>{msg.subject}</div>
             {msg.thread && this.props.threads ? <div className={'expand'+(msg.collapsed ? '' : ' collapse')}></div> : null}
             <div className="bullet"></div>
-            <div className="from" style={{ left: (21+10*(msg.level||0)) }}>{(msg.sent || msg.outgoing ? 'To '+(msg.to_name||msg.to_email) : (msg.from_name||msg.from_email))}</div>
+            <div className="from" style={{ left: (21+10*(msg.level||0)) }}>
+                {(msg.props.sent ? 'To '+(msg.props.to[0][0]||msg.props.to[0][1]) : (msg.props.from ? msg.props.from[0]||msg.props.from[1] : ''))}
+            </div>
             <div className="size">{Util.formatBytes(msg.size||0)}</div>
-            <div className="attach" style={msg.attach ? null : { display: 'none' }}></div>
+            <div className="attach" style={msg.props.attachments && msg.props.attachments.length ? null : { display: 'none' }}></div>
             <div className="time">{Util.formatDate(msg.time)}</div>
+
         </div>
     }
 });
diff --git a/MessageView.js b/MessageView.js
index 17fe999..c7158e8 100644
--- a/MessageView.js
+++ b/MessageView.js
@@ -53,6 +53,7 @@ var MessageView = React.createClass({
                 });
             }
         }
+        // TODO list attachments
         return <div className={'message-view'+(!msg ? ' no-mail-shown' : '')+(!this.props.quickReply ? ' no-quick' : '')}>
             <div className="actions">
                 <DropDownButton dropdownId="reply" icon="mail_reply" text="Reply" />
@@ -82,24 +83,34 @@ var MessageView = React.createClass({
                 <div className="header-table">
                     <div className="header">
                         <div className="field">From</div>
-                        <div className="value"><a className="button">{msg.from_name+' <'+msg.from_email+'>'}</a></div>
+                        <div className="value"><a className="button">{msg.props.from ? msg.props.from[0]+' <'+msg.props.from[1]+'>' : 'unknown'}</a></div>
                     </div>
                     <div className="header">
                         <div className="field">To</div>
-                        <div className="value"><a className="button">{msg.to_list}</a></div>
+                        <div className="value">
+                            {msg.props.to.map(a => <a className="button" title={a[0] ? a[0]+' <'+a[1]+'>' : a[1]}>{a[0] || a[1]}</a>)}
+                        </div>
                     </div>
-                    {msg.cc_list ?
+                    {msg.props.cc.length ?
                     <div className="header">
                         <div className="field">Cc</div>
                         <div className="value">
-                            {[ msg.cc_list ].map(cc => <a className="button">{cc}</a>)}
+                            {msg.props.cc.map(a => <a className="button" title={a[0] ? a[0]+' <'+a[1]+'>' : a[1]}>{a[0] || a[1]}</a>)}
                         </div>
                     </div>
                     : null}
-                    {msg.replyto_email ?
+                    {msg.props.bcc.length ?
+                    <div className="header">
+                        <div className="field">Bcc</div>
+                        <div className="value">
+                            {msg.props.bcc.map(a => <a className="button" title={a[0] ? a[0]+' <'+a[1]+'>' : a[1]}>{a[0] || a[1]}</a>)}
+                        </div>
+                    </div>
+                    : null}
+                    {msg.props.replyto ?
                     <div className="header">
                         <div className="field">Reply-to</div>
-                        <div className="value"><a className="button">{msg.replyto_name+' <'+msg.replyto_email+'>'}</a></div>
+                        <div className="value"><a className="button">{msg.props.replyto[0]+' <'+msg.props.replyto[1]+'>'}</a></div>
                     </div>
                     : null}
                 </div>
@@ -108,7 +119,7 @@ var MessageView = React.createClass({
                 ? <div className="blocked-images">
                     <img src="icons/block.png" /> This message contains blocked images.
                     <a className="button raised" onClick={this.showImages}>Load Images</a>
-                    <label><input type="checkbox" /> Always load from {msg.from_email}</label>
+                    {(msg.props.from ? <label><input type="checkbox" /> Always load from {msg.props.from[1]}</label> : null)}
                 </div>
                 : null),
             (html
diff --git a/Util.js b/Util.js
index b891017..2422467 100644
--- a/Util.js
+++ b/Util.js
@@ -25,7 +25,7 @@ module.exports.formatDate = function(dt)
     {
         var d = dt.getDate();
         var m = dt.getMonth()+1;
-        return (d < 10 ? '0' : '')+d+' '+(m < 10 ? '0' : '')+m+' '+dt.getFullYear();
+        return (d < 10 ? '0' : '')+d+'.'+(m < 10 ? '0' : '')+m+'.'+dt.getFullYear();
     }
     else if (dt.getTime() < tod.getTime())
     {