I created the submenu in electron js and try to change the status of the submenu after it clicked. But I cannot perform the action.

index.js

ipcMain.on('show-context-menu', (event) => {
        const template = [
            {
                label: 'Position',
                submenu: [
                    {
                        label: 'Bottom Right',
                        type: 'checkbox',
                        role: 'bottomRight',
                        click: () => {
                            let modifiedMenuItem = changePosition(positioner, 'bottomRight', menuItem);
                            
                   Menu.setApplicationMenu(Menu.buildFromTemplate(modifiedMenuItem));
                            //applyMenu(modifiedMenuItem);
                            menu = Menu.buildFromTemplate(modifiedMenuItem);
                            Menu.setApplicationMenu(menu);
                            menu.popup(BrowserWindow.fromWebContents(event.sender));
                        }
                    },
                    {
                        label: 'Bottom Left',
                        type: 'checkbox',
                        role: 'bottomLeft',
                        click: () => {
                            let modifiedMenuItem = changePosition(positioner, 'bottomLeft', menuItem);
Menu.setApplicationMenu(Menu.buildFromTemplate(modifiedMenuItem));
                            //applyMenu(modifiedMenuItem);
                            menu = Menu.buildFromTemplate(modifiedMenuItem);
                            Menu.setApplicationMenu(menu);
                            menu.popup(BrowserWindow.fromWebContents(event.sender));

                        }
                    }
                ]
            }
        ]
        menu = Menu.buildFromTemplate(template);
        Menu.setApplicationMenu(menu);
        menuItem = Menu.getApplicationMenu();
        menu.popup(BrowserWindow.fromWebContents(event.sender));
    });

let changePosition = (positioner, position, menuItem) => {
    let menuTemplate = [{
        label: 'Position',
        submenu: []
    }];
    menuItem?.items[0]?.submenu?.items.forEach(m => {
        menuTemplate[0].submenu.push({
            label: m.label, type: m.type, role: m.role, click: m.click, checked: m.checked
        });
    });
    positioner.move(position);
    return menuTemplate;
}

Here after clicking, I am rendering the menu again. But it's not changing the checked status.

Any help on this.