lbry-desktop/ui/component/livestreamLink/view.jsx
infinite-persistence a9a2270ae9 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).
2022-04-21 10:31:31 -04:00

33 lines
753 B
JavaScript

// @flow
import React from 'react';
import Card from 'component/common/card';
import ClaimPreview from 'component/claimPreview';
import { useHistory } from 'react-router';
import { formatLbryUrlForWeb } from 'util/url';
type Props = {
title?: string,
claimUri: string,
};
export default function LivestreamLink(props: Props) {
const { claimUri, title = null } = props;
const { push } = useHistory();
if (!claimUri) {
return null;
}
return (
<Card
className="livestream__channel-link claim-preview__live"
title={title || __('Live stream in progress')}
onClick={() => {
push(formatLbryUrlForWeb(claimUri));
}}
>
<ClaimPreview uri={claimUri} type="inline" hideMenu />
</Card>
);
}