In your React-TS project, you can easily add menus to the sidebar by modifying the MENUITEMS array in the sidebarmenu.jsx (src/common/sidebarmenu.jsx) file. The sidebar will dynamically display the menus based on the contents of this array.

Steps:

1 .Open sidebarmenu.jsx File:

Open the sidebarmenu.jsx (src/common/sidebarmenu.jsx) file in your React-JS 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",
					Items:[
          title: 'Your Component Title',
          selected: false,
          icon: 'icon-name',
          type: 'link', // or 'sub', 'mega-menu', 'external', 'empty'
          path: '/path-to-route', // Specify the route path for link type
          active: false,
          badgeClass: 'badge-class', // (optional) Add a badge to the menu item
          badgeValue: '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",
					Items:[
          title: 'Your Component Title',
          selected: false,
          icon: 'icon-name',
          type: 'link', // or 'sub', 'mega-menu', 'external', 'empty'
          active: false,
          badgeClass: 'badge-class', // (optional) Add a badge to the menu item
          badgeValue: 'Badge Text', // (optional) Text to display in the badge
          children: [
           // (optional) Define child items for sub-menu or mega-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, mega-menu, external, empty).
• path: Specify the route path for link type menu.
• Menusub: Set to true for sub-menu or mega-menu types.
• active: Set to true to mark this menu as active.
• badgeClass (optional): CSS class for the badge.
• badgeValue (optional): Text to display in the badge.
• children: Define an array of child menu items for sub-menu or mega-menu type.

3 . Save the Changes:

After adding your menu items, save the changes made to the sidebarmenu.jsx (src/common/sidebarmenu.jsx) 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.