Add class to full page search result items?

Development

AI-generated summary

Users are trying to add a class to full-page search result items based on the post category. asc attempted to use modifyClass on the full-page-search controller but was unsuccessful. asc found a workaround by using decoratePluginOutlet to access the category ID and add the class to the topic div. However, they wonder if there’s a better approach. david shared a link to a related topic on using modifyClass for objects initialized early in the boot process, which may provide more insight.

1

I’m trying to add a class for the category of a post in the results returned by full-page-search. I’ve tried modifyClass to both controller/full-page-search and component/search-result-entry, including using the modifyClass bug workaround from here, and I can’t even get a console.log or alert to work. Is there another way to just add a class to fps-result post items? I’m basically looking for the equivalent of decorateCookedElement for full page search.

api.modifyClass('controller:full-page-search', {
   pluginId: 'mute-categories-search',
   actions: {
    newActionHere() {
        console.log("test")
    }
   }
});
const controller = api.container.lookup('controller:full-page-search');
2

I ended up getting the category ID by using decoratePluginOutlet and then walking down and up the hierarchy to find the category link from the badge and add it to the topic div. Is there a better way to do this?

api.decoratePluginOutlet(
   "full-page-search-category",
   (elem, args) => {
    let searchCategory = elem.parentElement.parentElement
    let fpsTopic = searchCategory.parentElement.parentElement
    let category_id = searchCategory.children[0].getAttribute('href').split("/").slice(-1);
    console.log(category_id)
    fpsTopic.classList.add("category_" + category_id)
   }
 );
3