Brisanet/ion-react

View on GitHub
src/components/dropdown/dropdownItem/dropdownItem.tsx

Summary

Maintainability
A
0 mins
Test Coverage
A
100%
import { useState } from 'react';
import { IonIcon, IonIconProps } from '../../icons';
import { Container, Label } from './styles';
 
export interface DropdownItemProps {
label: string;
icon?: IonIconProps['type'];
selected?: boolean;
disabled?: boolean;
onClick?: () => void;
}
 
Function `IonDropdownItem` has a Cognitive Complexity of 7 (exceeds 5 allowed). Consider refactoring.
export const IonDropdownItem = ({
label,
selected,
disabled,
icon,
onClick,
}: DropdownItemProps) => {
const [hover, setHover] = useState(false);
 
const handleHover = () => {
if (!disabled) {
setHover(true);
}
};
 
const handleUnhover = () => {
setHover(false);
};
 
const handleClick = () => {
if (!disabled && onClick) {
onClick();
}
};
 
return (
<Container
$selected={selected}
$disabled={disabled}
onMouseEnter={handleHover}
onMouseLeave={handleUnhover}
onClick={handleClick}
>
<Label>
{icon && <IonIcon type={icon} size={16} />}
<span>{label}</span>
</Label>
{selected && <IonIcon type={hover ? 'close' : 'check'} size={16} />}
</Container>
);
};