In your NextJS-Typescript project, you can easily add menus to the sidebar by modifying the MENUITEMS array in the sidebar.tsx (shared/layout-components/sidebar/sidebar.tsx) file. The sidebar will dynamically display the menus based on the contents of this array.

Steps:

1 .Open sidebar.tsx File:

Open the sidebar.tsx (shared/layout-components/sidebar/sidebar.tsx) file in your NextJS-Typescript project. This file contains the MENUITEMS array that defines the menus to be displayed in the sidebar.

To add the parent Menu Items:

Inside the MENUITEMS array, you can add your menu items using the following format:

		{
		menutitle: "Your Menu Title",
						},
						{
		title: 'Your Component Title',
		selected: false,
		icon: 'icon-name',
		type: 'link', // or 'sub',  'external', 'empty'
		path: '/path-to-route', // Specify the route path for link type
		active: false,
		badge: 'badge-class', // (optional) Add a badge to the menu item
		badgetxt: 'Badge Text', // (optional) Text to display in the badge
		}

To add the children Menu Items:

Inside the MENUITEMS array, you can add your menu items using the following format:

		{
		menutitle: "Your Menu Title",
						},
						{
		title: 'Your Component Title',
		selected: false,
		icon: 'icon-name',
		type: 'link', // or 'sub', 'external', 'empty'
		active: false,
		badge: 'badge-class', // (optional) Add a badge to the menu item
		badgetxt: 'Badge Text', // (optional) Text to display in the badge
		children: [
		// (optional) Define child items for sub-menu  type
		{
			path: '/child-path',
			title: 'Child Menu Title',
			type: 'link',
			selected: false,
		},
		// Add more child items if needed
		],
		}

• menutitle: The display name of the menu.
• title: The display name of the component.
• selected: Set to true if this menu is currently selected.
• icon: The icon to display next to the menu.
• type: Specify the type of the menu item (link, sub, external, empty).
• path: Specify the route path for link type menu.
• Menusub: Set to true for sub-menu types.
• active: Set to true to mark this menu as active.
• badge (optional): CSS class for the badge.
• badgetxt (optional): Text to display in the badge.
• children: Define an array of child menu items for sub-menu type.

3 . Save the Changes:

After adding your menu items, save the changes made to the sidebar.tsx (shared/layout-components/sidebar/sidebar.tsx) file.

4 . View Sidebar Changes:

The sidebar will now automatically display the added menu items based on the modifications you made in the MENUITEMS array.