diff --git a/static/app-strings.json b/static/app-strings.json index 3a51f9cb7..ab19bfd43 100644 --- a/static/app-strings.json +++ b/static/app-strings.json @@ -989,4 +989,4 @@ "Share usage data with LBRY inc.": "Share usage data with LBRY inc.", "Required": "Required", "Email %help_link% or join our %chat_link% if you encounter any trouble verifying.": "Email %help_link% or join our %chat_link% if you encounter any trouble verifying." -} \ No newline at end of file +} diff --git a/ui/component/claimList/view.jsx b/ui/component/claimList/view.jsx index dd73b3a5f..c7624d13e 100644 --- a/ui/component/claimList/view.jsx +++ b/ui/component/claimList/view.jsx @@ -70,14 +70,14 @@ export default function ClaimList(props: Props) { useEffect(() => { function handleScroll(e) { if (page && pageSize && onScrollBottom && !scrollBottomCbMap[page]) { - const x = document.querySelector(`.${MAIN_WRAPPER_CLASS}`); - const mc = document.querySelector(`.${MAIN_CLASS}`); + const mainElWrapper = document.querySelector(`.${MAIN_WRAPPER_CLASS}`); + const main = document.querySelector(`.${MAIN_CLASS}`); if ( - x && - mc && - (window.scrollY + window.innerHeight >= x.offsetHeight || - x.offsetHeight - mc.offsetHeight > PADDING_ALLOWANCE) && + mainElWrapper && + main && + (window.scrollY + window.innerHeight >= mainElWrapper.offsetHeight || + mainElWrapper.offsetHeight - main.offsetHeight > PADDING_ALLOWANCE) && !loading && urisLength >= pageSize ) { diff --git a/ui/component/claimListDiscover/view.jsx b/ui/component/claimListDiscover/view.jsx index e191e98b0..4df8edbe0 100644 --- a/ui/component/claimListDiscover/view.jsx +++ b/ui/component/claimListDiscover/view.jsx @@ -50,9 +50,11 @@ type Props = { header?: Node, headerLabel?: string | Node, name?: string, + pageSize?: number, claimType?: string | Array, renderProperties?: Claim => Node, includeSupportAction?: boolean, + noInfiniteScroll: boolean, }; function ClaimListDiscover(props: Props) { @@ -76,8 +78,10 @@ function ClaimListDiscover(props: Props) { header, name, claimType, + pageSize, renderProperties, includeSupportAction, + noInfiniteScroll, } = props; const didNavigateForward = history.action === 'PUSH'; const [page, setPage] = useState(1); @@ -100,7 +104,7 @@ function ClaimListDiscover(props: Props) { name?: string, claim_type?: string | Array, } = { - page_size: PAGE_SIZE, + page_size: pageSize || PAGE_SIZE, page, name, // no_totals makes it so the sdk doesn't have to calculate total number pages for pagination @@ -226,7 +230,7 @@ function ClaimListDiscover(props: Props) { } function handleScrollBottom() { - if (!loading) { + if (!loading && !noInfiniteScroll) { setPage(page + 1); } } diff --git a/ui/component/claimTags/view.jsx b/ui/component/claimTags/view.jsx index d5a4dced8..07c379939 100644 --- a/ui/component/claimTags/view.jsx +++ b/ui/component/claimTags/view.jsx @@ -4,7 +4,7 @@ import classnames from 'classnames'; import Tag from 'component/tag'; const SLIM_TAGS = 1; -const NORMAL_TAGS = 4; +const NORMAL_TAGS = 3; const LARGE_TAGS = 10; type Props = { diff --git a/ui/component/common/nag.jsx b/ui/component/common/nag.jsx index 4506b8b6a..2e9c767c0 100644 --- a/ui/component/common/nag.jsx +++ b/ui/component/common/nag.jsx @@ -1,6 +1,7 @@ // @flow import type { Node } from 'react'; import * as ICONS from 'constants/icons'; +import classnames from 'classnames'; import React from 'react'; import Button from 'component/button'; @@ -8,19 +9,20 @@ type Props = { message: string | Node, actionText: string, href?: string, + type?: string, onClick?: () => void, onClose?: () => void, }; export default function Nag(props: Props) { - const { message, actionText, href, onClick, onClose } = props; + const { message, actionText, href, onClick, onClose, type } = props; const buttonProps = onClick ? { onClick } : { href }; return ( -
+
{message} - {onClose &&