1. Menus
  2. Dynamically Editing the Application Menu


Dynamically Editing the Application Menu

The Application menu lives at the top of the screen on Mac. On Windows, you can find it under your app window's title bar. You can dynamically add items to this menu using our Application Menu API.


This API is in beta and may change (or be completely removed) without warning.

Add a menu item to the application menu

You can use appMenu.add from @todesktop/client-core to easily add custom items to the application menu that control your application.


The items you add to the application menu will not appear on the UI until you call appMenu.refresh().

        import { appMenu } from '@todesktop/client-core';

const parentMenu = 'File';
const label = 'Save Note';
const options = {
  // "accelerator" is the keyboard shortcut that you can use
  // to trigger the menu item
  accelerator: 'CommandOrControl+S'

await appMenu.add(
  () => {
    // Put your app logic to "save a note" here

// This is required for the additional items to appear in the UI
await appMenu.refresh();


Save Note has been added to the Application Menu on Mac

Refresh the application menu to reflect any changes

When you add a menu item to the menubar, it does not immediately appear in the application menu. You need to call refresh() to update the menu that is displayed on the UI.

If you are adding multiple items to the application menu then it is best to only call refresh() after you have added all of the necessary items to the application menu.

        import { appMenu } from '@todesktop/client-core';

// Batch add all the app menu items
await Promise.all([
    // ...
    // ...
    // ...

// Once they are all added then you can call refresh
await appMenu.refresh();