/* eslint-disable react/jsx-props-no-spreading */
import React, { FunctionComponent } from 'react';
import { UsersPlusButton } from './components/plus-icon';
import { UsersCountButton } from './components/count-button';
import { UsersProps } from './types.d';

export const Users: FunctionComponent<UsersProps> = ({
  children,
  className = '',
  style,
  plusButton,
  countButton,
}): React.ReactElement => {
  return (
    <div className={`users ${className}`} style={style}>
      {children}
      {countButton ? <UsersCountButton {...countButton} /> : null}
      {plusButton ? <UsersPlusButton {...plusButton} /> : null}
    </div>
  );
};
