Make educated guess if 'no result' is due to language filter, and warn user.

This commit is contained in:
infiinte-persistence 2021-02-18 16:55:29 +08:00 committed by Sean Yesmunt
parent 545ee46a02
commit 6f67af5ec3
3 changed files with 19 additions and 17 deletions

View file

@ -18,6 +18,7 @@
"Settings": "Settings",
"Help": "Help",
"No results": "No results",
"No results. Contents may be hidden by the Language filter.": "No results. Contents may be hidden by the Language filter.",
"Home": "Home",
"Library": "Library",
"Purchased": "Purchased",
@ -1531,7 +1532,6 @@
"Explore": "Explore",
"There is a bug... somewhere": "There is a bug... somewhere",
"Try refreshing to fix the issue. If that doesn't work, email help@lbry.com for support.": "Try refreshing to fix the issue. If that doesn't work, email help@lbry.com for support.",
"No Results": "No Results",
"Content preview": "Content preview",
"Repost url": "Repost url",
"Close sidebar - hide channels you are following": "Close sidebar - hide channels you are following",

View file

@ -1,11 +1,12 @@
import { connect } from 'react-redux';
import ClaimList from './view';
import { SETTINGS } from 'lbry-redux';
import { makeSelectClientSetting } from 'redux/selectors/settings';
const select = state => ({});
const select = (state) => ({
searchInLanguage: makeSelectClientSetting(SETTINGS.SEARCH_IN_LANGUAGE)(state),
});
const perform = dispatch => ({});
const perform = (dispatch) => ({});
export default connect(
select,
perform
)(ClaimList);
export default connect(select, perform)(ClaimList);

View file

@ -22,7 +22,7 @@ type Props = {
type: string,
empty?: string,
defaultSort?: boolean,
onScrollBottom?: any => void,
onScrollBottom?: (any) => void,
page?: number,
pageSize?: number,
id?: string,
@ -36,7 +36,8 @@ type Props = {
injectedItem: ?Node,
timedOutMessage?: Node,
tileLayout?: boolean,
renderActions?: Claim => ?Node,
renderActions?: (Claim) => ?Node,
searchInLanguage: boolean,
};
export default function ClaimList(props: Props) {
@ -61,19 +62,23 @@ export default function ClaimList(props: Props) {
timedOutMessage,
tileLayout = false,
renderActions,
searchInLanguage,
} = props;
const [currentSort, setCurrentSort] = usePersistedState(persistedStorageKey, SORT_NEW);
const timedOut = uris === null;
const urisLength = (uris && uris.length) || 0;
const sortedUris = (urisLength > 0 && (currentSort === SORT_NEW ? uris : uris.slice().reverse())) || [];
const noResultMsg = searchInLanguage
? __('No results. Contents may be hidden by the Language filter.')
: __('No results');
function handleSortChange() {
setCurrentSort(currentSort === SORT_NEW ? SORT_OLD : SORT_NEW);
}
useEffect(() => {
const handleScroll = debounce(e => {
const handleScroll = debounce((e) => {
if (page && pageSize && onScrollBottom) {
const mainEl = document.querySelector(`.${MAIN_CLASS}`);
@ -95,10 +100,8 @@ export default function ClaimList(props: Props) {
return tileLayout && !header ? (
<section className="claim-grid">
{urisLength > 0 && uris.map(uri => <ClaimPreviewTile key={uri} uri={uri} />)}
{!timedOut && urisLength === 0 && !loading && (
<div className="empty main--empty">{empty || __('No results')}</div>
)}
{urisLength > 0 && uris.map((uri) => <ClaimPreviewTile key={uri} uri={uri} />)}
{!timedOut && urisLength === 0 && !loading && <div className="empty main--empty">{empty || noResultMsg}</div>}
{timedOut && timedOutMessage && <div className="empty main--empty">{timedOutMessage}</div>}
</section>
) : (
@ -168,9 +171,7 @@ export default function ClaimList(props: Props) {
</ul>
)}
{!timedOut && urisLength === 0 && !loading && (
<div className="empty empty--centered">{empty || __('No results')}</div>
)}
{!timedOut && urisLength === 0 && !loading && <div className="empty empty--centered">{empty || noResultMsg}</div>}
{!loading && timedOut && timedOutMessage && <div className="empty empty--centered">{timedOutMessage}</div>}
</section>
);