From 49fa84cc95b6067e0f0adced16fdedeb45e49e88 Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Wed, 11 Dec 2024 15:51:09 -0800
Subject: [PATCH 1/5] removed render modifiers

---
 .../components/course/publication-menu.hbs    | 204 +++++++++---------
 .../components/course/publication-menu.js     |  74 ++++---
 .../components/session/publication-menu.hbs   | 204 +++++++++---------
 .../components/session/publication-menu.js    |  74 ++++---
 4 files changed, 290 insertions(+), 266 deletions(-)

diff --git a/packages/ilios-common/addon/components/course/publication-menu.hbs b/packages/ilios-common/addon/components/course/publication-menu.hbs
index 5afd59ea65..1eef71f587 100644
--- a/packages/ilios-common/addon/components/course/publication-menu.hbs
+++ b/packages/ilios-common/addon/components/course/publication-menu.hbs
@@ -1,107 +1,101 @@
-<div
-  role="menubar"
-  class="publication-menu {{this.publicationStatus}}"
-  data-test-course-publication-menu
-  {{on-click-outside (set this "isOpen" false)}}
->
-  <button
-    aria-label={{this.title}}
-    role="menuitem"
-    class="toggle"
-    aria-haspopup="true"
-    aria-expanded={{if this.isOpen "true" "false"}}
-    type="button"
-    data-test-toggle
-    {{on "click" (toggle "isOpen" this)}}
-    {{on "keyup" this.toggleMenu}}
+{{#let (unique-id) as |templateId|}}
+  <div
+    role="menubar"
+    class="publication-menu {{this.publicationStatus}}"
+    id="menu-{{templateId}}"
+    data-test-course-publication-menu
+    {{on-click-outside (set this "isOpen" false)}}
   >
-    <FaIcon @icon={{this.icon}} />
-    <span>
-      {{this.title}}
-    </span>
-    <FaIcon @icon={{if this.isOpen "caret-down" "caret-right"}} />
-  </button>
-  {{#if this.isOpen}}
-    <div
-      class="menu"
-      role="menu"
-      {{did-insert (set this "menuElement")}}
-      {{did-insert this.focusOnFirstItem}}
-      data-test-menu
+    <button
+      aria-label={{this.title}}
+      role="menuitem"
+      class="toggle"
+      aria-haspopup="true"
+      aria-expanded={{if this.isOpen "true" "false"}}
+      type="button"
+      data-test-toggle
+      {{on "keyup" this.keyUp}}
+      {{on "click" this.toggleMenu}}
     >
-      {{#if this.showAsIs}}
-        <button
-          class="danger"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-publish-as-is
-        >
-          {{t "general.publishAsIs"}}
-        </button>
-      {{/if}}
-      {{#if this.showPublish}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-publish
-        >
-          {{t "general.publishCourse"}}
-        </button>
-      {{/if}}
-      {{#if this.showReview}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.scrollToCoursePublication}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-review
-        >
-          {{t
-            "general.reviewMissingItems"
-            count=(get @course "allPublicationIssuesLength")
-          }}
-        </button>
-      {{/if}}
-      {{#if this.showTbd}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publishAsTbd}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-tbd
-        >
-          {{t "general.markAsScheduled"}}
-        </button>
-      {{/if}}
-      {{#if this.showUnPublish}}
-        <button
-          class="danger"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.unpublish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-un-publish
-        >
-          {{t "general.unPublishCourse"}}
-        </button>
-      {{/if}}
-    </div>
-  {{/if}}
-</div>
+      <FaIcon @icon={{this.icon}} />
+      <span>
+        {{this.title}}
+      </span>
+      <FaIcon @icon={{if this.isOpen "caret-down" "caret-right"}} />
+    </button>
+    {{#if this.isOpen}}
+      <div class="menu" role="menu" data-test-menu {{focus}}>
+        {{#if this.showAsIs}}
+          <button
+            class="danger"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-publish-as-is
+          >
+            {{t "general.publishAsIs"}}
+          </button>
+        {{/if}}
+        {{#if this.showPublish}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-publish
+          >
+            {{t "general.publishCourse"}}
+          </button>
+        {{/if}}
+        {{#if this.showReview}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.scrollToCoursePublication}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-review
+          >
+            {{t "general.reviewMissingItems" count=(get @course "allPublicationIssuesLength")}}
+          </button>
+        {{/if}}
+        {{#if this.showTbd}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publishAsTbd}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-tbd
+          >
+            {{t "general.markAsScheduled"}}
+          </button>
+        {{/if}}
+        {{#if this.showUnPublish}}
+          <button
+            class="danger"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.unpublish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-un-publish
+          >
+            {{t "general.unPublishCourse"}}
+          </button>
+        {{/if}}
+      </div>
+    {{/if}}
+  </div>
+{{/let}}
\ No newline at end of file
diff --git a/packages/ilios-common/addon/components/course/publication-menu.js b/packages/ilios-common/addon/components/course/publication-menu.js
index 71f89bd589..dd4229c0fe 100644
--- a/packages/ilios-common/addon/components/course/publication-menu.js
+++ b/packages/ilios-common/addon/components/course/publication-menu.js
@@ -2,6 +2,7 @@ import Component from '@glimmer/component';
 import { service } from '@ember/service';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
+import { task, timeout } from 'ember-concurrency';
 
 export default class CoursePublicationMenuComponent extends Component {
   @service router;
@@ -63,53 +64,70 @@ export default class CoursePublicationMenuComponent extends Component {
     return 'notpublished';
   }
 
-  focusOnFirstItem(menuElement) {
-    menuElement.querySelector('button:first-of-type').focus();
+  focusFirstLink = task(async () => {
+    await timeout(1);
+    document.querySelector('.publication-menu .menu button:first-of-type').focus();
+  });
+
+  handleArrowUp(item) {
+    if (item?.previousElementSibling) {
+      item.previousElementSibling.focus();
+    } else {
+      item?.parentElement.lastElementChild.focus();
+    }
   }
+  async handleArrowDown(item) {
+    if (item.classList.value == 'toggle') {
+      this.isOpen = true;
+      await this.focusFirstLink.perform();
+    } else {
+      if (item.nextElementSibling) {
+        item.nextElementSibling.focus();
+      } else {
+        await this.focusFirstLink.perform();
+      }
+    }
+  }
+
+  @action
+  async toggleMenu(event) {
+    console.log('course toggleMenu', event.target);
+    this.isOpen = !this.isOpen;
 
+    if (this.isOpen) {
+      await this.focusFirstLink.perform();
+    }
+  }
   @action
-  moveFocus({ key, target }) {
-    switch (key) {
+  keyUp(event) {
+    event.stopPropagation();
+    event.preventDefault();
+
+    switch (event.key) {
       case 'ArrowDown':
-        if (target.nextElementSibling) {
-          target.nextElementSibling.focus();
-        } else {
-          this.menuElement.querySelector('button:nth-of-type(1)').focus();
-        }
+        this.handleArrowDown(event.target);
         break;
       case 'ArrowUp':
-        if (target.previousElementSibling) {
-          target.previousElementSibling.focus();
-        } else {
-          this.menuElement.querySelector('button:last-of-type').focus();
-        }
+        this.handleArrowUp(event.target);
         break;
       case 'Escape':
       case 'Tab':
       case 'ArrowRight':
       case 'ArrowLeft':
-        this.isOpen = false;
+        this.close();
         break;
     }
+
+    return false;
   }
   @action
   clearFocus() {
-    const buttons = this.menuElement.querySelectorAll('button');
+    const buttons = document.querySelectorAll('.publication-menu .menu button');
     buttons.forEach((el) => el.blur());
   }
   @action
-  toggleMenu({ key }) {
-    switch (key) {
-      case 'ArrowDown':
-        this.isOpen = true;
-        break;
-      case 'Escape':
-      case 'Tab':
-      case 'ArrowRight':
-      case 'ArrowLeft':
-        this.isOpen = false;
-        break;
-    }
+  close() {
+    this.isOpen = false;
   }
 
   @action
diff --git a/packages/ilios-common/addon/components/session/publication-menu.hbs b/packages/ilios-common/addon/components/session/publication-menu.hbs
index 705fef5540..04fd6fb819 100644
--- a/packages/ilios-common/addon/components/session/publication-menu.hbs
+++ b/packages/ilios-common/addon/components/session/publication-menu.hbs
@@ -1,107 +1,101 @@
-<div
-  role="menubar"
-  class="publication-menu {{this.publicationStatus}}"
-  data-test-session-publication-menu
-  {{on-click-outside (set this "isOpen" false)}}
->
-  <button
-    aria-label={{this.title}}
-    role="menuitem"
-    class="toggle"
-    aria-haspopup="true"
-    aria-expanded={{if this.isOpen "true" "false"}}
-    type="button"
-    data-test-toggle
-    {{on "click" (toggle "isOpen" this)}}
-    {{on "keyup" this.toggleMenu}}
+{{#let (unique-id) as |templateId|}}
+  <div
+    role="menubar"
+    class="publication-menu {{this.publicationStatus}}"
+    id="menu-{{templateId}}"
+    data-test-session-publication-menu
+    {{on-click-outside (set this "isOpen" false)}}
   >
-    <FaIcon @icon={{this.icon}} />
-    <span>
-      {{this.title}}
-    </span>
-    <FaIcon @icon={{if this.isOpen "caret-down" "caret-right"}} />
-  </button>
-  {{#if this.isOpen}}
-    <div
-      class="menu"
-      role="menu"
-      {{did-insert (set this "menuElement")}}
-      {{did-insert this.focusOnFirstItem}}
-      data-test-menu
+    <button
+      aria-label={{this.title}}
+      role="menuitem"
+      class="toggle"
+      aria-haspopup="true"
+      aria-expanded={{if this.isOpen "true" "false"}}
+      type="button"
+      data-test-toggle
+      {{on "keyup" this.keyUp}}
+      {{on "click" this.toggleMenu}}
     >
-      {{#if this.showAsIs}}
-        <button
-          class="danger"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-publish-as-is
-        >
-          {{t "general.publishAsIs"}}
-        </button>
-      {{/if}}
-      {{#if this.showPublish}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-publish
-        >
-          {{t "general.publishSession"}}
-        </button>
-      {{/if}}
-      {{#if this.showReview}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.scrollToSessionPublication}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-review
-        >
-          {{t
-            "general.reviewMissingItems"
-            count=(get @session "allPublicationIssuesLength")
-          }}
-        </button>
-      {{/if}}
-      {{#if this.showTbd}}
-        <button
-          class="good"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.publishAsTbd}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-tbd
-        >
-          {{t "general.markAsScheduled"}}
-        </button>
-      {{/if}}
-      {{#if this.showUnPublish}}
-        <button
-          class="danger"
-          role="menuitem"
-          tabindex="-1"
-          type="button"
-          {{on "click" this.unpublish}}
-          {{on "keyup" this.moveFocus}}
-          {{on "mouseenter" this.clearFocus}}
-          data-test-un-publish
-        >
-          {{t "general.unPublishSession"}}
-        </button>
-      {{/if}}
-    </div>
-  {{/if}}
-</div>
+      <FaIcon @icon={{this.icon}} />
+      <span>
+        {{this.title}}
+      </span>
+      <FaIcon @icon={{if this.isOpen "caret-down" "caret-right"}} />
+    </button>
+    {{#if this.isOpen}}
+      <div class="menu" role="menu" data-test-menu {{focus}}>
+        {{#if this.showAsIs}}
+          <button
+            class="danger"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-publish-as-is
+          >
+            {{t "general.publishAsIs"}}
+          </button>
+        {{/if}}
+        {{#if this.showPublish}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-publish
+          >
+            {{t "general.publishSession"}}
+          </button>
+        {{/if}}
+        {{#if this.showReview}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.scrollToSessionPublication}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-review
+          >
+            {{t "general.reviewMissingItems" count=(get @session "allPublicationIssuesLength")}}
+          </button>
+        {{/if}}
+        {{#if this.showTbd}}
+          <button
+            class="good"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.publishAsTbd}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-tbd
+          >
+            {{t "general.markAsScheduled"}}
+          </button>
+        {{/if}}
+        {{#if this.showUnPublish}}
+          <button
+            class="danger"
+            role="menuitem"
+            tabindex="-1"
+            type="button"
+            {{on "click" this.unpublish}}
+            {{on "keyup" this.keyUp}}
+            {{on "mouseenter" this.clearFocus}}
+            data-test-un-publish
+          >
+            {{t "general.unPublishSession"}}
+          </button>
+        {{/if}}
+      </div>
+    {{/if}}
+  </div>
+{{/let}}
\ No newline at end of file
diff --git a/packages/ilios-common/addon/components/session/publication-menu.js b/packages/ilios-common/addon/components/session/publication-menu.js
index 9917ed4e9b..3c07e40e2c 100644
--- a/packages/ilios-common/addon/components/session/publication-menu.js
+++ b/packages/ilios-common/addon/components/session/publication-menu.js
@@ -2,6 +2,7 @@ import Component from '@glimmer/component';
 import { service } from '@ember/service';
 import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
+import { task, timeout } from 'ember-concurrency';
 
 export default class SessionPublicationMenuComponent extends Component {
   @service router;
@@ -67,53 +68,70 @@ export default class SessionPublicationMenuComponent extends Component {
     return 'notpublished';
   }
 
-  focusOnFirstItem(menuElement) {
-    menuElement.querySelector('button:first-of-type').focus();
+  focusFirstLink = task(async () => {
+    await timeout(1);
+    document.querySelector('.publication-menu .menu button:first-of-type').focus();
+  });
+
+  handleArrowUp(item) {
+    if (item?.previousElementSibling) {
+      item.previousElementSibling.focus();
+    } else {
+      item?.parentElement.lastElementChild.focus();
+    }
   }
+  async handleArrowDown(item) {
+    if (item.classList.value == 'toggle') {
+      this.isOpen = true;
+      await this.focusFirstLink.perform();
+    } else {
+      if (item.nextElementSibling) {
+        item.nextElementSibling.focus();
+      } else {
+        await this.focusFirstLink.perform();
+      }
+    }
+  }
+
+  @action
+  async toggleMenu(event) {
+    console.log('session toggleMenu', event.target);
+    this.isOpen = !this.isOpen;
 
+    if (this.isOpen) {
+      await this.focusFirstLink.perform();
+    }
+  }
   @action
-  moveFocus({ key, target }) {
-    switch (key) {
+  keyUp(event) {
+    event.stopPropagation();
+    event.preventDefault();
+
+    switch (event.key) {
       case 'ArrowDown':
-        if (target.nextElementSibling) {
-          target.nextElementSibling.focus();
-        } else {
-          this.menuElement.querySelector('button:nth-of-type(1)').focus();
-        }
+        this.handleArrowDown(event.target);
         break;
       case 'ArrowUp':
-        if (target.previousElementSibling) {
-          target.previousElementSibling.focus();
-        } else {
-          this.menuElement.querySelector('button:last-of-type').focus();
-        }
+        this.handleArrowUp(event.target);
         break;
       case 'Escape':
       case 'Tab':
       case 'ArrowRight':
       case 'ArrowLeft':
-        this.isOpen = false;
+        this.close();
         break;
     }
+
+    return true;
   }
   @action
   clearFocus() {
-    const buttons = this.menuElement.querySelectorAll('button');
+    const buttons = document.querySelectorAll('.publication-menu .menu button');
     buttons.forEach((el) => el.blur());
   }
   @action
-  toggleMenu({ key }) {
-    switch (key) {
-      case 'ArrowDown':
-        this.isOpen = true;
-        break;
-      case 'Escape':
-      case 'Tab':
-      case 'ArrowRight':
-      case 'ArrowLeft':
-        this.isOpen = false;
-        break;
-    }
+  close() {
+    this.isOpen = false;
   }
 
   @action

From 3fa46c9c583bd236cb3afd31c2931af7cd100b54 Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Wed, 11 Dec 2024 16:00:37 -0800
Subject: [PATCH 2/5] updated lint-todo

---
 packages/ilios-common/.lint-todo | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/packages/ilios-common/.lint-todo b/packages/ilios-common/.lint-todo
index 2912ff5299..c704b8d52b 100644
--- a/packages/ilios-common/.lint-todo
+++ b/packages/ilios-common/.lint-todo
@@ -40,8 +40,6 @@ add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628da
 add|ember-template-lint|no-at-ember-render-modifiers|5|2|5|2|32658810aa13672f5981281c562729112a89788f|1731542400000|1762646400000|1793750400000|addon/components/course/header.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1731542400000|1762646400000|1793750400000|addon/components/course/objective-list.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|5|2|5|2|84076f8cf85c554eaf0d9fdec26154bae5bceeb2|1731542400000|1762646400000|1793750400000|addon/components/course/objective-list.hbs
-add|ember-template-lint|no-at-ember-render-modifiers|28|6|28|6|1ef231a97c0ec761eaafb3e76093515e5523ff27|1731542400000|1762646400000|1793750400000|addon/components/course/publication-menu.hbs
-add|ember-template-lint|no-at-ember-render-modifiers|29|6|29|6|df94e6558ff62dea69f6f656f668f29b56bcc378|1731542400000|1762646400000|1793750400000|addon/components/course/publication-menu.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|2bbf15957242a9a3c1e26e14e5d022c858199fde|1731542400000|1762646400000|1793750400000|addon/components/course/rollover-date-picker.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|5|2|5|2|167e8d9ede488c7f199cb748e81bc09b97617e71|1731542400000|1762646400000|1793750400000|addon/components/course/rollover-date-picker.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|3|2|3|2|1009d3843f6aed52099f0e7fbd4eebb52bc176e5|1731542400000|1762646400000|1793750400000|addon/components/course/rollover.hbs
@@ -55,5 +53,3 @@ add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|23cd787c79c34a628da
 add|ember-template-lint|no-at-ember-render-modifiers|3|2|3|2|23cd787c79c34a628dadb6e96dd4004d42eebb79|1731542400000|1762646400000|1793750400000|addon/components/dashboard/courses-calendar-filter.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|4|2|4|2|a90be151f45cd8ab32827e9247a9a9eb7f1baef2|1731542400000|1762646400000|1793750400000|addon/components/dashboard/courses-calendar-filter.hbs
 add|ember-template-lint|no-at-ember-render-modifiers|24|10|24|10|2ed3ce70b879732dc85047f9f546c5dbd5376dba|1731542400000|1762646400000|1793750400000|addon/components/dashboard/courses-calendar-filter.hbs
-add|ember-template-lint|no-at-ember-render-modifiers|28|6|28|6|1ef231a97c0ec761eaafb3e76093515e5523ff27|1731542400000|1762646400000|1793750400000|addon/components/session/publication-menu.hbs
-add|ember-template-lint|no-at-ember-render-modifiers|29|6|29|6|df94e6558ff62dea69f6f656f668f29b56bcc378|1731542400000|1762646400000|1793750400000|addon/components/session/publication-menu.hbs

From e748a4b1949761c27451a213404ddd24905051e3 Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Wed, 11 Dec 2024 16:27:58 -0800
Subject: [PATCH 3/5] refactor; remove console.log

---
 .../addon/components/course/publication-menu.js   | 15 ++++++---------
 .../addon/components/session/publication-menu.js  | 15 ++++++---------
 2 files changed, 12 insertions(+), 18 deletions(-)

diff --git a/packages/ilios-common/addon/components/course/publication-menu.js b/packages/ilios-common/addon/components/course/publication-menu.js
index dd4229c0fe..6a4b0f79b9 100644
--- a/packages/ilios-common/addon/components/course/publication-menu.js
+++ b/packages/ilios-common/addon/components/course/publication-menu.js
@@ -76,6 +76,7 @@ export default class CoursePublicationMenuComponent extends Component {
       item?.parentElement.lastElementChild.focus();
     }
   }
+
   async handleArrowDown(item) {
     if (item.classList.value == 'toggle') {
       this.isOpen = true;
@@ -90,8 +91,7 @@ export default class CoursePublicationMenuComponent extends Component {
   }
 
   @action
-  async toggleMenu(event) {
-    console.log('course toggleMenu', event.target);
+  async toggleMenu() {
     this.isOpen = !this.isOpen;
 
     if (this.isOpen) {
@@ -99,16 +99,13 @@ export default class CoursePublicationMenuComponent extends Component {
     }
   }
   @action
-  keyUp(event) {
-    event.stopPropagation();
-    event.preventDefault();
-
-    switch (event.key) {
+  keyUp({ key, target }) {
+    switch (key) {
       case 'ArrowDown':
-        this.handleArrowDown(event.target);
+        this.handleArrowDown(target);
         break;
       case 'ArrowUp':
-        this.handleArrowUp(event.target);
+        this.handleArrowUp(target);
         break;
       case 'Escape':
       case 'Tab':
diff --git a/packages/ilios-common/addon/components/session/publication-menu.js b/packages/ilios-common/addon/components/session/publication-menu.js
index 3c07e40e2c..caec869f73 100644
--- a/packages/ilios-common/addon/components/session/publication-menu.js
+++ b/packages/ilios-common/addon/components/session/publication-menu.js
@@ -80,6 +80,7 @@ export default class SessionPublicationMenuComponent extends Component {
       item?.parentElement.lastElementChild.focus();
     }
   }
+
   async handleArrowDown(item) {
     if (item.classList.value == 'toggle') {
       this.isOpen = true;
@@ -94,8 +95,7 @@ export default class SessionPublicationMenuComponent extends Component {
   }
 
   @action
-  async toggleMenu(event) {
-    console.log('session toggleMenu', event.target);
+  async toggleMenu() {
     this.isOpen = !this.isOpen;
 
     if (this.isOpen) {
@@ -103,16 +103,13 @@ export default class SessionPublicationMenuComponent extends Component {
     }
   }
   @action
-  keyUp(event) {
-    event.stopPropagation();
-    event.preventDefault();
-
-    switch (event.key) {
+  keyUp({ key, target }) {
+    switch (key) {
       case 'ArrowDown':
-        this.handleArrowDown(event.target);
+        this.handleArrowDown(target);
         break;
       case 'ArrowUp':
-        this.handleArrowUp(event.target);
+        this.handleArrowUp(target);
         break;
       case 'Escape':
       case 'Tab':

From d3fcc0c5b9e014c8101dcb6f275163a3c7c729cc Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Fri, 13 Dec 2024 14:52:55 -0800
Subject: [PATCH 4/5] fix to use elem clicked instead of querying from doc root

---
 .../components/course/publication-menu.js      | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/ilios-common/addon/components/course/publication-menu.js b/packages/ilios-common/addon/components/course/publication-menu.js
index 6a4b0f79b9..31a5e494ff 100644
--- a/packages/ilios-common/addon/components/course/publication-menu.js
+++ b/packages/ilios-common/addon/components/course/publication-menu.js
@@ -64,9 +64,9 @@ export default class CoursePublicationMenuComponent extends Component {
     return 'notpublished';
   }
 
-  focusFirstLink = task(async () => {
+  focusFirstLink = task(async (item) => {
     await timeout(1);
-    document.querySelector('.publication-menu .menu button:first-of-type').focus();
+    item.querySelector('.menu button:first-of-type').focus();
   });
 
   handleArrowUp(item) {
@@ -80,22 +80,22 @@ export default class CoursePublicationMenuComponent extends Component {
   async handleArrowDown(item) {
     if (item.classList.value == 'toggle') {
       this.isOpen = true;
-      await this.focusFirstLink.perform();
+      await this.focusFirstLink.perform(item.parentElement);
     } else {
       if (item.nextElementSibling) {
         item.nextElementSibling.focus();
       } else {
-        await this.focusFirstLink.perform();
+        await this.focusFirstLink.perform(item.parentElement);
       }
     }
   }
 
   @action
-  async toggleMenu() {
+  async toggleMenu({ target }) {
     this.isOpen = !this.isOpen;
 
     if (this.isOpen) {
-      await this.focusFirstLink.perform();
+      await this.focusFirstLink.perform(target.parentElement.parentElement);
     }
   }
   @action
@@ -118,9 +118,9 @@ export default class CoursePublicationMenuComponent extends Component {
     return false;
   }
   @action
-  clearFocus() {
-    const buttons = document.querySelectorAll('.publication-menu .menu button');
-    buttons.forEach((el) => el.blur());
+  clearFocus({ target }) {
+    const menu = target.parentElement.parentElement;
+    menu.querySelectorAll('button').forEach((el) => el.blur());
   }
   @action
   close() {

From 640173d24350eaa9da6ebc4137ca66858eba8aa4 Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Fri, 13 Dec 2024 15:18:48 -0800
Subject: [PATCH 5/5] fix to use elem clicked instead of querying from doc root

---
 .../components/session/publication-menu.js     | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/ilios-common/addon/components/session/publication-menu.js b/packages/ilios-common/addon/components/session/publication-menu.js
index caec869f73..997ee5729e 100644
--- a/packages/ilios-common/addon/components/session/publication-menu.js
+++ b/packages/ilios-common/addon/components/session/publication-menu.js
@@ -68,9 +68,9 @@ export default class SessionPublicationMenuComponent extends Component {
     return 'notpublished';
   }
 
-  focusFirstLink = task(async () => {
+  focusFirstLink = task(async (item) => {
     await timeout(1);
-    document.querySelector('.publication-menu .menu button:first-of-type').focus();
+    item.querySelector('.menu button:first-of-type').focus();
   });
 
   handleArrowUp(item) {
@@ -84,22 +84,22 @@ export default class SessionPublicationMenuComponent extends Component {
   async handleArrowDown(item) {
     if (item.classList.value == 'toggle') {
       this.isOpen = true;
-      await this.focusFirstLink.perform();
+      await this.focusFirstLink.perform(item.parentElement);
     } else {
       if (item.nextElementSibling) {
         item.nextElementSibling.focus();
       } else {
-        await this.focusFirstLink.perform();
+        await this.focusFirstLink.perform(item.parentElement);
       }
     }
   }
 
   @action
-  async toggleMenu() {
+  async toggleMenu({ target }) {
     this.isOpen = !this.isOpen;
 
     if (this.isOpen) {
-      await this.focusFirstLink.perform();
+      await this.focusFirstLink.perform(target.parentElement.parentElement);
     }
   }
   @action
@@ -122,9 +122,9 @@ export default class SessionPublicationMenuComponent extends Component {
     return true;
   }
   @action
-  clearFocus() {
-    const buttons = document.querySelectorAll('.publication-menu .menu button');
-    buttons.forEach((el) => el.blur());
+  clearFocus({ target }) {
+    const menu = target.parentElement.parentElement;
+    menu.querySelectorAll('button').forEach((el) => el.blur());
   }
   @action
   close() {