import React, { useState } from 'react';

interface ISideBarLinkGroupProps {
  children: any;
  activecondition: any;
}

const SideBarLinkGroup = ({
  children,
  activecondition,
}: ISideBarLinkGroupProps): JSX.Element => {
  const [open, setOpen] = useState(activecondition);

  const handleClick = (): void => {
    setOpen(!open);
  };

  return (
    <li
      className={`pr-2 border-b last:border-b-0 py-4 ${activecondition && ''}`}
    >
      {children(handleClick, open)}
    </li>
  );
};

export default SideBarLinkGroup;