Fix some UI problems for 1.23 (#33856)

Partially backport #32927 #33851

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;

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);

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> & {