44 lines
1.2 KiB
JavaScript
44 lines
1.2 KiB
JavaScript
// @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,
|
|
noComboBox?: boolean,
|
|
};
|
|
|
|
export default function WunderbarSuggestion(props: Props) {
|
|
const { claim, uri, noComboBox = false } = props;
|
|
|
|
if (!claim) {
|
|
return null;
|
|
}
|
|
|
|
const isChannel = claim.value_type === 'channel';
|
|
|
|
const Wrapper = noComboBox
|
|
? (props: any) => <div>{props.children}</div>
|
|
: (props: any) => <ComboboxOption value={uri}>{props.children}</ComboboxOption>;
|
|
|
|
return (
|
|
<Wrapper>
|
|
<div
|
|
className={classnames('wunderbar__suggestion', {
|
|
'wunderbar__suggestion--channel': isChannel,
|
|
})}
|
|
>
|
|
{isChannel ? <ChannelThumbnail uri={uri} /> : <FileThumbnail uri={uri} />}
|
|
<span className="wunderbar__suggestion-label">
|
|
<div>{claim.value.title}</div>
|
|
<div className="wunderbar__suggestion-name">
|
|
{isChannel ? claim.name : (claim.signing_channel && claim.signing_channel.name) || __('Anonymous')}
|
|
</div>
|
|
</span>
|
|
</div>
|
|
</Wrapper>
|
|
);
|
|
}
|