const CategoriesList = ({ categories }) => {
    const dropDownCategories = (categories, name) => (
            <Dropdown text={name} pointing className='link item'>
                <Dropdown.Menu>
                    {categories.map((category) => {
                        if (category.sublevels)
                            return (<Dropdown.Item key={category.id}>{dropDownCategories(category.sublevels, category.name)}</Dropdown.Item>)
                        return (<Dropdown.Item onClick={() => alert(category.id)} key={category.id}>{category.name}</Dropdown.Item>)
                    })}
                </Dropdown.Menu>
            </Dropdown>
        )
  return (
      <div className="categories-list">
        {dropDownCategories(Object.values(categories), "Categories")}
      </div>
  )
}