Fix slowly disappearing NUX element

Summary: This issue was reported in the dogfooding group. https://fb.prod.workplace.com/groups/748354712423318/permalink/759865114605611/

Reviewed By: jknoxville

Differential Revision: D24918536

fbshipit-source-id: 7c353dfe1230fa98964216a35e9679a90f398e1d
This commit is contained in:
Michel Weststrate
2020-11-12 04:10:55 -08:00
committed by Facebook GitHub Bot
parent 7d29f84ae0
commit ba541e76dc

View File

@@ -104,7 +104,7 @@ export function NUX({
}, [title, manager, pluginInstance]); }, [title, manager, pluginInstance]);
return ( return (
<Badge <UnanimatedBadge
count={ count={
isRead ? ( isRead ? (
0 0
@@ -130,10 +130,18 @@ export function NUX({
) )
}> }>
{children} {children}
</Badge> </UnanimatedBadge>
); );
} }
// We force visibility of the badge to invisible if count has dropped,
// otherwise ANT will await animation end, which looks really awkard, see D24918536
const UnanimatedBadge = styled(Badge)(({count}) => ({
'.ant-scroll-number-custom-component': {
visibility: count === 0 ? 'hidden' : undefined,
},
}));
const pulse = keyframes({ const pulse = keyframes({
'0%': { '0%': {
opacity: 0.2, opacity: 0.2,