From 6f8e62fa9c8782d9ae39c93704134095fa8c98fa Mon Sep 17 00:00:00 2001
From: wxiaoguang <wxiaoguang@gmail.com>
Date: Tue, 11 Mar 2025 23:16:33 +0800
Subject: [PATCH] Fix some UI problems for 1.23 (#33856)

Partially backport #32927 #33851
---
 web_src/css/modules/navbar.css   | 4 ++++
 web_src/js/features/repo-diff.ts | 5 ++++-
 web_src/js/globals.d.ts          | 1 +
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/web_src/css/modules/navbar.css b/web_src/css/modules/navbar.css
index 1137e46c7f..545ebf5c03 100644
--- a/web_src/css/modules/navbar.css
+++ b/web_src/css/modules/navbar.css
@@ -57,6 +57,10 @@
   margin-right: 0;
 }
 
+#navbar .item.active {
+  background: var(--color-active);
+}
+
 @media (max-width: 767.98px) {
   #navbar {
     align-items: stretch;
diff --git a/web_src/js/features/repo-diff.ts b/web_src/js/features/repo-diff.ts
index 58e0d88092..89bf7f4cdf 100644
--- a/web_src/js/features/repo-diff.ts
+++ b/web_src/js/features/repo-diff.ts
@@ -221,7 +221,10 @@ function initRepoDiffShowMore() {
       if (!resp) {
         return;
       }
-      $target.parent().replaceWith($(resp).find('#diff-file-boxes .diff-file-body .file-body').children());
+      const $respFileBody = $(resp).find('#diff-file-boxes .diff-file-body .file-body');
+      const respFileBodyChildren = Array.from($respFileBody.children());
+      $target.parent().replaceWith($respFileBody.children());
+      for (const el of respFileBodyChildren) window.htmx.process(el);
       onShowMoreFiles();
     } catch (error) {
       console.error('Error:', error);
diff --git a/web_src/js/globals.d.ts b/web_src/js/globals.d.ts
index a5ec29a83f..bddabd54ee 100644
--- a/web_src/js/globals.d.ts
+++ b/web_src/js/globals.d.ts
@@ -63,6 +63,7 @@ interface Window {
   jQuery: typeof import('@types/jquery'),
   htmx: Omit<typeof import('htmx.org/dist/htmx.esm.js').default, 'config'> & {
     config?: Writable<typeof import('htmx.org').default.config>,
+    process?: (elt: Element | string) => void,
   },
   ui?: any,
   _globalHandlerErrors: Array<ErrorEvent & PromiseRejectionEvent> & {