lbry-desktop/ui/component/wunderbarSuggestion/view.jsx

40 lines
1.1 KiB
React
Raw Normal View History

2020-12-03 18:29:47 +01:00
// @flow
import React from 'react';
import classnames from 'classnames';
import { ComboboxOption } from '@reach/combobox';
import FileThumbnail from 'component/fileThumbnail';
import ChannelThumbnail from 'component/channelThumbnail';
type Props = {
claim: ?Claim,
uri: string,
};
export default function WunderbarSuggestion(props: Props) {
2020-12-03 22:06:54 +01:00
const { claim, uri } = props;
2020-12-03 18:29:47 +01:00
if (!claim) {
return null;
}
const isChannel = claim.value_type === 'channel';
return (
2020-12-03 22:06:54 +01:00
<ComboboxOption value={uri}>
2020-12-03 18:29:47 +01:00
<div
className={classnames('wunderbar__suggestion', {
'wunderbar__suggestion--channel': isChannel,
})}
>
{isChannel ? <ChannelThumbnail uri={uri} /> : <FileThumbnail uri={uri} />}
<span className="wunderbar__suggestion-label">
<div className="wunderbar__suggestion-title">{claim.value.title}</div>
2020-12-03 18:29:47 +01:00
<div className="wunderbar__suggestion-name">
{isChannel ? claim.name : (claim.signing_channel && claim.signing_channel.name) || __('Anonymous')}
</div>
</span>
</div>
2020-12-03 22:06:54 +01:00
</ComboboxOption>
2020-12-03 18:29:47 +01:00
);
}