LivestreamLink: fix flicker when a child updates
## Ticket 1358 - flicker on livestream tile when viewers updates ## Change Defining the component that way results in unique Card wrapper on each resolve, so everything gets torn down and re-mounted, causing the flicker. There is a css side-effect though: the tags changed from red to black. But tags are inconsistent through the app ... sometimes black, sometimes red (I think it should always be red + smaller font from the body).
This commit is contained in:
parent
126ecd38fa
commit
a9a2270ae9
1 changed files with 6 additions and 4 deletions
|
@ -15,7 +15,11 @@ export default function LivestreamLink(props: Props) {
|
||||||
const { claimUri, title = null } = props;
|
const { claimUri, title = null } = props;
|
||||||
const { push } = useHistory();
|
const { push } = useHistory();
|
||||||
|
|
||||||
const element = (props: { children: any }) => (
|
if (!claimUri) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
<Card
|
<Card
|
||||||
className="livestream__channel-link claim-preview__live"
|
className="livestream__channel-link claim-preview__live"
|
||||||
title={title || __('Live stream in progress')}
|
title={title || __('Live stream in progress')}
|
||||||
|
@ -23,9 +27,7 @@ export default function LivestreamLink(props: Props) {
|
||||||
push(formatLbryUrlForWeb(claimUri));
|
push(formatLbryUrlForWeb(claimUri));
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{props.children}
|
<ClaimPreview uri={claimUri} type="inline" hideMenu />
|
||||||
</Card>
|
</Card>
|
||||||
);
|
);
|
||||||
|
|
||||||
return claimUri ? <ClaimPreview uri={claimUri} wrapperElement={element} type="inline" /> : null;
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue