bring in some changes from odysee 1

config.js

@@ -1,6 +1,7 @@
 // On Web, this will find .env.defaults and optional .env in web/
 // On Desktop App, this will find .env.defaults and optional .env in root dir
 require('dotenv-defaults').config({ silent: false });
+
 const config = {
   MATOMO_URL: process.env.MATOMO_URL,
   MATOMO_ID: process.env.MATOMO_ID,

ui/component/channelContent/view.jsx

@@ -124,11 +124,15 @@ function ChannelContent(props: Props) {
 
       {claim && claimsInChannel > 0 ? (
         <ClaimListDiscover
+          forceShowReposts
           tileLayout={tileLayout}
           uris={searchResults}
           channelIds={[claim.claim_id]}
+          claimType={CS.CLAIM_TYPES}
+          feeAmount={CS.FEE_AMOUNT_ANY}
           defaultOrderBy={CS.ORDER_BY_NEW}
           pageSize={defaultPageSize}
+          streamType={CS.CONTENT_ALL}
           infiniteScroll={defaultInfiniteScroll}
           injectedItem={SHOW_ADS && !isAuthenticated && IS_WEB && <Ads type="video" />}
           meta={

ui/component/claimList/view.jsx

@@ -168,7 +168,7 @@ export default function ClaimList(props: Props) {
       {!timedOut && urisLength === 0 && !loading && (
         <div className="empty empty--centered">{empty || __('No results')}</div>
       )}
-      {timedOut && timedOutMessage && <div className="empty empty--centered">{timedOutMessage}</div>}
+      {!loading && timedOut && timedOutMessage && <div className="empty empty--centered">{timedOutMessage}</div>}
     </section>
   );
 }

ui/component/claimListDiscover/view.jsx

@@ -33,6 +33,7 @@ type Props = {
   hiddenUris: Array<string>,
   hiddenNsfwMessage?: Node,
   channelIds?: Array<string>,
+  claimIds?: Array<string>,
   tags: string, // these are just going to be string. pass a CSV if you want multi
   defaultTags: string,
   orderBy?: Array<string>,
@@ -43,7 +44,7 @@ type Props = {
   headerLabel?: string | Node,
   name?: string,
   hideBlock?: boolean,
-  hideFilter?: boolean,
+  hideAdvancedFilter?: boolean,
   claimType?: Array<string>,
   defaultClaimType?: Array<string>,
   streamType?: string | Array<string>,
@@ -57,6 +58,8 @@ type Props = {
   infiniteScroll?: Boolean,
   feeAmount?: string,
   tileLayout: boolean,
+  maxPages?: number,
+  forceShowReposts?: boolean,
 };
 
 function ClaimListDiscover(props: Props) {
@@ -91,13 +94,16 @@ function ClaimListDiscover(props: Props) {
     renderProperties,
     includeSupportAction,
     repostedClaimId,
-    hideFilter,
+    hideAdvancedFilter,
     infiniteScroll = true,
     followedTags,
     injectedItem,
     feeAmount,
     uris,
     tileLayout,
+    claimIds,
+    maxPages,
+    forceShowReposts = false,
   } = props;
   const didNavigateForward = history.action === 'PUSH';
   const { search } = location;
@@ -154,6 +160,7 @@ function ClaimListDiscover(props: Props) {
     any_tags?: Array<string>,
     not_tags: Array<string>,
     channel_ids: Array<string>,
+    claim_ids?: Array<string>,
     not_channel_ids: Array<string>,
     order_by: Array<string>,
     release_time?: string,
@@ -236,6 +243,10 @@ function ClaimListDiscover(props: Props) {
     options.fee_amount = feeAmountParam;
   }
 
+  if (claimIds) {
+    options.claim_ids = claimIds;
+  }
+
   if (durationParam) {
     if (durationParam === CS.DURATION_SHORT) {
       options.duration = '<=1800';
@@ -244,10 +255,8 @@ function ClaimListDiscover(props: Props) {
     }
   }
 
-  if (streamTypeParam) {
-    if (streamTypeParam !== CS.CONTENT_ALL) {
-      options.stream_types = [streamTypeParam];
-    }
+  if (streamTypeParam && streamTypeParam !== CS.CONTENT_ALL && claimType !== CS.CLAIM_CHANNEL) {
+    options.stream_types = [streamTypeParam];
   }
 
   if (claimTypeParam) {
@@ -271,9 +280,8 @@ function ClaimListDiscover(props: Props) {
       }
     }
   }
-  // https://github.com/lbryio/lbry-desktop/issues/3774
-  if (hideReposts && !options.reposted_claim_id) {
-    // and not claimrepostid
+
+  if (hideReposts && !options.reposted_claim_id && !forceShowReposts) {
     if (Array.isArray(options.claim_type)) {
       if (options.claim_type.length > 1) {
         options.claim_type = options.claim_type.filter(claimType => claimType !== 'repost');
@@ -379,6 +387,10 @@ function ClaimListDiscover(props: Props) {
   }
 
   function handleScrollBottom() {
+    if (maxPages !== undefined && page === maxPages) {
+      return;
+    }
+
     if (!loading && infiniteScroll) {
       if (claimSearchResult && !claimSearchResultLastPageReached) {
         setPage(page + 1);
@@ -406,7 +418,7 @@ function ClaimListDiscover(props: Props) {
       feeAmount={feeAmount}
       orderBy={orderBy}
       defaultOrderBy={defaultOrderBy}
-      hideFilter={hideFilter}
+      hideAdvancedFilter={hideAdvancedFilter}
       hasMatureTags={hasMatureTags}
       hiddenNsfwMessage={hiddenNsfwMessage}
       setPage={setPage}

ui/component/claimListHeader/view.jsx

@@ -24,7 +24,7 @@ type Props = {
   feeAmount: string,
   orderBy?: Array<string>,
   defaultOrderBy?: string,
-  hideFilter: boolean,
+  hideAdvancedFilter: boolean,
   hasMatureTags: boolean,
   hiddenNsfwMessage?: Node,
   channelIds?: Array<string>,
@@ -46,7 +46,7 @@ function ClaimListHeader(props: Props) {
     feeAmount,
     orderBy,
     defaultOrderBy,
-    hideFilter,
+    hideAdvancedFilter,
     hasMatureTags,
     hiddenNsfwMessage,
     channelIds,
@@ -224,7 +224,7 @@ function ClaimListHeader(props: Props) {
           </div>
 
           <div>
-            {!hideFilter && !SIMPLE_SITE && (
+            {!hideAdvancedFilter && !SIMPLE_SITE && (
               <Button
                 button="alt"
                 aria-label={__('More')}

ui/component/claimSupportButton/view.jsx

@@ -2,20 +2,25 @@
 import * as MODALS from 'constants/modal_types';
 import * as ICONS from 'constants/icons';
 import React from 'react';
+import classnames from 'classnames';
 import Button from 'component/button';
 
 type Props = {
   uri: string,
   doOpenModal: (string, {}) => void,
+  fileAction?: boolean,
 };
 
 export default function ClaimSupportButton(props: Props) {
-  const { doOpenModal, uri } = props;
+  const { doOpenModal, uri, fileAction } = props;
 
   return (
     <Button
       button="alt"
+      button={fileAction ? undefined : 'alt'}
+      className={classnames({ 'button--file-action': fileAction })}
       icon={ICONS.LBC}
+      iconSize={fileAction ? 22 : undefined}
       label={__('Support')}
       requiresAuth={IS_WEB}
       title={__('Support this claim')}

ui/component/commentCreate/view.jsx

@@ -1,6 +1,5 @@
 // @flow
 import { SIMPLE_SITE } from 'config';
-import * as MODALS from 'constants/modal_types';
 import * as PAGES from 'constants/pages';
 import { CHANNEL_NEW } from 'constants/claim';
 import React, { useEffect, useState } from 'react';
@@ -15,7 +14,6 @@ import { useHistory } from 'react-router';
 type Props = {
   uri: string,
   claim: StreamClaim,
-  openModal: (id: string, { onCommentAcknowledge: () => void }) => void,
   createComment: (string, string, string, ?string) => void,
   channels: ?Array<ChannelClaim>,
   topLevelId?: string,
@@ -25,12 +23,11 @@ type Props = {
 };
 
 export function CommentCreate(props: Props) {
-  const { createComment, claim, openModal, channels, topLevelId, onDoneReplying, onCancelReplying, isNested } = props;
+  const { createComment, claim, channels, topLevelId, onDoneReplying, onCancelReplying, isNested } = props;
   const { push } = useHistory();
   const { claim_id: claimId } = claim;
   const isReply = !!topLevelId;
   const [commentValue, setCommentValue] = React.useState('');
-  const [commentAck, setCommentAck] = usePersistedState('comment-acknowledge', false);
   const [channel, setChannel] = usePersistedState('comment-channel', '');
   const [charCount, setCharCount] = useState(commentValue.length);
   const [advancedEditor, setAdvancedEditor] = usePersistedState('comment-editor-mode', false);
@@ -62,16 +59,6 @@ export function CommentCreate(props: Props) {
     setCommentValue(commentValue);
   }
 
-  function handleCommentAck() {
-    setCommentAck(true);
-  }
-
-  function onTextareaFocus() {
-    if (!commentAck) {
-      openModal(MODALS.COMMENT_ACKNOWEDGEMENT, { onCommentAcknowledge: handleCommentAck });
-    }
-  }
-
   function handleSubmit() {
     if (channel !== CHANNEL_NEW && commentValue.length) {
       createComment(commentValue, claimId, channel, topLevelId);
@@ -120,7 +107,6 @@ export function CommentCreate(props: Props) {
           !SIMPLE_SITE && (isReply ? undefined : advancedEditor ? __('Simple Editor') : __('Advanced Editor'))
         }
         quickActionHandler={!SIMPLE_SITE && toggleEditorMode}
-        onFocus={onTextareaFocus}
         placeholder={__('Say something about this...')}
         value={commentValue}
         charCount={charCount}

ui/component/commentsList/index.js

@@ -1,6 +1,10 @@
 import { connect } from 'react-redux';
 import { makeSelectClaimIsMine, selectMyChannelClaims } from 'lbry-redux';
-import { makeSelectTopLevelCommentsForUri, selectIsFetchingComments } from 'redux/selectors/comments';
+import {
+  makeSelectTopLevelCommentsForUri,
+  selectIsFetchingComments,
+  makeSelectTotalCommentsCountForUri,
+} from 'redux/selectors/comments';
 import { doCommentList, doCommentReactList } from 'redux/actions/comments';
 import CommentsList from './view';
 import { selectUserVerifiedEmail } from 'redux/selectors/user';
@@ -8,6 +12,7 @@ import { selectUserVerifiedEmail } from 'redux/selectors/user';
 const select = (state, props) => ({
   myChannels: selectMyChannelClaims(state),
   comments: makeSelectTopLevelCommentsForUri(props.uri)(state),
+  totalComments: makeSelectTotalCommentsCountForUri(props.uri)(state),
   claimIsMine: makeSelectClaimIsMine(props.uri)(state),
   isFetchingComments: selectIsFetchingComments(state),
   commentingEnabled: IS_WEB ? Boolean(selectUserVerifiedEmail(state)) : true,

ui/component/commentsList/view.jsx

@@ -1,4 +1,5 @@
 // @flow
+import * as ICONS from 'constants/icons';
 import React, { useEffect } from 'react';
 import Comment from 'component/comment';
 import Spinner from 'component/spinner';
@@ -16,6 +17,7 @@ type Props = {
   myChannels: ?Array<ChannelClaim>,
   isFetchingComments: boolean,
   linkedComment: any,
+  totalComments: number,
 };
 
 function CommentList(props: Props) {
@@ -28,12 +30,12 @@ function CommentList(props: Props) {
     myChannels,
     isFetchingComments,
     linkedComment,
+    totalComments,
   } = props;
 
   const linkedCommentId = linkedComment && linkedComment.comment_id;
   const [start] = React.useState(0);
   const [end, setEnd] = React.useState(9);
-  const totalComments = comments && comments.length;
   const hasNoComments = totalComments === 0;
 
   const moreBelow = totalComments - end > 0;
@@ -103,6 +105,7 @@ function CommentList(props: Props) {
             : __('%total_comments% comments', { total_comments: totalComments })
           : __('Leave a comment')
       }
+      titleActions={<Button button="alt" icon={ICONS.REFRESH} onClick={() => fetchComments(uri)} />}
       actions={
         <>
           <CommentCreate uri={uri} />

ui/component/common/card.jsx

@@ -69,7 +69,7 @@ export default function Card(props: Props) {
             {expandable && (
               <div className="card__title-actions">
                 <Button
-                  button={'alt'}
+                  button="alt"
                   aria-expanded={expanded}
                   aria-label={__('More')}
                   icon={expanded ? ICONS.SUBTRACT : ICONS.ADD}

ui/component/common/icon.jsx

@@ -51,7 +51,7 @@ class IconComponent extends React.PureComponent<Props> {
   };
 
   render() {
-    const { icon, tooltip, customTooltipText, iconColor, size, className, sectionIcon = false } = this.props;
+    const { icon, tooltip, customTooltipText, iconColor, size, className, sectionIcon = false, ...rest } = this.props;
     const Icon = icons[this.props.icon];
 
     if (!Icon) {
@@ -73,6 +73,7 @@ class IconComponent extends React.PureComponent<Props> {
         size={size || (sectionIcon ? 20 : 16)}
         className={classnames(`icon icon--${icon}`, className)}
         color={color}
+        {...rest}
       />
     );
 

ui/redux/selectors/comments.js

@@ -259,3 +259,8 @@ export const makeSelectRepliesForParentId = (id: string) =>
         : [];
     }
   );
+
+export const makeSelectTotalCommentsCountForUri = (uri: string) =>
+  createSelector(makeSelectCommentsForUri(uri), comments => {
+    return comments ? comments.length : 0;
+  });

ui/scss/component/_card.scss

@@ -307,14 +307,6 @@
   }
 }
 
-.card__expand-btn {
-  padding: var(--spacing-m);
-
-  @media (max-width: $breakpoint-small) {
-    padding: 0;
-  }
-}
-
 .card__header,
 .card__body,
 .card__main-actions {