cleanup

ui/component/wunderbar/view.jsx

@@ -168,7 +168,7 @@ export default function WunderBar(props: Props) {
             <ComboboxList>
               {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 => (
                 <WunderbarSuggestion key={uri} uri={uri} />
               ))}

ui/component/wunderbarSuggestion/view.jsx

@@ -8,11 +8,10 @@ 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;
+  const { claim, uri } = props;
 
   if (!claim) {
     return null;
@@ -20,12 +19,8 @@ export default function WunderbarSuggestion(props: Props) {
 
   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>
+    <ComboboxOption value={uri}>
       <div
         className={classnames('wunderbar__suggestion', {
           'wunderbar__suggestion--channel': isChannel,
@@ -39,6 +34,6 @@ export default function WunderbarSuggestion(props: Props) {
           </div>
         </span>
       </div>
-    </Wrapper>
+    </ComboboxOption>
   );
 }

ui/component/wunderbarTopSuggestion/index.js

@@ -7,12 +7,11 @@ const select = (state, props) => {
   const uriFromQuery = `lbry://${props.query}`;
 
   let uris = [uriFromQuery];
-  let channelUriFromQuery;
   try {
     const { isChannel } = parseURI(uriFromQuery);
 
     if (!isChannel) {
-      channelUriFromQuery = `lbry://@${props.query}`;
+      const channelUriFromQuery = `lbry://@${props.query}`;
       uris.push(channelUriFromQuery);
     }
   } catch (e) {}

ui/component/wunderbarTopSuggestion/view.jsx

@@ -2,10 +2,8 @@
 import React from 'react';
 import LbcSymbol from 'component/common/lbc-symbol';
 import WunderbarSuggestion from 'component/wunderbarSuggestion';
-import { ComboboxOption } from '@reach/combobox';
 
 type Props = {
-  query: string,
   winningUri: ?string,
   doResolveUris: (Array<string>) => void,
   uris: Array<string>,
@@ -13,7 +11,7 @@ type 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);
   React.useEffect(() => {
@@ -46,13 +44,11 @@ export default function WunderbarTopSuggestion(props: Props) {
 
   return (
     <>
-      <ComboboxOption value={winningUri} className="wunderbar__winning-claim">
-        <div className="wunderbar__label">
-          <LbcSymbol postfix={__('Winning for "%query%"', { query })} />
-        </div>
+      <div className="wunderbar__label">
+        <LbcSymbol prefix={__('Most Supported')} />
+      </div>
 
-        <WunderbarSuggestion uri={winningUri} noComboBox />
-      </ComboboxOption>
+      <WunderbarSuggestion uri={winningUri} />
       <hr className="wunderbar__top-separator" />
     </>
   );

ui/scss/component/_wunderbar.scss

@@ -98,10 +98,6 @@
 
 .wunderbar__label {
   margin-bottom: var(--spacing-xs);
-}
-
-.wunderbar__label--results {
-  @extend .wunderbar__label;
   margin-left: var(--spacing-xs);
 }