From c936585174328e42c121ce1f202f009eea5db9bd Mon Sep 17 00:00:00 2001
From: ekko <152005280+EKKOLearnAI@users.noreply.github.com>
Date: Sun, 26 Apr 2026 13:59:01 +0800
Subject: [PATCH] chore: bump version to 0.4.9 and remove session switch
 transition overlay (#235)

- Remove isTransitioning overlay that caused white screen on session switch
- Simplify scroll logic: just scrollToBottom() on session change
- Remove changelog entry for removed transition feature

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
---
 package.json                                  |  2 +-
 .../components/hermes/chat/MessageList.vue    | 66 ++-----------------
 packages/client/src/data/changelog.ts         |  4 +-
 3 files changed, 7 insertions(+), 65 deletions(-)

diff --git a/package.json b/package.json
index 24091cf..ed3b213 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "hermes-web-ui",
-  "version": "0.4.8",
+  "version": "0.4.9",
   "description": "Self-hosted AI chat dashboard for Hermes Agent — multi-model (Claude, GPT, Gemini, DeepSeek) web UI with Telegram, Discord, Slack, WhatsApp integration",
   "repository": {
     "type": "git",
diff --git a/packages/client/src/components/hermes/chat/MessageList.vue b/packages/client/src/components/hermes/chat/MessageList.vue
index ef8721d..e3f02fe 100644
--- a/packages/client/src/components/hermes/chat/MessageList.vue
+++ b/packages/client/src/components/hermes/chat/MessageList.vue
@@ -11,8 +11,6 @@ const chatStore = useChatStore();
 const { t } = useI18n();
 const { isDark } = useTheme();
 const listRef = ref<HTMLElement>();
-const isTransitioning = ref(false);
-let transitionTimer: ReturnType<typeof setTimeout> | null = null;
 
 const displayMessages = computed(() =>
   chatStore.messages.filter((m) => m.role !== "tool"),
@@ -56,61 +54,20 @@ function scrollToMessage(messageId: string) {
   });
 }
 
-// Scroll to bottom once when messages are first loaded after session switch
-let pendingScrollToBottom = false
-let isInitialLoad = true
-
-function showTransition(): void {
-  if (isInitialLoad) return
-  if (transitionTimer) clearTimeout(transitionTimer)
-  isTransitioning.value = true
-}
-
-function hideTransition(): void {
-  if (transitionTimer) clearTimeout(transitionTimer)
-  transitionTimer = setTimeout(() => {
-    isTransitioning.value = false
-    transitionTimer = null
-  }, 100)
-}
-
+// Scroll to bottom on session switch
 watch(
   () => chatStore.activeSessionId,
   (id) => {
     if (!id) return;
-    if (isInitialLoad) {
-      isInitialLoad = false
-      if (!chatStore.focusMessageId) {
-        nextTick(() => scrollToBottom())
-      } else {
-        nextTick(() => scrollToMessage(chatStore.focusMessageId!))
-      }
-      return;
-    }
     if (chatStore.focusMessageId) {
       nextTick(() => scrollToMessage(chatStore.focusMessageId!));
       return;
     }
-    pendingScrollToBottom = true
-    showTransition()
+    nextTick(() => scrollToBottom());
   },
   { immediate: true },
 );
 
-// Safety: ensure overlay is always removed once messages load
-watch(
-  () => chatStore.messages.length,
-  () => {
-    if (pendingScrollToBottom && chatStore.messages.length > 0) {
-      pendingScrollToBottom = false
-      setTimeout(() => {
-        scrollToBottom()
-        hideTransition()
-      }, 300)
-    }
-  },
-);
-
 watch(
   () => chatStore.focusMessageId,
   (messageId) => {
@@ -135,15 +92,6 @@ watch(
       scrollToMessage(chatStore.focusMessageId);
       return;
     }
-    if (pendingScrollToBottom) {
-      pendingScrollToBottom = false
-      // Wait a moment for mermaid diagrams to render, then reveal and scroll
-      setTimeout(() => {
-        scrollToBottom()
-        hideTransition()
-      }, 300)
-      return
-    }
     if (!isNearBottom()) return;
     scrollToBottom();
   },
@@ -159,8 +107,8 @@ watch(currentToolCalls, () => {
 </script>
 
 <template>
-  <div ref="listRef" class="message-list" :class="{ 'is-transitioning': isTransitioning }">
-    <div v-if="chatStore.messages.length === 0 && !isTransitioning" class="empty-state">
+  <div ref="listRef" class="message-list">
+    <div v-if="chatStore.messages.length === 0" class="empty-state">
       <img src="/logo.png" alt="Hermes" class="empty-logo" />
       <p>{{ t("chat.emptyState") }}</p>
     </div>
@@ -228,16 +176,10 @@ watch(currentToolCalls, () => {
   flex-direction: column;
   gap: 16px;
   background-color: $bg-card;
-  transition: opacity 0.15s ease;
 
   .dark & {
     background-color: #333333;
   }
-
-  &.is-transitioning {
-    opacity: 0;
-    pointer-events: none;
-  }
 }
 
 .empty-state {
diff --git a/packages/client/src/data/changelog.ts b/packages/client/src/data/changelog.ts
index 56a13ae..14e5cb5 100644
--- a/packages/client/src/data/changelog.ts
+++ b/packages/client/src/data/changelog.ts
@@ -6,9 +6,9 @@ export interface ChangelogEntry {
 
 export const changelog: ChangelogEntry[] = [
   {
-    version: '0.4.8',
+    version: '0.4.9',
     date: '2026-04-26',
-    changes: ['changelog.new_0_4_8_1', 'changelog.new_0_4_8_2', 'changelog.new_0_4_8_3', 'changelog.new_0_4_8_4', 'changelog.new_0_4_8_5', 'changelog.new_0_4_8_6', 'changelog.new_0_4_8_7', 'changelog.new_0_4_8_8', 'changelog.new_0_4_8_9', 'changelog.new_0_4_8_10'],
+    changes: ['changelog.new_0_4_8_1', 'changelog.new_0_4_8_2', 'changelog.new_0_4_8_3', 'changelog.new_0_4_8_4', 'changelog.new_0_4_8_5', 'changelog.new_0_4_8_7', 'changelog.new_0_4_8_8', 'changelog.new_0_4_8_9', 'changelog.new_0_4_8_10'],
   },
   {
     version: '0.4.7',