From 6a9ef382bcdc3825b874fbbfbb9d291983365507 Mon Sep 17 00:00:00 2001
From: Adrien Hopkins <adrien.p.hopkins@gmail.com>
Date: Fri, 7 Nov 2025 11:34:24 -0500
Subject: Scroll messages to bottom when updated

---
 src/routes/(app)/dm/[recipient]/+page.svelte | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

(limited to 'src')

diff --git a/src/routes/(app)/dm/[recipient]/+page.svelte b/src/routes/(app)/dm/[recipient]/+page.svelte
index 0f232256..c64df7f7 100644
--- a/src/routes/(app)/dm/[recipient]/+page.svelte
+++ b/src/routes/(app)/dm/[recipient]/+page.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+ import { tick } from "svelte";
  import Icon from "$comp/Icon.svelte";
  import { hexToBytes, bytesToHex } from '@noble/hashes/utils';
  import * as toolsnip17 from 'nostr-tools/nip17';
@@ -96,6 +97,10 @@
 
    dates = Array.from(messageRumours.keys());
    dates.sort((d1, d2) => d1 - d2);
+
+   await tick();
+   const messages = document.getElementById("messages");
+   messages.scrollTop = messages.scrollHeight;
  }
 
  getPreferredRelays(user.pubkey).then((relays) => {
@@ -194,7 +199,7 @@
         >{$t("dm.header")}</h1>
         <p>{$t("dm.recipientMsg").replace("[R]", recipient.username)}</p>
 
-        <div id="messages" style="overflow-y: scroll; max-height: 800px;">
+        <div id="messages" style="overflow-y: scroll; max-height: 400px;">
         {#each dates as day}
             <p>[{new Date(day * 86400 * 1000).toDateString()}]</p>
             <ul>
-- 
cgit v1.2.3