Revert "A11Y: Focus last viewed topic in topic lists (#16240)" (#16255)

This reverts commit 5d77f485cb.

There are some edge cases that we need to handle better. Reverting this
commit because we're going to do a beta release later today.

app/assets/javascripts/discourse/app/components/topic-list-item.js

@@ -1,7 +1,4 @@
-import discourseComputed, {
+import discourseComputed, { observes } from "discourse-common/utils/decorators";
-  bind,
-  observes,
-} from "discourse-common/utils/decorators";
 import Component from "@ember/component";
 import DiscourseURL from "discourse/lib/url";
 import I18n from "I18n";
@@ -61,11 +58,6 @@ export default Component.extend({
         if (this.selected && this.selected.includes(this.topic)) {
           this.element.querySelector("input.bulk-select").checked = true;
         }
-        const title = this.element.querySelector(".main-link .title");
-        if (title) {
-          title.addEventListener("focus", this._onTitleFocus);
-          title.addEventListener("blur", this._onTitleBlur);
-        }
       });
     }
   },
@@ -106,11 +98,6 @@ export default Component.extend({
     if (this.includeUnreadIndicator) {
       this.messageBus.unsubscribe(this.unreadIndicatorChannel);
     }
-    const title = this.element?.querySelector(".main-link .title");
-    if (title) {
-      title.removeEventListener("focus", this._onTitleFocus);
-      title.removeEventListener("blur", this._onTitleBlur);
-    }
   },
 
   @discourseComputed("topic.id")
@@ -272,15 +259,12 @@ export default Component.extend({
         return;
       }
 
-      this.element.classList.add("highlighted");
+      const $topic = $(this.element);
-      this.element.setAttribute(
+      $topic
-        "data-islastviewedtopic",
+        .addClass("highlighted")
-        opts.isLastViewedTopic
+        .attr("data-islastviewedtopic", opts.isLastViewedTopic);
-      );
+
-      this.element.addEventListener("animationend", () => {
+      $topic.on("animationend", () => $topic.removeClass("highlighted"));
-        this.element.classList.remove("highlighted");
-      });
-      this.element.querySelector(".main-link .title").focus();
     });
   },
 
@@ -295,20 +279,4 @@ export default Component.extend({
       this.highlight();
     }
   }),
-
-  @bind
-  _onTitleFocus() {
-    if (this.element && !this.isDestroying && !this.isDestroyed) {
-      const mainLink = this.element.querySelector(".main-link");
-      mainLink.classList.add("focused");
-    }
-  },
-
-  @bind
-  _onTitleBlur() {
-    if (this.element && !this.isDestroying && !this.isDestroyed) {
-      const mainLink = this.element.querySelector(".main-link");
-      mainLink.classList.remove("focused");
-    }
-  },
 });

app/assets/stylesheets/common/base/_topic-list.scss

@@ -234,15 +234,6 @@
     .raw-topic-link > * {
       pointer-events: none;
     }
-
-    &.focused {
-      box-shadow: inset 3px 0 0 var(--tertiary);
-    }
-    /* we have a custom focus indicator so we can remove the native one */
-    .title:focus,
-    .title:focus-visible {
-      outline: none;
-    }
   }
 
   .unread-indicator {