How to add dropdown in sidebar

[dalpat]

How to add dropdown menu in sidebar in menuitems js

{
    title: "Buttons",
    icon: "disc",
    href: "/buttons",
  },
  {
    title: "Forms",
    icon: "layout",
    href: "/forms",
  },
  {
    title: "Alerts",
    icon: "info",
    href: "/alerts",
  },
...

Thanks :)

[dalpat]

I've managed to do it like this

const [openm, setOpenm] = React.useState(true);

  const handleClickm = () => {
    setOpenm(!openm);
  };

and then

<ListItemButton onClick={handleClickm}>
    <ListItemIcon>
      <FeatherIcon
        style={{
          color: "",
        }}
        icon='inbox'
        width="20"
        height="20"
      />
    </ListItemIcon>
    <ListItemText primary="Admin Stuff" />
    {openm ? <FontAwesomeIcon icon={faAngleUp} /> : <FontAwesomeIcon icon={faAngleDown} />}
</ListItemButton>

<Collapse in={openm} timeout="auto" unmountOnExit>
    <List component="div" disablePadding>

      {/* List item 1 */}
      <ListItemButton sx={{ pl: 4 }}>
        <ListItemIcon>
          <FontAwesomeIcon icon={faUsersCog} />
        </ListItemIcon>
        <ListItemText primary="Roles" />
      </ListItemButton>

      {/* List item 2 */}
      <ListItemButton sx={{ pl: 4 }}>
        <ListItemIcon>
          <FontAwesomeIcon icon={faLock} />
        </ListItemIcon>
        <ListItemText primary="Permissions" />
      </ListItemButton>

    </List>
  </Collapse>

For now its working but still no clue about how to add in menuitem js using that json syntax.