ssb: Start to break out private messages by conversation. #125

apps/ssb/tf-tab-news.js

@@ -24,6 +24,7 @@ class TfTabNewsElement extends LitElement {
 			channels_latest: {type: Object},
 			connections: {type: Array},
 			private_messages: {type: Array},
+			grouped_private_messages: {type: Object},
 			recent_reactions: {type: Array},
 			peer_exchange: {type: Boolean},
 			is_administrator: {type: Boolean},
@@ -257,12 +258,26 @@ class TfTabNewsElement extends LitElement {
 					style=${this.hash == '#👍' ? 'font-weight: bold' : undefined}
 					>${this.unread_status('👍')}👍votes</a
 				>
-				<a
-					href="#🔐"
-					class="w3-bar-item w3-button"
-					style=${this.hash == '#🔐' ? 'font-weight: bold' : undefined}
-					>${this.unread_status('🔐')}🔐private</a
-				>
+				${Object.keys(this?.grouped_private_messages ?? [])?.map(
+					(key) => html`
+						<a
+							href=${'#🔐' + JSON.parse(key).join(',')}
+							class="w3-bar-item w3-button"
+							style=${this.hash == '#🔐' + JSON.parse(key).join(',')
+								? 'font-weight: bold'
+								: undefined}
+							>${(key != '[]' ? JSON.parse(key) : [this.whoami]).map(
+								(id) => html`
+									<tf-user
+										id=${id}
+										nolink="true"
+										.users=${this.users}
+									></tf-user>
+								`
+							)}</a
+						>
+					`
+				)}
 				${Object.keys(this.drafts)
 					.sort()
 					.map(
@@ -434,6 +449,7 @@ class TfTabNewsElement extends LitElement {
 						.channels_unread=${this.channels_unread}
 						.channels_latest=${this.channels_latest}
 						.private_messages=${this.private_messages}
+						.grouped_private_messages=${this.grouped_private_messages}
 						.recent_reactions=${this.recent_reactions}
 					></tf-tab-news-feed>
 				</div>