From 5f4445aaecdadc686f0690d8e2d382fc8f7ca7d6 Mon Sep 17 00:00:00 2001
From: William Casarin <jb55@jb55.com>
Date: Fri, 4 Nov 2022 15:48:02 -0700
Subject: [PATCH] web: show chatroom names in chatroom replies

---
 webv2/damus.css  |  5 +++++
 webv2/damus.js   | 50 ++++++++++++++++++++++++++++++++++++++++++------
 webv2/index.html |  4 ++--
 webv2/nostr.js   |  2 +-
 4 files changed, 52 insertions(+), 9 deletions(-)

diff --git a/webv2/damus.css b/webv2/damus.css
index 528d44b..96c0800 100644
--- a/webv2/damus.css
+++ b/webv2/damus.css
@@ -24,6 +24,11 @@
 	width: 100%;
 }
 
+.chatroom-name {
+	color: orange;
+	font-weight: bold;
+}
+
 .line-top {
 	width: 2px;
 	height: 5px;
diff --git a/webv2/damus.js b/webv2/damus.js
index 2ed9440..6463b1b 100644
--- a/webv2/damus.js
+++ b/webv2/damus.js
@@ -43,6 +43,7 @@ function init_home_model() {
 		expanded: new Set(),
 		reactions_to: {},
 		events: [],
+		chatrooms: {},
 		profiles: {},
 		profile_events: {},
 		last_event_of_kind: {},
@@ -82,6 +83,12 @@ function update_title(model) {
 	}
 }
 
+function notice_chatroom(state, id)
+{
+	if (!state.chatrooms[id])
+		state.chatrooms[id] = {}
+}
+
 async function damus_web_init()
 {
 	const model = init_home_model()
@@ -159,6 +166,16 @@ function process_reaction_event(model, ev)
 	}
 }
 
+function process_chatroom_event(model, ev)
+{
+	try {
+		log_debug("processing chatroom event", ev)
+		model.chatrooms[ev.id] = JSON.parse(ev.content)
+	} catch (err) {
+		log_debug("error processing chatroom creation event", ev, err)
+	}
+}
+
 function process_event(model, ev)
 {
 	ev.refs = determine_event_refs(ev.tags)
@@ -167,6 +184,10 @@ function process_event(model, ev)
 
 	if (ev.kind === 7)
 		process_reaction_event(model, ev)
+	else if (ev.kind === 42 && ev.refs && ev.refs.root)
+		notice_chatroom(model, ev.refs.root)
+	else if (ev.kind === 40)
+		process_chatroom_event(model, ev)
 
 	const last_notified = get_local_state('last_notified_date')
 	if (notified && (last_notified == null || ((ev.created_at*1000) > last_notified))) {
@@ -200,10 +221,10 @@ function should_add_to_home(ev)
 let rerender_home_timer
 function handle_home_event(ids, model, relay, sub_id, ev) {
 	model.all_events[ev.id] = ev
+	process_event(model, ev)
 
 	switch (sub_id) {
 	case ids.home:
-		process_event(model, ev)
 
 		if (should_add_to_home(ev))
 			insert_event_sorted(model.events, ev)
@@ -408,6 +429,17 @@ function debounce(f, interval) {
 	};
 }
 
+function get_unknown_chatroom_ids(state)
+{
+	let chatroom_ids = []
+	for (const key of Object.keys(state.chatrooms)) {
+		const chatroom = state.chatrooms[key]
+		if (chatroom.name === undefined)
+			chatroom_ids.push(key)
+	}
+	return chatroom_ids
+}
+
 // load profiles after comment notes are loaded
 function handle_comments_loaded(profiles_id, model, relay)
 {
@@ -417,10 +449,14 @@ function handle_comments_loaded(profiles_id, model, relay)
 	}, new Set())
 	const authors = Array.from(pubkeys)
 
-	// load profiles
-	const filter = {kinds: [0], authors: authors}
+	// load profiles and noticed chatrooms
+	const chatroom_ids = get_unknown_chatroom_ids(model)
+	const profile_filter = {kinds: [0], authors: authors}
+	const chatroom_filter = {kinds: [40], ids: chatroom_ids}
+	const filters = [profile_filter, chatroom_filter]
+
 	//console.log("subscribe", profiles_id, filter, relay)
-	model.pool.subscribe(profiles_id, filter, relay)
+	model.pool.subscribe(profiles_id, filters, relay)
 }
 
 function redraw_events(model) {
@@ -598,11 +634,13 @@ function render_replied_events(model, ev, opts)
 }
 
 function render_replying_to_chat(model, ev) {
-	const roomid = ev.refs.root || "??"
+	const chatroom = (ev.refs.root && model.chatrooms[ev.refs.root]) || {}
+	const roomname = chatroom.name || ev.refs.root || "??"
 	const pks = ev.refs.pubkeys || []
 	const names = pks.map(pk => render_mentioned_name(pk, model.profiles[pk])).join(", ")
 	const to_users = pks.length === 0 ? "" : ` to ${names}`
-	return `<div class="replying-to small-txt">replying${to_users} in ${roomid} chatroom</div>`
+
+	return `<div class="replying-to small-txt">replying${to_users} in <span class="chatroom-name">${roomname}</span></div>`
 }
 
 function render_replying_to(model, ev) {
diff --git a/webv2/index.html b/webv2/index.html
index ae928a3..8a4b2aa 100644
--- a/webv2/index.html
+++ b/webv2/index.html
@@ -6,7 +6,7 @@
 
         <title>Damus</title>
 
-        <link rel="stylesheet" href="damus.css?v=13">
+        <link rel="stylesheet" href="damus.css?v=14">
     </head>
     <body>
 	<section class="header">
@@ -41,7 +41,7 @@
     <script src="noble-secp256k1.js?v=1"></script>
     <script src="bech32.js?v=1"></script>
     <script src="nostr.js?v=6"></script>
-    <script src="damus.js?v=47"></script>
+    <script src="damus.js?v=48"></script>
     <script>
 	// I have to delay loading to wait for nos2x
 	const relay = setTimeout(damus_web_init, 100)
diff --git a/webv2/nostr.js b/webv2/nostr.js
index 57496c4..bfda995 100644
--- a/webv2/nostr.js
+++ b/webv2/nostr.js
@@ -254,7 +254,7 @@ function handle_nostr_message(relay, msg)
 	try {
 		data = JSON.parse(msg.data)
 	} catch (e) {
-		console.error("handle_nostr_message", e)
+		console.error("handle_nostr_message", msg, e)
 		return
 	}
 	if (data.length >= 2) {