> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Dashboard Menu Plugin Extension Files and Code

## Article: Dashboard Menu Plugin Extension Files and Code

## Article Link: https://dev.wix.com/docs/dashboard-extensions/dashboard-menu-plugins/dashboard-menu-plugin-extension-files-and-code.md

## Article Content:

# Dashboard Menu Plugin Extension Files and Code

When you add a [dashboard menu plugin](https://dev.wix.com/docs/overview/extensions-framework/dashboard-extensions/dashboard-menu-plugins.md) extension, the generated file lands under `src/extensions/dashboard/menu-plugins/<plugin-folder>/` and the extension is registered in your project's `extensions.ts`.

This file is the same whether you add the menu plugin in a Studio Two site project or in a Wix CLI project.

```text
src/
└── extensions/
    └── dashboard/
        └── menu-plugins/
            └── <plugin-folder>/
                └── <plugin-folder>.extension.ts
```

| File | What it's for |
|------|---------------|
| `<plugin-folder>.extension.ts` | The [configuration file](#configuration-file) for the menu plugin ID, title, slot ID, icon, and click action. |

A menu plugin has no component file. When a Wix user clicks the item, the page or modal it opens runs the code.

## Configuration file

The `<plugin-folder>.extension.ts` file declares the menu plugin with `extensions.dashboardMenuPlugin()`.

Import `extensions` from the package your project uses:

```ts
// Studio Two site
import { extensions } from '@wix/custom-extensions';
```

```ts
// Wix CLI app or headless project
import { extensions } from '@wix/astro/builders';
```

```ts
export default extensions.dashboardMenuPlugin({
  id: string,
  title: string,
  extends: string,
  iconKey: string,
  action:
    | { navigateToPage: { pageId: string } }
    | { openModal: { componentId: string } },
});
```

Example:

```ts
export default extensions.dashboardMenuPlugin({
  id: '2b6c6f0e-8f6e-4c1e-9d0a-3f5b7c1a9e42',
  title: 'Contact Summary',
  extends: '79963a99-8680-4164-8961-8867fcb1751a',
  iconKey: 'Sparkles',
  action: {
    openModal: {
      componentId: '881eedb6-b5a1-4b86-ac13-72c73df1af4a',
    },
  },
});
```

### Configuration fields

| Field | Type | Description |
|--|--|--|
| `id` | string | Menu plugin ID as a GUID. It must be unique across all extensions in the project. |
| `title` | string | The label of the menu item. |
| `extends` | string | Slot ID of the menu slot the item appears in. Each slot is on a [dashboard page built by Wix](https://dev.wix.com/docs/dashboard-extensions/dashboard-pages-built-by-wix/about-dashboard-pages-built-by-wix.md). For the available slots and their IDs, see [About Dashboard Page Slots](https://dev.wix.com/docs/dashboard-extensions/dashboard-pages-built-by-wix/page-slots/about-dashboard-page-slots.md). |
| `iconKey` | string | Name of the [Wix Design System icon](https://www.wix-pages.com/design-system-documentation/#/page/foundations/icons) shown next to the label. The generated file uses `Sparkles`. |
| `action` | object | What happens when a Wix user clicks the item. Contains either `navigateToPage` or `openModal`. See [Click action](#click-action). |

### Click action

Set `action` to one of the following:

| Field | Type | Description |
|--|--|--|
| `navigateToPage.pageId` | string | ID of the dashboard page to navigate to. For a dashboard page in your project, use the `id` from its `.extension.ts` file. For a dashboard page built by Wix, see [Page IDs](https://dev.wix.com/docs/sdk/host-modules/dashboard/page-ids.md). |
| `openModal.componentId` | string | ID of the dashboard modal to open. Use the `id` from the modal's `.extension.ts` file. |

## Slot data

The slot passes data from the host page to the page or modal the item opens, such as the ID of the item in view. Each slot defines its own data type, which the business solution's package exports under the `plugins` namespace of its `dashboard` entry point. The type path is `plugins.<page>.<slot>Params`.

How the data reaches your code depends on the click action:

- `openModal`: The modal receives the data as an object. To read it, call [`observeState()`](https://dev.wix.com/docs/sdk/host-modules/dashboard/observe-state.md).
- `navigateToPage`: Wix adds the data to the dashboard URL as query parameters, for example `?contactId=<contact ID>`. To read them in the page, use the `location.search` value that `observeState()` passes. The values are strings, not the slot's data type.

For example, the Contact main more actions menu slot on the CRM contact page passes `contactId`, the ID of the contact in view. A modal reads it like this:

```tsx
import { useEffect, useState, type FC } from 'react';
import { dashboard } from '@wix/dashboard';
import type { plugins } from '@wix/crm/dashboard';
import { Text } from '@wix/design-system';

type SlotData = plugins.ContactFullPage.ContactMainMoreActionsMenuParams;

const Modal: FC = () => {
  const [contactId, setContactId] = useState<string>();

  useEffect(() => {
    const { disconnect } = dashboard.observeState<SlotData>((params) => {
      setContactId(params.contactId);
    });
    return disconnect;
  }, []);

  return <Text>Contact ID: {contactId}</Text>;
};
```

Some slots pass no data. For the data each slot passes, see [About Dashboard Page Slots](https://dev.wix.com/docs/dashboard-extensions/dashboard-pages-built-by-wix/page-slots/about-dashboard-page-slots.md).

## See also

- [About Dashboard Menu Plugins](https://dev.wix.com/docs/dashboard-extensions/dashboard-menu-plugins/about-dashboard-menu-plugins.md)
- [Dashboard Menu Plugins](https://dev.wix.com/docs/overview/extensions-framework/dashboard-extensions/dashboard-menu-plugins.md)
- [Dashboard Modal Extension Files and Code](https://dev.wix.com/docs/dashboard-extensions/dashboard-modals/dashboard-modal-extension-files-and-code.md)
- [About Dashboard Page Slots](https://dev.wix.com/docs/dashboard-extensions/dashboard-pages-built-by-wix/page-slots/about-dashboard-page-slots.md)
- [Dashboard SDK](https://dev.wix.com/docs/sdk/host-modules/dashboard/introduction.md)