cleanup
This commit is contained in:
parent
0de87521b8
commit
4e0e1e2f2b
5 changed files with 10 additions and 24 deletions
|
@ -168,7 +168,7 @@ export default function WunderBar(props: Props) {
|
||||||
<ComboboxList>
|
<ComboboxList>
|
||||||
{uriFromQueryIsValid ? <WunderbarTopSuggestion query={nameFromQuery} /> : null}
|
{uriFromQueryIsValid ? <WunderbarTopSuggestion query={nameFromQuery} /> : null}
|
||||||
|
|
||||||
<div className="wunderbar__label--results">{__('Search Results')}</div>
|
<div className="wunderbar__label">{__('Search Results')}</div>
|
||||||
{results.slice(0, 5).map(uri => (
|
{results.slice(0, 5).map(uri => (
|
||||||
<WunderbarSuggestion key={uri} uri={uri} />
|
<WunderbarSuggestion key={uri} uri={uri} />
|
||||||
))}
|
))}
|
||||||
|
|
|
@ -8,11 +8,10 @@ import ChannelThumbnail from 'component/channelThumbnail';
|
||||||
type Props = {
|
type Props = {
|
||||||
claim: ?Claim,
|
claim: ?Claim,
|
||||||
uri: string,
|
uri: string,
|
||||||
noComboBox?: boolean,
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function WunderbarSuggestion(props: Props) {
|
export default function WunderbarSuggestion(props: Props) {
|
||||||
const { claim, uri, noComboBox = false } = props;
|
const { claim, uri } = props;
|
||||||
|
|
||||||
if (!claim) {
|
if (!claim) {
|
||||||
return null;
|
return null;
|
||||||
|
@ -20,12 +19,8 @@ export default function WunderbarSuggestion(props: Props) {
|
||||||
|
|
||||||
const isChannel = claim.value_type === 'channel';
|
const isChannel = claim.value_type === 'channel';
|
||||||
|
|
||||||
const Wrapper = noComboBox
|
|
||||||
? (props: any) => <div>{props.children}</div>
|
|
||||||
: (props: any) => <ComboboxOption value={uri}>{props.children}</ComboboxOption>;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Wrapper>
|
<ComboboxOption value={uri}>
|
||||||
<div
|
<div
|
||||||
className={classnames('wunderbar__suggestion', {
|
className={classnames('wunderbar__suggestion', {
|
||||||
'wunderbar__suggestion--channel': isChannel,
|
'wunderbar__suggestion--channel': isChannel,
|
||||||
|
@ -39,6 +34,6 @@ export default function WunderbarSuggestion(props: Props) {
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</Wrapper>
|
</ComboboxOption>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,12 +7,11 @@ const select = (state, props) => {
|
||||||
const uriFromQuery = `lbry://${props.query}`;
|
const uriFromQuery = `lbry://${props.query}`;
|
||||||
|
|
||||||
let uris = [uriFromQuery];
|
let uris = [uriFromQuery];
|
||||||
let channelUriFromQuery;
|
|
||||||
try {
|
try {
|
||||||
const { isChannel } = parseURI(uriFromQuery);
|
const { isChannel } = parseURI(uriFromQuery);
|
||||||
|
|
||||||
if (!isChannel) {
|
if (!isChannel) {
|
||||||
channelUriFromQuery = `lbry://@${props.query}`;
|
const channelUriFromQuery = `lbry://@${props.query}`;
|
||||||
uris.push(channelUriFromQuery);
|
uris.push(channelUriFromQuery);
|
||||||
}
|
}
|
||||||
} catch (e) {}
|
} catch (e) {}
|
||||||
|
|
|
@ -2,10 +2,8 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import LbcSymbol from 'component/common/lbc-symbol';
|
import LbcSymbol from 'component/common/lbc-symbol';
|
||||||
import WunderbarSuggestion from 'component/wunderbarSuggestion';
|
import WunderbarSuggestion from 'component/wunderbarSuggestion';
|
||||||
import { ComboboxOption } from '@reach/combobox';
|
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
query: string,
|
|
||||||
winningUri: ?string,
|
winningUri: ?string,
|
||||||
doResolveUris: (Array<string>) => void,
|
doResolveUris: (Array<string>) => void,
|
||||||
uris: Array<string>,
|
uris: Array<string>,
|
||||||
|
@ -13,7 +11,7 @@ type Props = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export default function WunderbarTopSuggestion(props: Props) {
|
export default function WunderbarTopSuggestion(props: Props) {
|
||||||
const { query, uris, resolvingUris, winningUri, doResolveUris } = props;
|
const { uris, resolvingUris, winningUri, doResolveUris } = props;
|
||||||
|
|
||||||
const stringifiedUris = JSON.stringify(uris);
|
const stringifiedUris = JSON.stringify(uris);
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
|
@ -46,13 +44,11 @@ export default function WunderbarTopSuggestion(props: Props) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<ComboboxOption value={winningUri} className="wunderbar__winning-claim">
|
|
||||||
<div className="wunderbar__label">
|
<div className="wunderbar__label">
|
||||||
<LbcSymbol postfix={__('Winning for "%query%"', { query })} />
|
<LbcSymbol prefix={__('Most Supported')} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<WunderbarSuggestion uri={winningUri} noComboBox />
|
<WunderbarSuggestion uri={winningUri} />
|
||||||
</ComboboxOption>
|
|
||||||
<hr className="wunderbar__top-separator" />
|
<hr className="wunderbar__top-separator" />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
|
@ -98,10 +98,6 @@
|
||||||
|
|
||||||
.wunderbar__label {
|
.wunderbar__label {
|
||||||
margin-bottom: var(--spacing-xs);
|
margin-bottom: var(--spacing-xs);
|
||||||
}
|
|
||||||
|
|
||||||
.wunderbar__label--results {
|
|
||||||
@extend .wunderbar__label;
|
|
||||||
margin-left: var(--spacing-xs);
|
margin-left: var(--spacing-xs);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue