plane/web/components/core/favorite-star.tsx

29 lines
745 B
TypeScript

import { Star } from "lucide-react";
// helpers
import { cn } from "@/helpers/common.helper";
type Props = {
buttonClassName?: string;
iconClassName?: string;
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
selected: boolean;
};
export const FavoriteStar: React.FC<Props> = (props) => {
const { buttonClassName, iconClassName, onClick, selected } = props;
return (
<button type="button" className={cn("h-4 w-4 grid place-items-center", buttonClassName)} onClick={onClick}>
<Star
className={cn(
"h-4 w-4 text-custom-text-300 transition-all",
{
"fill-yellow-500 stroke-yellow-500": selected,
},
iconClassName
)}
/>
</button>
);
};