From c83a7b5dbf74ecf82d3f11c47eaef915c2bfc808 Mon Sep 17 00:00:00 2001
From: leafyzito <rafaelzao2003@gmail.com>
Date: Wed, 6 May 2026 15:28:39 +0000
Subject: [PATCH 1/2] feat(logs, firehose): clickable usernames to open monthly
 logs

---
 src/routes/firehose/+page.svelte | 20 ++++++++++++++++++--
 src/routes/logs/+page.svelte     | 27 +++++++++++++++++++++++++--
 2 files changed, 43 insertions(+), 4 deletions(-)

diff --git a/src/routes/firehose/+page.svelte b/src/routes/firehose/+page.svelte
index 1d25d15..4690920 100644
--- a/src/routes/firehose/+page.svelte
+++ b/src/routes/firehose/+page.svelte
@@ -71,6 +71,16 @@
 	let instanceValue = $state("");
 	let searchValue = $state("");
 
+	const openMonthlyUserLogs = async (msg: Message) => {
+		const c = (msg.channel || "").trim();
+		const userId = msg.tags?.["user-id"];
+		const u = (userId ? `id:${userId}` : msg.displayName || "").trim();
+		if (!c || !u) return;
+
+		const d = new Date(msg.timestamp).toISOString().slice(0, 7); // YYYY-MM
+		await goto(`/logs?c=${encodeURIComponent(c)}&u=${encodeURIComponent(u)}&d=${encodeURIComponent(d)}`, { keepFocus: true });
+	};
+
 	onMount(() => {
 		fetchGlobalBadges();
 		fetchGlobalEmotes();
@@ -374,9 +384,15 @@
 							</span>
 						{/if}
 						<span class="h-5">
-							<span class:hidden={msg.tags["target-user-id"]} style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})" class="font-bold">
+							<button
+								type="button"
+								class:hidden={msg.tags["target-user-id"]}
+								class="font-bold hover:underline"
+								style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})"
+								onclick={() => openMonthlyUserLogs(msg)}
+							>
 								{msg.displayName}:
-							</span>
+							</button>
 							<span class={[msg.tags["target-user-id"] && "text-neutral-500"]}>
 								{#key emoteUpdates}
 									{#each parseMessage(msg) as { type: Component, props }, index (index)}
diff --git a/src/routes/logs/+page.svelte b/src/routes/logs/+page.svelte
index 7b98c3d..a5b5e70 100644
--- a/src/routes/logs/+page.svelte
+++ b/src/routes/logs/+page.svelte
@@ -413,6 +413,24 @@
 		else return `${channelType}/${encodeURIComponent(channel)}${user ? `/${userType}/${encodeURIComponent(user)}` : ""}`;
 	};
 
+	const openMonthlyUserLogs = async (msg: Message) => {
+		const c = (channelName || msg.channel || "").trim();
+		const userId = msg.tags?.["user-id"];
+		const u = (userId ? `id:${userId}` : msg.displayName || "").trim();
+		if (!c || !u) return;
+
+		const d = new Date(msg.timestamp).toISOString().slice(0, 7); // YYYY-MM
+		untrack(() => {
+			inputChannelName = c;
+			channelName = c;
+			inputUserName = u;
+			userName = u;
+			dateValue = d;
+		});
+
+		await goto(`/logs?c=${encodeURIComponent(c)}&u=${encodeURIComponent(u)}&d=${encodeURIComponent(d)}`, { keepFocus: true });
+	};
+
 	const fetchChannelStats = async () => {
 		if (!channelName) return;
 
@@ -1192,9 +1210,14 @@
 										{msg.text}
 									</span>
 								{:else}
-									<span style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})" class="font-bold">
+									<button
+										type="button"
+										class="font-bold hover:underline"
+										style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})"
+										onclick={() => openMonthlyUserLogs(msg)}
+									>
 										{msg.displayName}:
-									</span>
+									</button>
 									<span>
 										{#key emoteUpdates}
 											{#each parseMessage(msg) as { type: Component, props }, index (index)}

From da323357ed1770d0486b0707b420f53107ef4998 Mon Sep 17 00:00:00 2001
From: leafyzito <rafaelzao2003@gmail.com>
Date: Wed, 6 May 2026 22:06:15 +0000
Subject: [PATCH 2/2] simplify

---
 src/routes/firehose/+page.svelte | 32 +++++++++++---------------
 src/routes/logs/+page.svelte     | 39 ++++++++++++++------------------
 2 files changed, 30 insertions(+), 41 deletions(-)

diff --git a/src/routes/firehose/+page.svelte b/src/routes/firehose/+page.svelte
index 4690920..3001af3 100644
--- a/src/routes/firehose/+page.svelte
+++ b/src/routes/firehose/+page.svelte
@@ -71,16 +71,6 @@
 	let instanceValue = $state("");
 	let searchValue = $state("");
 
-	const openMonthlyUserLogs = async (msg: Message) => {
-		const c = (msg.channel || "").trim();
-		const userId = msg.tags?.["user-id"];
-		const u = (userId ? `id:${userId}` : msg.displayName || "").trim();
-		if (!c || !u) return;
-
-		const d = new Date(msg.timestamp).toISOString().slice(0, 7); // YYYY-MM
-		await goto(`/logs?c=${encodeURIComponent(c)}&u=${encodeURIComponent(u)}&d=${encodeURIComponent(d)}`, { keepFocus: true });
-	};
-
 	onMount(() => {
 		fetchGlobalBadges();
 		fetchGlobalEmotes();
@@ -384,15 +374,19 @@
 							</span>
 						{/if}
 						<span class="h-5">
-							<button
-								type="button"
-								class:hidden={msg.tags["target-user-id"]}
-								class="font-bold hover:underline"
-								style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})"
-								onclick={() => openMonthlyUserLogs(msg)}
-							>
-								{msg.displayName}:
-							</button>
+							{#if !msg.tags["target-user-id"]}
+								{@const c = (msg.channel || "").trim()}
+								{@const userId = msg.tags?.["user-id"]}
+								{@const u = (userId ? `id:${userId}` : msg.displayName || "").trim()}
+								{@const d = new Date(msg.timestamp).toISOString().slice(0, 7)}
+								<a
+									href="/logs?c={encodeURIComponent(c)}&u={encodeURIComponent(u)}&d={encodeURIComponent(d)}"
+									class="font-bold hover:underline"
+									style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})"
+								>
+									{msg.displayName}:
+								</a>
+							{/if}
 							<span class={[msg.tags["target-user-id"] && "text-neutral-500"]}>
 								{#key emoteUpdates}
 									{#each parseMessage(msg) as { type: Component, props }, index (index)}
diff --git a/src/routes/logs/+page.svelte b/src/routes/logs/+page.svelte
index a5b5e70..dfaa99d 100644
--- a/src/routes/logs/+page.svelte
+++ b/src/routes/logs/+page.svelte
@@ -413,24 +413,6 @@
 		else return `${channelType}/${encodeURIComponent(channel)}${user ? `/${userType}/${encodeURIComponent(user)}` : ""}`;
 	};
 
-	const openMonthlyUserLogs = async (msg: Message) => {
-		const c = (channelName || msg.channel || "").trim();
-		const userId = msg.tags?.["user-id"];
-		const u = (userId ? `id:${userId}` : msg.displayName || "").trim();
-		if (!c || !u) return;
-
-		const d = new Date(msg.timestamp).toISOString().slice(0, 7); // YYYY-MM
-		untrack(() => {
-			inputChannelName = c;
-			channelName = c;
-			inputUserName = u;
-			userName = u;
-			dateValue = d;
-		});
-
-		await goto(`/logs?c=${encodeURIComponent(c)}&u=${encodeURIComponent(u)}&d=${encodeURIComponent(d)}`, { keepFocus: true });
-	};
-
 	const fetchChannelStats = async () => {
 		if (!channelName) return;
 
@@ -1210,14 +1192,27 @@
 										{msg.text}
 									</span>
 								{:else}
-									<button
-										type="button"
+									<a
+										href={`/logs?c=${encodeURIComponent((channelName || msg.channel || "").trim())}&u=${encodeURIComponent(((msg.tags?.["user-id"] ? `id:${msg.tags["user-id"]}` : msg.displayName) || "").trim())}&d=${encodeURIComponent(new Date(msg.timestamp).toISOString().slice(0, 7))}`}
 										class="font-bold hover:underline"
 										style="color: hsl(from {msg.tags['color'] || 'gray'} h s {$mode === 'light' ? '40%' : '70%'})"
-										onclick={() => openMonthlyUserLogs(msg)}
+										onclick={(e) => {
+											e.preventDefault();
+
+											const href = e.currentTarget.getAttribute("href") || "";
+											const q = new URL(href, page.url).searchParams;
+
+											untrack(() => {
+												inputChannelName = channelName = q.get("c") || "";
+												inputUserName = userName = q.get("u") || "";
+												dateValue = q.get("d") || "";
+											});
+
+											goto(href, { keepFocus: true });
+										}}
 									>
 										{msg.displayName}:
-									</button>
+									</a>
 									<span>
 										{#key emoteUpdates}
 											{#each parseMessage(msg) as { type: Component, props }, index (index)}