From 6b2a9e1dcad9956c700149d0f918781250016ee2 Mon Sep 17 00:00:00 2001
From: hadi <hnategh@gmail.com>
Date: Thu, 10 Aug 2023 17:47:36 +0200
Subject: [PATCH] Fix mail preview in mobile view no longer shows email
 addresses in its details box

---
 mail/js/app.js                 |  12 ++
 mail/templates/mobile/app.css  |  75 ++++++------
 mail/templates/mobile/app.less | 210 +++++++++++++++++----------------
 mail/templates/mobile/view.xet |  12 +-
 4 files changed, 167 insertions(+), 142 deletions(-)

diff --git a/mail/js/app.js b/mail/js/app.js
index 83b3c84dc7..15eec04900 100644
--- a/mail/js/app.js
+++ b/mail/js/app.js
@@ -5868,6 +5868,18 @@ app.classes.mail = AppJS.extend(
 		if (id){
 			content = egw.dataGetUIDdata(id);
 			content.data['toolbar'] = this.et2.getArrayMgr('sel_options').getEntry('toolbar');
+			if (content.data.toaddress||content.data.fromaddress)
+			{
+				content.data.additionaltoaddress = (content.data.additionaltoaddress??[]).concat(content.data.toaddress);
+				content.data.additionaltoaddress = 	content.data.additionaltoaddress.filter((i, item) => {
+					return content.data.additionaltoaddress.indexOf(i) == item
+				});
+				content.data.additionalfromaddress = (content.data.additionalfromaddress??[]).concat(content.data.fromaddress);
+				content.data.additionalfromaddress = content.data.additionalfromaddress.filter((i, item) => {
+					return content.data.additionalfromaddress.indexOf(i) == item
+				});
+			}
+
 			// Set default actions
 			for(var action in content.data['toolbar'])
 			{
diff --git a/mail/templates/mobile/app.css b/mail/templates/mobile/app.css
index fc18309b10..5a9bea6579 100644
--- a/mail/templates/mobile/app.css
+++ b/mail/templates/mobile/app.css
@@ -128,6 +128,9 @@
   body #popupMainDiv div#mail-view {
     height: 100%;
   }
+  body #popupMainDiv div#mail-view #mail-view_subject {
+    font-size: 12pt;
+  }
   body #popupMainDiv #mail-view_toaddressdetails {
     color: #26537c;
     float: right;
@@ -212,14 +215,14 @@
   #mail-index {
     margin-right: 0px;
   }
-  #mail-index table.egwGridView_outer tbody span.et2_date_ro.et2_label {
+  #mail-index span.et2_date_ro.et2_label {
     font-size: 9px;
   }
-  #mail-index table.egwGridView_outer tbody td {
+  #mail-index td {
     padding-top: 8px;
     padding-bottom: 8px;
   }
-  #mail-index table.egwGridView_outer tbody td a[id^='mail-index_'][id$='fromaddress]'] {
+  #mail-index td a[id^='mail-index_'][id$='fromaddress]'] {
     color: #373737;
     font-size: 12pt;
     overflow: hidden;
@@ -228,14 +231,14 @@
     width: 95%;
     display: inline-block;
   }
-  #mail-index table.egwGridView_outer tbody td span[id^='mail-index_'][id$='attachments]'] {
+  #mail-index td span[id^='mail-index_'][id$='attachments]'] {
     float: right;
   }
-  #mail-index table.egwGridView_outer tbody td span[id^='mail-index_'][id$='attachments]'] img {
+  #mail-index td span[id^='mail-index_'][id$='attachments]'] img {
     width: 16px;
     height: 16px;
   }
-  #mail-index table.egwGridView_outer tbody td span[id^='mail-index_'][id$='subject]'] {
+  #mail-index td et2-description[id^='mail-index_'][id$='subject]'] {
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
@@ -243,76 +246,76 @@
     font-size: 10pt;
     font-weight: normal !important;
   }
-  #mail-index table.egwGridView_outer tbody td label[id^='mail-index_'][id$='date]'] {
+  #mail-index td label[id^='mail-index_'][id$='date]'] {
     padding-top: 0;
   }
-  #mail-index table.egwGridView_outer tbody tr {
+  #mail-index tr {
     height: 55px;
   }
-  #mail-index table.egwGridView_outer tbody tr div.recent,
-  #mail-index table.egwGridView_outer tbody tr span.recent,
-  #mail-index table.egwGridView_outer tbody tr time.recent,
-  #mail-index table.egwGridView_outer tbody tr a.recent,
-  #mail-index table.egwGridView_outer tbody tr div.unseen,
-  #mail-index table.egwGridView_outer tbody tr span.unseen,
-  #mail-index table.egwGridView_outer tbody tr time.unseen,
-  #mail-index table.egwGridView_outer tbody tr a.unseen {
+  #mail-index tr div.recent,
+  #mail-index tr span.recent,
+  #mail-index tr time.recent,
+  #mail-index tr a.recent,
+  #mail-index tr div.unseen,
+  #mail-index tr span.unseen,
+  #mail-index tr time.unseen,
+  #mail-index tr a.unseen {
     color: black !important;
     font-weight: bold;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.mobile_cat_col {
+  #mail-index tr span.mail.mobile_cat_col {
     background: #F5F5F5;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.label1.mobile_cat_col {
+  #mail-index tr span.mail.label1.mobile_cat_col {
     background: #ff0080;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.label2.mobile_cat_col {
+  #mail-index tr span.mail.label2.mobile_cat_col {
     background: #ff8000;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.label3.mobile_cat_col {
+  #mail-index tr span.mail.label3.mobile_cat_col {
     background: #008000;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.label4.mobile_cat_col {
+  #mail-index tr span.mail.label4.mobile_cat_col {
     background: #0000ff;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.label5.mobile_cat_col {
+  #mail-index tr span.mail.label5.mobile_cat_col {
     background: #8000ff;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.flagged.mobile_cat_col {
+  #mail-index tr span.mail.flagged.mobile_cat_col {
     background: #ff0000;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.prio_high.mobile_cat_col {
+  #mail-index tr span.mail.prio_high.mobile_cat_col {
     background: #ac0000;
   }
-  #mail-index table.egwGridView_outer tbody tr span.mail.deleted.mobile_cat_col {
+  #mail-index tr span.mail.deleted.mobile_cat_col {
     background: silver;
     text-decoration: line-through;
   }
-  #mail-index table.egwGridView_outer tbody tr span.status_img {
+  #mail-index tr span.status_img {
     padding: 0 2px 2px 0;
   }
-  #mail-index table.egwGridView_outer tbody tr span.deleted.status_img {
+  #mail-index tr span.deleted.status_img {
     background-image: url(../default/images/kmmsgdel.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.unseen.status_img {
+  #mail-index tr span.unseen.status_img {
     background-image: url(../default/images/kmmsgunseen.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.flagged_seen.status_img {
+  #mail-index tr span.flagged_seen.status_img {
     background-image: url(../default/images/read_flagged_small.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.flagged_unseen.status_img {
+  #mail-index tr span.flagged_unseen.status_img {
     background-image: url(../default/images/unread_flagged_small.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.recent.status_img {
+  #mail-index tr span.recent.status_img {
     background-image: url(../default/images/kmmsgnew.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.replied.status_img {
+  #mail-index tr span.replied.status_img {
     background-image: url(../default/images/mail_reply.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.forwarded.status_img {
+  #mail-index tr span.forwarded.status_img {
     background-image: url(../default/images/mail_forward.svg);
   }
-  #mail-index table.egwGridView_outer tbody tr span.bodypreview {
+  #mail-index tr span.bodypreview {
     text-overflow: ellipsis;
     padding-left: 2px;
     font-style: normal;
@@ -347,4 +350,8 @@
   #mail-acl_grid .row {
     border-bottom: 1px solid silver;
   }
+  .mailPreviewHeaders et2-lavatar {
+    position: inherit;
+  }
 }
+/*# sourceMappingURL=app.css.map */
\ No newline at end of file
diff --git a/mail/templates/mobile/app.less b/mail/templates/mobile/app.less
index 7ea2918569..baec3d91f7 100644
--- a/mail/templates/mobile/app.less
+++ b/mail/templates/mobile/app.less
@@ -137,6 +137,10 @@
 			}
 			div#mail-view {
 				height: 100%;
+				#mail-view_subject
+				{
+					.mob-fontsize-l;
+				}
 			}
 			#mail-view_toaddressdetails {
 				color: #26537c;
@@ -220,115 +224,113 @@
 
 	#mail-index {
 		margin-right: 0px;
-		table.egwGridView_outer tbody {
-			span.et2_date_ro.et2_label {
-				font-size: 9px;
+		span.et2_date_ro.et2_label {
+			font-size: 9px;
+		}
+		td {
+			padding-top: 8px;
+			padding-bottom: 8px;
+			a[id^='mail-index_'][id$='fromaddress]']{
+				color:@gray_80;
+				.mob-fontsize-l;
+				overflow: hidden;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				width: 95%;
+				display: inline-block;
 			}
-			td {
-				padding-top: 8px;
-				padding-bottom: 8px;
-				a[id^='mail-index_'][id$='fromaddress]']{
-					color:@gray_80;
-					.mob-fontsize-l;
-					overflow: hidden;
-					white-space: nowrap;
-					text-overflow: ellipsis;
-					width: 95%;
-					display: inline-block;
-				}
-				span[id^='mail-index_'][id$='attachments]'] {
-					float: right;
-					img {
-						width: 16px;
-						height: 16px;
-					}
-				}
-				span[id^='mail-index_'][id$='subject]'] {
-					overflow: hidden;
-					white-space: nowrap;
-					text-overflow: ellipsis;
-					width: 95%;
-					.mob-fontsize-n;
-					font-weight: normal !important;
-				}
-				label[id^='mail-index_'][id$='date]']{
-					padding-top: 0;
+			span[id^='mail-index_'][id$='attachments]'] {
+				float: right;
+				img {
+					width: 16px;
+					height: 16px;
 				}
 			}
-			tr{
-				height:55px;
-				div.recent ,
-				span.recent ,
-				time.recent ,
-				a.recent,
-				div.unseen ,
-				span.unseen ,
-				time.unseen ,
-				a.unseen  {
-					color: black !important;
-					font-weight: bold;
-				}
-				span.mail.mobile_cat_col {
-					background: #F5F5F5;
-				}
-				span.mail.label1.mobile_cat_col  {
-					background: #ff0080;
-				}
-				span.mail.label2.mobile_cat_col{
-					background: #ff8000;
-				}
-				span.mail.label3.mobile_cat_col {
-					background: #008000;
-				}
-				span.mail.label4.mobile_cat_col {
-					background: #0000ff;
-				}
-				span.mail.label5.mobile_cat_col {
-					background: #8000ff;
-				}
+			et2-description[id^='mail-index_'][id$='subject]'] {
+				overflow: hidden;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				width: 95%;
+				.mob-fontsize-n;
+				font-weight: normal !important;
+			}
+			label[id^='mail-index_'][id$='date]']{
+				padding-top: 0;
+			}
+		}
+		tr{
+			height:55px;
+			div.recent ,
+			span.recent ,
+			time.recent ,
+			a.recent,
+			div.unseen ,
+			span.unseen ,
+			time.unseen ,
+			a.unseen  {
+				color: black !important;
+				font-weight: bold;
+			}
+			span.mail.mobile_cat_col {
+				background: #F5F5F5;
+			}
+			span.mail.label1.mobile_cat_col  {
+				background: #ff0080;
+			}
+			span.mail.label2.mobile_cat_col{
+				background: #ff8000;
+			}
+			span.mail.label3.mobile_cat_col {
+				background: #008000;
+			}
+			span.mail.label4.mobile_cat_col {
+				background: #0000ff;
+			}
+			span.mail.label5.mobile_cat_col {
+				background: #8000ff;
+			}
 
-				span.mail.flagged.mobile_cat_col  {
-					background: #ff0000;
-				}
+			span.mail.flagged.mobile_cat_col  {
+				background: #ff0000;
+			}
 
-				span.mail.prio_high.mobile_cat_col {
-					background: #ac0000;
-				}
+			span.mail.prio_high.mobile_cat_col {
+				background: #ac0000;
+			}
 
-				span.mail.deleted.mobile_cat_col {
-					background: silver;
-					text-decoration : line-through;
-				}
-				span.status_img {
-					padding:0 2px 2px 0;
-				}
-				span.deleted.status_img {
-					background-image: url(../default/images/kmmsgdel.svg);
-				}
-				span.unseen.status_img {
-					background-image: url(../default/images/kmmsgunseen.svg);
-				}
-				span.flagged_seen.status_img {
-					background-image: url(../default/images/read_flagged_small.svg);
-				}
-				span.flagged_unseen.status_img {
-					background-image: url(../default/images/unread_flagged_small.svg);
-				}
-				span.recent.status_img {
-					background-image: url(../default/images/kmmsgnew.svg);
-				}
-				span.replied.status_img {
-					background-image: url(../default/images/mail_reply.svg);
-				}
-				span.forwarded.status_img {
-					background-image: url(../default/images/mail_forward.svg);
-				}
-				span.bodypreview {
-					text-overflow: ellipsis;
-					padding-left: 2px;
-					font-style: normal;
-					.mob-fontsize-n;
-				}
+			span.mail.deleted.mobile_cat_col {
+				background: silver;
+				text-decoration : line-through;
+			}
+			span.status_img {
+				padding:0 2px 2px 0;
+			}
+			span.deleted.status_img {
+				background-image: url(../default/images/kmmsgdel.svg);
+			}
+			span.unseen.status_img {
+				background-image: url(../default/images/kmmsgunseen.svg);
+			}
+			span.flagged_seen.status_img {
+				background-image: url(../default/images/read_flagged_small.svg);
+			}
+			span.flagged_unseen.status_img {
+				background-image: url(../default/images/unread_flagged_small.svg);
+			}
+			span.recent.status_img {
+				background-image: url(../default/images/kmmsgnew.svg);
+			}
+			span.replied.status_img {
+				background-image: url(../default/images/mail_reply.svg);
+			}
+			span.forwarded.status_img {
+				background-image: url(../default/images/mail_forward.svg);
+			}
+			span.bodypreview {
+				text-overflow: ellipsis;
+				padding-left: 2px;
+				font-style: normal;
+				.mob-fontsize-n;
 			}
 		}
 		.mail-index_quotabox {
@@ -359,5 +361,5 @@
 	#mail-acl_grid {
 		.row{border-bottom: 1px solid silver;}
 	}
-
+	.mailPreviewHeaders et2-lavatar {position: inherit}
 }
\ No newline at end of file
diff --git a/mail/templates/mobile/view.xet b/mail/templates/mobile/view.xet
index 638a8139c6..a2d4247293 100644
--- a/mail/templates/mobile/view.xet
+++ b/mail/templates/mobile/view.xet
@@ -17,22 +17,26 @@
 				</et2-hbox>
 			</et2-hbox>
 			<et2-hbox  width="100%" class="mailPreviewHeaders">
-				<et2-lavatar  src="@avatar" lname="@address" shape="rounded" size="2.75em"></et2-lavatar>
+				<et2-lavatar  contactId="email:$cont[fromaddress]" lname="$cont[fromlavatar][lname]" fname="$cont[fromlavatar][fname]" shape="rounded" size="2.75em"></et2-lavatar>
 				<et2-vbox>
 					<et2-hbox>
 						<et2-details  class="details" toggleOnHover="true" hoist="true" toggleAlign="left">
 							<et2-select-email  slot="summary" id="fromaddress" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"/>
 							<et2-hbox>
 								<et2-description  value="From" class="firstColumnTitle"></et2-description>
-								<et2-select-email  id="additionalfromaddress" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
+								<et2-select-email  id="additionalfromaddress"  rows="1" multiple="true" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
 							</et2-hbox>
 							<et2-hbox  disabled="!@toaddress" width="100%">
 								<et2-description  value="To" class="firstColumnTitle"></et2-description>
-								<et2-select-email  id="additionaltoaddress" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
+								<et2-select-email  id="additionaltoaddress" rows="1" multiple="true" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
 							</et2-hbox>
 							<et2-hbox  disabled="!@ccaddress" width="100%">
 								<et2-description  value="Cc" class="firstColumnTitle"></et2-description>
-								<et2-select-email  id="ccaddress" readonly="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
+								<et2-select-email  id="ccaddress" readonly="true" rows="1" multiple="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
+							</et2-hbox>
+							<et2-hbox  disabled="!@bccaddress" width="100%">
+								<et2-description  value="BCc" class="firstColumnTitle"></et2-description>
+								<et2-select-email  id="bccaddress" readonly="true" rows="1" multiple="true" fullEmail="@emailTag=fullemail" onlyEmail="@emailTag=onlyemail"></et2-select-email>
 							</et2-hbox>
 						</et2-details>
 						<et2-date-time-today  align="right" id="date" readonly="true"></et2-date-time-today>