Bounty feat: Add NotificationDot component #208
Conversation
|
|
||
| const NotificationDot: React.FC<NotificationDotProps> = ({ invisible = false, children, ...props }) => ( | ||
| <NotificationDotRoot> | ||
| {Children.map(children, (child: ReactElement) => cloneElement(child, props))} |
There was a problem hiding this comment.
What is the reason for cloning?
There was a problem hiding this comment.
ButtonMenu sets props to it's direct children, so NotificatonDot will receive MenuItem's props. then I use clone to pass the props to MenuItems.
https://github.com/pancakeswap/pancake-uikit/blob/master/src/components/ButtonMenu/ButtonMenu.tsx#L14-L23
| background-color: ${({ theme }) => theme.colors.failure}; | ||
| `; | ||
|
|
||
| const NotificationDot: React.FC<NotificationDotProps> = ({ invisible = false, children, ...props }) => ( |
There was a problem hiding this comment.
Can we flip the invisible prop? Instead of negative assertion can we use a positive one. By default it should not show so the prop name should be something like show.
|
If the requirement is just to add this dot on the profile icon, there is not need for a separated component, a pseudo class |
@RabbitDoge it will be added on buttons and menu items |
Support NotificationDot for Button, MenuItem, ...