show loading while searching

fixes

bump

bump

package.json

@@ -140,7 +140,7 @@
     "imagesloaded": "^4.1.4",
     "json-loader": "^0.5.4",
     "lbry-format": "https://github.com/lbryio/lbry-format.git",
-    "lbry-redux": "lbryio/lbry-redux#664df6237d777d7cce31e58479bc98563ea98cb9",
+    "lbry-redux": "lbryio/lbry-redux#35bfae1a86a472cc41c1186610c229be0c506dbe",
     "lbryinc": "lbryio/lbryinc#eee2cb730ecec95a1344a755035755b0d4dad5cf",
     "lint-staged": "^7.0.2",
     "localforage": "^1.7.1",

ui/component/claimEffectiveAmount/index.js

@@ -1,9 +1,9 @@
 import { connect } from 'react-redux';
 import { makeSelectClaimForUri } from 'lbry-redux';
-import ClaimRepostAuthor from './view';
+import ClaimEffectiveAmount from './view';
 
 const select = (state, props) => ({
-  claim: makeSelectClaimForUri(props.uri, false)(state),
+  claim: makeSelectClaimForUri(props.uri, true)(state),
 });
 
-export default connect(select)(ClaimRepostAuthor);
+export default connect(select)(ClaimEffectiveAmount);

ui/component/claimEffectiveAmount/view.jsx

@@ -14,7 +14,7 @@ function ClaimEffectiveAmount(props: Props) {
     return null;
   }
 
-  return <CreditAmount amount={Number(claim.meta.effective_amount || claim.amount)} />;
+  return <CreditAmount amount={Number(claim.repost_bid_amount || claim.meta.effective_amount || claim.amount)} />;
 }
 
 export default ClaimEffectiveAmount;

ui/component/claimPreview/claim-preview-no-content.jsx

@@ -18,7 +18,7 @@ function ClaimPreviewNoContent(props: Props) {
       })}
     >
       <div
-        className={classnames('claim-preview', {
+        className={classnames('claim-preview claim-preview--inactive', {
           'claim-preview--large': type === 'large',
           'claim-preview__empty': true,
         })}

ui/component/claimPreview/claim-preview-no-mature.jsx

@@ -6,10 +6,11 @@ import Empty from 'component/common/empty';
 type Props = {
   isChannel: boolean,
   type: string,
+  message: string,
 };
 
-function ClaimPreviewNoMature(props: Props) {
-  const { isChannel, type } = props;
+function ClaimPreviewHidden(props: Props) {
+  const { isChannel, type, message } = props;
   return (
     <li
       className={classnames('claim-preview__wrapper', {
@@ -17,19 +18,16 @@ function ClaimPreviewNoMature(props: Props) {
         'claim-preview__wrapper--inline': type === 'inline',
       })}
     >
-      <div className={classnames('claim-preview', { 'claim-preview--large': type === 'large' })}>
+      <div
+        className={classnames('claim-preview  claim-preview--inactive claim-preview--empty', {
+          'claim-preview--large': type === 'large',
+        })}
+      >
         <div className="media__thumb" />
-        <div
-          className={classnames('claim-preview', {
-            'claim-preview--large': type === 'large',
-            'claim-preview__empty': true,
-          })}
-        >
-          <Empty text={__('Mature content hidden by your preferences')} />
-        </div>
+        <Empty text={message} />
       </div>
     </li>
   );
 }
 
-export default ClaimPreviewNoMature;
+export default ClaimPreviewHidden;

ui/component/claimPreview/index.js

@@ -5,7 +5,6 @@ import {
   makeSelectIsUriResolving,
   makeSelectClaimIsMine,
   makeSelectClaimIsPending,
-  makeSelectCoverForUri,
   makeSelectClaimIsNsfw,
   doFileGet,
   makeSelectReflectingClaimForUri,
@@ -22,11 +21,12 @@ import ClaimPreview from './view';
 const select = (state, props) => ({
   pending: props.uri && makeSelectClaimIsPending(props.uri)(state),
   claim: props.uri && makeSelectClaimForUri(props.uri)(state),
-  reflectingInfo: props.uri && makeSelectReflectingClaimForUri(props.uri)(state),
+  reflectingProgress: props.uri && makeSelectReflectingClaimForUri(props.uri)(state),
   obscureNsfw: !selectShowMatureContent(state),
   claimIsMine: props.uri && makeSelectClaimIsMine(props.uri)(state),
   isResolvingUri: props.uri && makeSelectIsUriResolving(props.uri)(state),
-  cover: props.uri && makeSelectCoverForUri(props.uri)(state),
+  isResolvingRepost: props.uri && makeSelectIsUriResolving(props.repostUrl)(state),
+  repostClaim: props.uri && makeSelectClaimForUri(props.uri)(state),
   nsfw: props.uri && makeSelectClaimIsNsfw(props.uri)(state),
   blackListedOutpoints: selectBlackListedOutpoints(state),
   filteredOutpoints: selectFilteredOutpoints(state),

ui/component/claimPreview/view.jsx

@@ -23,7 +23,7 @@ import FileDownloadLink from 'component/fileDownloadLink';
 import AbandonedChannelPreview from 'component/abandonedChannelPreview';
 import PublishPending from 'component/publishPending';
 import ClaimPreviewLoading from './claim-preview-loading';
-import ClaimPreviewNoMature from './claim-preview-no-mature';
+import ClaimPreviewHidden from './claim-preview-no-mature';
 import ClaimPreviewNoContent from './claim-preview-no-content';
 
 type Props = {
@@ -33,7 +33,7 @@ type Props = {
   showUserBlocked: boolean,
   claimIsMine: boolean,
   pending?: boolean,
-  reflectingInfo?: any, // fxme
+  reflectingProgress?: any, // fxme
   resolveUri: string => void,
   isResolvingUri: boolean,
   history: { push: string => void },
@@ -55,6 +55,7 @@ type Props = {
   isSubscribed: boolean,
   actions: boolean | Node | string | number,
   properties: boolean | Node | string | number | (Claim => Node),
+  empty?: Node,
   onClick?: any => any,
   hideBlock?: boolean,
   streamingUrl: ?string,
@@ -67,49 +68,58 @@ type Props = {
   renderActions?: Claim => ?Node,
   wrapperElement?: string,
   hideRepostLabel?: boolean,
+  repostUrl?: string,
 };
 
 const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   const {
-    obscureNsfw,
-    claimIsMine,
-    pending,
-    reflectingInfo,
-    history,
+    // core
     uri,
-    isResolvingUri,
-    nsfw,
-    resolveUri,
     claim,
-    placeholder,
-    type,
-    blackListedOutpoints,
-    filteredOutpoints,
-    blockedChannelUris,
-    hasVisitedUri,
-    showUserBlocked,
-    channelIsBlocked,
+    isResolvingUri,
+    // core actions
+    getFile,
+    resolveUri,
+    // claim properties
+    nsfw,
+    claimIsMine,
     isSubscribed,
-    actions,
+    streamingUrl,
+    // user properties
+    channelIsBlocked,
+    hasVisitedUri,
+    // component
+    history,
+    wrapperElement,
+    type,
+    placeholder,
+    // pending
+    reflectingProgress,
+    pending,
+    empty,
+    // modifiers
+    customShouldHide,
+    showNullPlaceholder,
+    obscureNsfw,
+    showUserBlocked,
+    showUnresolvedClaim,
+    hideRepostLabel = false,
+    hideActions = false,
     properties,
     onClick,
     hideBlock,
-    getFile,
-    streamingUrl,
-    customShouldHide,
-    showUnresolvedClaim,
-    showNullPlaceholder,
+    actions,
+    blockedChannelUris,
+    blackListedOutpoints,
+    filteredOutpoints,
     includeSupportAction,
-    hideActions = false,
     renderActions,
-    wrapperElement,
-    hideRepostLabel = false,
+    // repostUrl,
   } = props;
   const WrapperElement = wrapperElement || 'li';
   const shouldFetch =
     claim === undefined || (claim !== null && claim.value_type === 'channel' && isEmpty(claim.meta) && !pending);
   const abandoned = !isResolvingUri && !claim;
-  const showPublishLink = abandoned && !showUnresolvedClaim && placeholder === 'publish';
   const shouldHideActions = hideActions || type === 'small' || type === 'tooltip';
   const canonicalUrl = claim && claim.canonical_url;
   let isValid = false;
@@ -122,7 +132,8 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
     }
   }
 
-  const isChannel = isValid ? parseURI(uri).isChannel : false;
+  const contentUri = hideRepostLabel && claim && claim.repost_url ? claim.canonical_url || claim.permanent_url : uri;
+  const isChannel = isValid ? parseURI(contentUri).isChannel : false;
   const signingChannel = claim && claim.signing_channel;
   const navigateUrl = formatLbryUrlForWeb((claim && claim.canonical_url) || uri || '/');
   const navLinkProps = {
@@ -134,7 +145,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   let shouldHide =
     placeholder !== 'loading' &&
     !showUserBlocked &&
-    ((abandoned && !showUnresolvedClaim && !showPublishLink) || (!claimIsMine && obscureNsfw && nsfw));
+    ((abandoned && !showUnresolvedClaim) || (!claimIsMine && obscureNsfw && nsfw));
 
   // This will be replaced once blocking is done at the wallet server level
   if (claim && !claimIsMine && !shouldHide && blackListedOutpoints) {
@@ -171,7 +182,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
 
   // Weird placement warning
   // Make sure this happens after we figure out if this claim needs to be hidden
-  const thumbnailUrl = useGetThumbnail(uri, claim, streamingUrl, getFile, shouldHide);
+  const thumbnailUrl = useGetThumbnail(contentUri, claim, streamingUrl, getFile, shouldHide);
 
   function handleContextMenu(e) {
     // @if TARGET='app'
@@ -195,31 +206,37 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
   }
 
   useEffect(() => {
-    if (isValid && !isResolvingUri && shouldFetch && uri) {
+    if (isValid && shouldFetch && uri) {
       resolveUri(uri);
     }
-  }, [isValid, isResolvingUri, uri, resolveUri, shouldFetch]);
+  }, [isValid, uri, resolveUri, shouldFetch]);
 
   if (shouldHide && !showNullPlaceholder) {
     return null;
   }
 
-  if (placeholder === 'loading' || (isResolvingUri && !claim)) {
+  if (placeholder === 'loading' || (uri && !claim && isResolvingUri)) {
     return <ClaimPreviewLoading isChannel={isChannel} type={type} />;
   }
 
   if (claim && showNullPlaceholder && shouldHide && nsfw) {
-    return <ClaimPreviewNoMature isChannel={isChannel} type={type} />;
+    return (
+      <ClaimPreviewHidden message={__('Mature content hidden by your preferences')} isChannel={isChannel} type={type} />
+    );
   }
 
-  if (!claim && showNullPlaceholder) {
-    return <ClaimPreviewNoContent isChannel={isChannel} type={type} />;
+  if (claim && showNullPlaceholder && shouldHide) {
+    return <ClaimPreviewHidden message={__('This content is hidden')} isChannel={isChannel} type={type} />;
+  }
+
+  if (!claim && (showNullPlaceholder || empty)) {
+    return empty || <ClaimPreviewNoContent isChannel={isChannel} type={type} />;
   }
 
   if (!shouldFetch && showUnresolvedClaim && !isResolvingUri && claim === null) {
-    return <AbandonedChannelPreview uri={uri} type />;
+    return <AbandonedChannelPreview uri={contentUri} type />;
   }
-  if (placeholder === 'publish' && !claim && uri.startsWith('lbry://@')) {
+  if (placeholder === 'publish' && !claim && contentUri.startsWith('lbry://@')) {
     return null;
   }
 
@@ -249,12 +266,12 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
         })}
       >
         {isChannel && claim ? (
-          <UriIndicator uri={uri} link>
-            <ChannelThumbnail uri={uri} obscure={channelIsBlocked} />
+          <UriIndicator uri={contentUri} link>
+            <ChannelThumbnail uri={contentUri} obscure={channelIsBlocked} />
           </UriIndicator>
         ) : (
           <>
-            {showPublishLink ? null : !pending ? (
+            {!pending ? (
               <NavLink {...navLinkProps}>
                 <FileThumbnail thumbnail={thumbnailUrl}>
                   {/* @if TARGET='app' */}
@@ -265,7 +282,7 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
                   )}
                   {/* @endif */}
                   <div className="claim-preview__file-property-overlay">
-                    <FileProperties uri={uri} small />
+                    <FileProperties uri={contentUri} small />
                   </div>
                 </FileThumbnail>
               </NavLink>
@@ -279,15 +296,15 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
           <div className="claim-preview-metadata">
             <div className="claim-preview-info">
               {pending ? (
-                <ClaimPreviewTitle uri={uri} />
+                <ClaimPreviewTitle uri={contentUri} />
               ) : (
                 <NavLink {...navLinkProps}>
-                  <ClaimPreviewTitle uri={uri} />
+                  <ClaimPreviewTitle uri={contentUri} />
                 </NavLink>
               )}
             </div>
-            <ClaimPreviewSubtitle uri={uri} type={type} />
-            {(pending || !!reflectingInfo) && <PublishPending uri={uri} />}
+            <ClaimPreviewSubtitle uri={contentUri} type={type} />
+            {(pending || !!reflectingProgress) && <PublishPending uri={uri} />}
           </div>
           {type !== 'small' && (
             <div className="claim-preview__actions">
@@ -299,12 +316,12 @@ const ClaimPreview = forwardRef<any, {}>((props: Props, ref: any) => {
                   ) : (
                     <div className="claim-preview__primary-actions">
                       {isChannel && !channelIsBlocked && !claimIsMine && (
-                        <SubscribeButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} />
+                        <SubscribeButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
                       )}
                       {!hideBlock && isChannel && !isSubscribed && (!claimIsMine || channelIsBlocked) && (
-                        <BlockButton uri={uri.startsWith('lbry://') ? uri : `lbry://${uri}`} />
+                        <BlockButton uri={contentUri.startsWith('lbry://') ? contentUri : `lbry://${contentUri}`} />
                       )}
-                      {includeSupportAction && <ClaimSupportButton uri={uri} />}
+                      {includeSupportAction && <ClaimSupportButton uri={contentUri} />}
                     </div>
                   )}
                 </>

ui/component/claimRepostAuthor/view.jsx

@@ -8,16 +8,26 @@ import Icon from 'component/common/icon';
 type Props = {
   uri: string,
   claim: ?Claim,
+  short: boolean,
 };
 
 function ClaimRepostAuthor(props: Props) {
-  const { claim } = props;
+  const { claim, short } = props;
   const repostChannelUrl = claim && claim.repost_channel_url;
+  const repostUrl = claim && claim.repost_url;
 
   if (!repostChannelUrl) {
     return null;
   }
 
+  if (short) {
+    return (
+      <span className="claim-preview__repost-author">
+        <Icon icon={ICONS.REPOST} size={14} />
+        <span>{repostUrl}</span>
+      </span>
+    );
+  }
   return (
     <div className="claim-preview__repost-author">
       <Icon icon={ICONS.REPOST} size={10} />

ui/component/common/empty.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 import classnames from 'classnames';
 
 type Props = {
-  text: ?string,
+  text: string,
   padded?: boolean,
 };
 

ui/component/repostCreate/index.js

@@ -21,10 +21,10 @@ import RepostCreate from './view';
 const select = (state, props) => ({
   channels: selectMyChannelClaims(state),
   claim: makeSelectClaimForUri(props.uri)(state),
-  passedRepostClaim: makeSelectClaimForUri(props.name)(state),
+  passedRepostClaim: makeSelectClaimForUri(props.name, false)(state),
   passedRepostAmount: makeSelectEffectiveAmountForUri(props.name)(state),
   enteredContentClaim: makeSelectClaimForUri(props.contentUri)(state),
-  enteredRepostClaim: makeSelectClaimForUri(props.repostUri)(state),
+  enteredRepostClaim: makeSelectClaimForUri(props.repostUri, false)(state),
   enteredRepostAmount: makeSelectEffectiveAmountForUri(props.repostUri)(state),
   title: makeSelectTitleForUri(props.uri)(state),
   balance: selectBalance(state),

ui/component/repostCreate/view.jsx

@@ -86,14 +86,14 @@ function RepostCreate(props: Props) {
 
   const contentFirstRender = React.useRef(true);
   const setAutoRepostBid = amount => {
-    if (balance > amount) {
-      if (amount > 5) {
+    if (balance && balance > 0.02) {
+      if (uri) {
+        setRepostBid(0.01);
+      } else if (balance > amount) {
         setRepostBid(Number(amount.toFixed(2)));
       } else {
-        setRepostBid(5);
+        setRepostBid(0.01);
       }
-    } else if (balance) {
-      setRepostBid(0.01);
     }
   };
 

ui/component/searchTopClaim/view.jsx

@@ -6,6 +6,7 @@ import { parseURI } from 'lbry-redux';
 import ClaimPreview from 'component/claimPreview';
 import Button from 'component/button';
 import ClaimEffectiveAmount from 'component/claimEffectiveAmount';
+import ClaimRepostAuthor from 'component/claimRepostAuthor';
 import I18nMessage from 'component/i18nMessage';
 import { useHistory } from 'react-router';
 import LbcSymbol from 'component/common/lbc-symbol';
@@ -21,6 +22,7 @@ type Props = {
   pendingIds: Array<string>,
   isResolvingWinningUri: boolean,
   winningClaim: ?Claim,
+  isSearching: boolean,
 };
 
 export default function SearchTopClaim(props: Props) {
@@ -33,6 +35,7 @@ export default function SearchTopClaim(props: Props) {
     setChannelActive,
     beginPublish,
     isResolvingWinningUri,
+    isSearching,
   } = props;
   const uriFromQuery = `lbry://${query}`;
   const { push } = useHistory();
@@ -70,9 +73,9 @@ export default function SearchTopClaim(props: Props) {
     }
   }, [doResolveUris, uriFromQuery, channelUriFromQuery]);
 
-  if (winningUri && !winningClaim && isResolvingWinningUri) {
-    return null;
-  }
+  // if (winningUri && !winningClaim && isResolvingWinningUri) {
+  //   return null;
+  // }
 
   return (
     <div className="search__header">
@@ -87,21 +90,27 @@ export default function SearchTopClaim(props: Props) {
           </a>
         </div>
       )}
-      {winningUri && (
+      {winningUri && winningClaim && (
         <div className="card">
           <ClaimPreview
             hideRepostLabel
+            showNullPlaceholder
             uri={winningUri}
-            type="large"
             properties={claim => (
               <span className="claim-preview__custom-properties">
+                <ClaimRepostAuthor short uri={winningUri} />
                 <ClaimEffectiveAmount uri={winningUri} />
               </span>
             )}
           />
         </div>
       )}
-      {!winningUri && uriFromQuery && (
+      {!winningUri && (isSearching || isResolvingWinningUri) && (
+        <div className="card">
+          <ClaimPreview placeholder={'loading'} />
+        </div>
+      )}
+      {!winningUri && !isSearching && !isResolvingWinningUri && uriFromQuery && (
         <div className="card card--section help--inline">
           <I18nMessage
             tokens={{

ui/page/repost/view.jsx

@@ -6,6 +6,8 @@ import RepostCreate from 'component/repostCreate';
 import YrblWalletEmpty from 'component/yrblWalletEmpty';
 import useThrottle from 'effects/use-throttle';
 import classnames from 'classnames';
+import Base64 from 'crypto-js/enc-base64';
+import sha256 from 'crypto-js/sha256';
 
 type Props = {
   balance: number,
@@ -30,6 +32,8 @@ function RepostPage(props: Props) {
   const throttledContentValue = useThrottle(contentUri, 500);
   const throttledRepostValue = useThrottle(repostUri, 500);
 
+  console.log('hash', Base64.stringify(sha256(undefined)));
+
   React.useEffect(() => {
     if (throttledContentValue) {
       resolveUri(throttledContentValue);

ui/page/search/view.jsx

@@ -97,7 +97,7 @@ export default function SearchPage(props: Props) {
       <section className="search">
         {urlQuery && (
           <>
-            {isValid && <SearchTopClaim query={modifiedUrlQuery} />}
+            {isValid && <SearchTopClaim query={modifiedUrlQuery} isSearching={isSearching} />}
             <ClaimList
               uris={uris}
               loading={isSearching}

ui/redux/selectors/search.js

@@ -118,7 +118,11 @@ export const makeSelectWinningUriForQuery = (query: string) => {
       } else if (!claim1 && claim2) {
         return matureEnabled ? claim2.canonical_url : claim2Mature ? undefined : claim2.canonical_url;
       } else if (claim1 && !claim2) {
-        return matureEnabled ? claim1.canonical_url : claim1Mature ? undefined : claim1.canonical_url;
+        return matureEnabled
+          ? claim1.repost_url || claim1.canonical_url
+          : claim1Mature
+          ? undefined
+          : claim1.repost_url || claim1.canonical_url;
       }
 
       const effectiveAmount1 = claim1 && claim1.meta.effective_amount;
@@ -128,7 +132,7 @@ export const makeSelectWinningUriForQuery = (query: string) => {
         if (claim1Mature && !claim2Mature) {
           return claim2.canonical_url;
         } else if (claim2Mature && !claim1Mature) {
-          return claim1.canonical_url;
+          return claim1.repost_url || claim1.canonical_url;
         } else if (claim1Mature && claim2Mature) {
           return undefined;
         }

yarn.lock

@@ -7328,9 +7328,9 @@ lazy-val@^1.0.4:
     yargs "^13.2.2"
     zstd-codec "^0.1.1"
 
-lbry-redux@lbryio/lbry-redux#664df6237d777d7cce31e58479bc98563ea98cb9:
+lbry-redux@lbryio/lbry-redux#35bfae1a86a472cc41c1186610c229be0c506dbe:
   version "0.0.1"
-  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/664df6237d777d7cce31e58479bc98563ea98cb9"
+  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/35bfae1a86a472cc41c1186610c229be0c506dbe"
   dependencies:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"