fix

Author: kerwin612

web_src/js/components/DashboardRepoList.vue

@@ -391,7 +391,7 @@ export default defineComponent({
             </div>
           </div>
         </div>
-        <overflow-menu class="ui secondary pointing tabular borderless menu repos-filter" :active="reposFilter">
+        <overflow-menu class="ui secondary pointing tabular borderless menu repos-filter">
           <div class="overflow-menu-items tw-justify-center">
             <a class="item" tabindex="0" :class="{active: reposFilter === 'all'}" @click="changeReposFilter('all')">
               {{ textAll }}

web_src/js/webcomponents/overflow-menu.ts

@@ -4,8 +4,6 @@ import {isDocumentFragmentOrElementNode, toggleClass} from '../utils/dom.ts';
 import octiconKebabHorizontal from '../../../public/assets/img/svg/octicon-kebab-horizontal.svg';
 
 window.customElements.define('overflow-menu', class extends HTMLElement {
-  static observedAttributes = ['active'];
-
   tippyContent: HTMLDivElement;
   tippyItems: Array<HTMLElement>;
   button: HTMLButtonElement;
@@ -104,7 +102,16 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
       const itemRight = item.offsetLeft + item.offsetWidth;
       if (menuRight - itemRight < 38) { // roughly the width of .overflow-menu-button with some extra space
         this.tippyItems.push(item);
+
+        // close tippy when clicking item of tippy
+        item.addEventListener('click', () => {
+          this.button?._tippy.hide();
+        });
       }
+      // refresh overflow-button active state
+      item.addEventListener('click', () => {
+        this.updateButtonActivationState();
+      });
     }
     itemFlexSpace?.style.removeProperty('display');
     itemOverFlowMenuButton?.style.removeProperty('display');
@@ -130,14 +137,6 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
       this.tippyContent.append(item);
     }
 
-    // close tippy when clicking item of tippy
-    const items = this.tippyContent.querySelectorAll<HTMLElement>('.item');
-    for (const item of items) {
-      item.addEventListener('click', () => {
-        this.button?._tippy.hide();
-      });
-    }
-
     // update existing tippy
     if (this.button?._tippy) {
       this.button._tippy.setContent(this.tippyContent);
@@ -235,10 +234,6 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
     }
   }
 
-  attributeChangedCallback() {
-    this.updateButtonActivationState();
-  }
-
   disconnectedCallback() {
     this.mutationObserver?.disconnect();
     this.resizeObserver?.disconnect();