Add custom menu item to FeatureTable menu

[SeanRedar]

I can create the menu item but am stumped how I add the menu item to the FeatureTable's menu.  Any suggestions would be great.

[AlejandroMari1 · Accepted solution]

This has worked for me on JS API 4.23:

const table = new FeatureTable({
    layer: myLayer,
    fieldConfigs: myFields,
    attachmentsEnabled: false,
    visibleElements: {
        selectionColumn: true,
        header: true,
        menu: true
    }
});

table.when().then(() => {
    const newMenuItem = {
        label: "Do something",
        clickFunction: (event) => {
            console.log("Clicked!");
        }
    };
    table.menu.items.push(newMenuItem);
});

[SeanRedar]

Yes, thank you.  I think I was passing the wrong object to the menu.

[SeanRedar]

Update - it worked inconsistently but doesn't seem to be working at all now.  

[KevinUseche]

add visible property on object newMenuItem

                    table.when().then(() => {
                        const newMenuItem = {
                            label: "Do something",
                            iconClass: "Icon font name, if applicable",
                            visible: true,
                            clickFunction: (event) => {
                                console.log("Clicked!");
                            }
                        };
                        table.menu.items.push(newMenuItem);
                    });

[ChristineWiltawsky1]

The menu property is marked as readonly and should not be edited. You can use the property menuConfig instead. Here is an example which shows standard entries and a custom menu item in the Feature Tables's menu

featureTable.when().then(() => {
            const buttonMenuItem1 = new ButtonMenuItem ({
                    label: "custom menu item label",
                    clickFunction: function () {
                        console.log("click MenuItem1");
                    }
                });
                const buttonMenu = new ButtonMenu ({
                    iconClass: "esri-icon-handle-horizontal",
                    items: []
                });
                featureTable.menu.items.forEach(element => {
                    buttonMenu.items.push(element);
                });
                buttonMenu.items.push(buttonMenuItem1);
                featureTable.menuConfig = buttonMenu;
        });