How to add button inside action saw tooth in Odoo 17

Question

I have a button in the first red frame, I want to put it in the saw wheel icon, how do I write js to do that?

I am in the treeview of model hr.employee.

Answer 1

You need to define an action menu item and add it to the cogMenu

Action Item

/** @odoo-module **/

import { Component } from "@odoo/owl";
import { DropdownItem } from "@web/core/dropdown/dropdown_item";
import { registry } from "@web/core/registry";
import { STATIC_ACTIONS_GROUP_NUMBER } from "@web/search/action_menus/action_menus";

const cogMenuRegistry = registry.category("cogMenu");

export class CustomAction extends Component {
    static template = "web.CustomAction";
    static components = { DropdownItem };

    async onClick() {
        
    }
}

export const CustomActionItem = {
   Component: CustomAction,
   groupNumber: STATIC_ACTIONS_GROUP_NUMBER,
   isDisplayed: async (env) =>
       env.config.viewType === "list" &&
       !env.model.root.selection.length && 
       env.searchModel.resModel === 'hr.employee'
};

cogMenuRegistry.add("custom-action-menu", CustomActionItem, { sequence: 19 });

Action template

<?xml version="1.0" encoding="UTF-8"?>
<templates xml:space="preserve">

    <t t-name="web.CustomAction">
        <DropdownItem class="'o_custom_action_menu'" onSelected.bind="onClick">
            <i class="fa fa-fw fa-bars me-1"/>Custom Action
        </DropdownItem>
    </t>

</templates>

Add the files the backend assets bundle

'assets': {
        'web.assets_backend': [
            'MODULE_NAME/static/src/components/*.js',
            'MODULE_NAME/static/src/components/*.xml',
        ],
    },