i have used menu and menu.item from ant , but im facing one issue BC im using one react component to draw the menu for a list array that includes menus and submenus .

this how it's look

and this is my code

 <StyledCollapse ghost>
          {categoriesTree ? (
            categoriesTree.map((item, index) => {
              return (
                <Panel key={index} header={<StyledCategoryRow>{item.name}</StyledCategoryRow>}>
                  <StyledMenu multiple={false}>
                    {item.names.map((category, index) => {
                      return (
                        <StyledPlanMenuItem key={index}>
                          <Row align="middle" gutter={[8, 0]}>
                            <Col span={24}>
                              <Link to={getUrl(`/${category.name.replace(/\s/g, '')}`)}>
                                {category.name}
                              </Link>
                            </Col>
                          </Row>
                        </StyledPlanMenuItem>
                      );
                    })}
                  </StyledMenu>
                </Panel>
              );
            })
          ) : (
            <Spin />
          )}
        </StyledCollapse>

i want to select only one menu.item at one time