diff --git a/src/component/fileListItem/view.js b/src/component/fileListItem/view.js
index 08bbfda..797ea8c 100644
--- a/src/component/fileListItem/view.js
+++ b/src/component/fileListItem/view.js
@@ -40,8 +40,8 @@ class FileListItem extends React.PureComponent {
};
componentDidMount() {
- const { claim, resolveUri, uri } = this.props;
- if (!claim) {
+ const { claim, resolveUri, uri, batchResolve } = this.props;
+ if (!claim && !batchResolve) {
resolveUri(uri);
}
}
diff --git a/src/component/relatedContent/index.js b/src/component/relatedContent/index.js
index 3d75163..7dd415c 100644
--- a/src/component/relatedContent/index.js
+++ b/src/component/relatedContent/index.js
@@ -1,11 +1,11 @@
import { connect } from 'react-redux';
import {
+ doResolveUris,
makeSelectClaimForUri,
makeSelectRecommendedContentForUri,
makeSelectTitleForUri,
selectIsSearching,
} from 'lbry-redux';
-import { doNativeSearch } from 'redux/actions/performance';
import RelatedContent from './view';
const select = (state, props) => ({
@@ -16,7 +16,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
- search: query => dispatch(doNativeSearch(query, 20, undefined, true)),
+ resolveUris: uris => dispatch(doResolveUris(uris)),
});
export default connect(
diff --git a/src/component/relatedContent/view.js b/src/component/relatedContent/view.js
index 0e3a313..b468454 100644
--- a/src/component/relatedContent/view.js
+++ b/src/component/relatedContent/view.js
@@ -8,45 +8,23 @@ import fileListStyle from 'styles/fileList';
import relatedContentStyle from 'styles/relatedContent';
export default class RelatedContent extends React.PureComponent {
- constructor() {
- super();
-
- this.didSearch = undefined;
- }
-
- componentDidMount() {
- this.getRecommendedContent();
- }
+ state = {
+ urlsResolved: false,
+ };
componentDidUpdate(prevProps) {
- const { claim, uri } = this.props;
+ const { resolveUris, recommendedContent } = this.props;
- if (uri !== prevProps.uri) {
- this.didSearch = false;
- }
-
- if (claim && !this.didSearch) {
- this.getRecommendedContent();
+ if (recommendedContent && recommendedContent.length > 0 && !this.state.urisResolved) {
+ this.setState({ urisResolved: true }, () => {
+ // batch resolve the uris
+ resolveUris(recommendedContent);
+ });
}
}
- getRecommendedContent() {
- const { search, title } = this.props;
-
- if (title) {
- search(title);
- this.didSearch = true;
- }
- }
-
- didSearch;
-
render() {
- const { recommendedContent, isSearching, navigation, uri, fullUri } = this.props;
-
- if (!isSearching && (!recommendedContent || recommendedContent.length === 0)) {
- return null;
- }
+ const { recommendedContent, navigation, uri, fullUri } = this.props;
return (
@@ -59,13 +37,11 @@ export default class RelatedContent extends React.PureComponent {
style={fileListStyle.item}
key={recommendedUri}
uri={recommendedUri}
+ batchResolve
navigation={navigation}
autoplay
/>
))}
- {isSearching && (
-
- )}
);
}
diff --git a/src/page/file/index.js b/src/page/file/index.js
index c846935..73846ac 100644
--- a/src/page/file/index.js
+++ b/src/page/file/index.js
@@ -8,6 +8,7 @@ import {
doPurchaseUri,
doDeletePurchasedUri,
doResolveUri,
+ doSearch,
doSendTip,
doToast,
makeSelectIsUriResolving,
@@ -17,6 +18,7 @@ import {
makeSelectContentPositionForUri,
makeSelectContentTypeForUri,
makeSelectMetadataForUri,
+ makeSelectRecommendedContentForUri,
makeSelectStreamingUrlForUri,
makeSelectThumbnailForUri,
makeSelectTitleForUri,
@@ -26,6 +28,7 @@ import {
selectPurchasedUris,
selectFailedPurchaseUris,
selectPurchaseUriErrorMessage,
+ selectIsSearching,
} from 'lbry-redux';
import {
doClaimEligiblePurchaseRewards,
@@ -70,6 +73,8 @@ const select = (state, props) => {
streamingUrl: makeSelectStreamingUrlForUri(contentUri)(state),
thumbnail: makeSelectThumbnailForUri(contentUri)(state),
title: makeSelectTitleForUri(contentUri)(state),
+ recommendedContent: makeSelectRecommendedContentForUri(contentUri)(state),
+ isSearchingRecommendContent: selectIsSearching(state),
};
};
@@ -89,6 +94,7 @@ const perform = dispatch => ({
purchaseUri: (uri, costInfo, saveFile) => dispatch(doPurchaseUri(uri, costInfo, saveFile)),
deletePurchasedUri: uri => dispatch(doDeletePurchasedUri(uri)),
resolveUri: uri => dispatch(doResolveUri(uri)),
+ searchRecommended: query => dispatch(doSearch(query, 20, undefined, true)),
sendTip: (amount, claimId, isSupport, successCallback, errorCallback) =>
dispatch(doSendTip(amount, claimId, isSupport, successCallback, errorCallback)),
setPlayerVisible: () => dispatch(doSetPlayerVisible(true)),
diff --git a/src/page/file/view.js b/src/page/file/view.js
index 7ad23bb..053d527 100644
--- a/src/page/file/view.js
+++ b/src/page/file/view.js
@@ -85,6 +85,7 @@ class FilePage extends React.PureComponent {
uriVars: null,
stopDownloadConfirmed: false,
streamingMode: false,
+ didSearchRecommended: false,
};
}
@@ -185,12 +186,25 @@ class FilePage extends React.PureComponent {
}
componentDidUpdate(prevProps) {
- const { claim, contentType, fileInfo, isResolvingUri, resolveUri, navigation } = this.props;
+ const {
+ claim,
+ contentType,
+ fileInfo,
+ isResolvingUri,
+ resolveUri,
+ navigation,
+ searchRecommended,
+ title,
+ } = this.props;
const { uri } = this.state;
if (!isResolvingUri && claim === undefined && uri) {
resolveUri(uri);
}
+ if (title && !this.state.didSearchRecommended) {
+ this.setState({ didSearchRecommended: true }, () => searchRecommended(title));
+ }
+
// Returned to the page. If mediaLoaded, and currentMediaInfo is different, update
if (this.state.mediaLoaded && window.currentMediaInfo && window.currentMediaInfo.uri !== this.state.uri) {
const { metadata } = this.props;
@@ -607,6 +621,8 @@ class FilePage extends React.PureComponent {
navigation,
position,
purchaseUri,
+ isSearchingRecommendContent,
+ recommendedContent,
thumbnail,
title,
} = this.props;
@@ -1105,7 +1121,13 @@ class FilePage extends React.PureComponent {
)}
-
+
+ {isSearchingRecommendContent && (
+
+ )}
+ {!isSearchingRecommendContent && recommendedContent && recommendedContent.length > 0 && (
+
+ )}
)}
diff --git a/src/redux/actions/performance.js b/src/redux/actions/performance.js
deleted file mode 100644
index 2779972..0000000
--- a/src/redux/actions/performance.js
+++ /dev/null
@@ -1,95 +0,0 @@
-// @flow
-import { NativeModules } from 'react-native';
-import {
- ACTIONS,
- batchActions,
- buildURI,
- doResolveUri,
- doUpdateSearchQuery,
- makeSelectSearchUris,
- selectSuggestions,
- makeSelectQueryWithOptions,
- selectSearchValue,
-} from 'lbry-redux';
-
-let CONNECTION_STRING = 'https://lighthouse.lbry.com/';
-
-const handleNativeFetchResponse = str => {
- const json = JSON.parse(str);
- if (json.error) {
- return Promise.reject(new Error(json.error));
- }
-
- return Promise.resolve(json);
-};
-
-// Use a native asyncTask to call the lighthouse api
-export const doNativeSearch = (
- rawQuery: string, // pass in a query if you don't want to search for what's in the search bar
- size: ?number, // only pass in if you don't want to use the users setting (ex: related content)
- from: ?number,
- isBackgroundSearch: boolean = false
-) => (dispatch: Dispatch, getState: GetState) => {
- const query = rawQuery.replace(/^lbry:\/\//i, '').replace(/\//, ' ');
-
- if (!query) {
- dispatch({
- type: ACTIONS.SEARCH_FAIL,
- });
- return;
- }
-
- const state = getState();
- const queryWithOptions = makeSelectQueryWithOptions(query, size, from, isBackgroundSearch)(state);
-
- // If we have already searched for something, we don't need to do anything
- const urisForQuery = makeSelectSearchUris(queryWithOptions)(state);
- if (urisForQuery && !!urisForQuery.length) {
- return;
- }
-
- dispatch({
- type: ACTIONS.SEARCH_START,
- });
-
- // If the user is on the file page with a pre-populated uri and they select
- // the search option without typing anything, searchQuery will be empty
- // We need to populate it so the input is filled on the search page
- // isBackgroundSearch means the search is happening in the background, don't update the search query
- if (!state.search.searchQuery && !isBackgroundSearch) {
- dispatch(doUpdateSearchQuery(query));
- }
-
- const url = `${CONNECTION_STRING}search?${queryWithOptions}`;
- NativeModules.Requests.get(url)
- .then(handleNativeFetchResponse)
- .then((data: Array<{ name: String, claimId: string }>) => {
- const uris = [];
- const actions = [];
-
- data.forEach(result => {
- if (result.name) {
- const uri = buildURI({
- claimName: result.name,
- claimId: result.claimId,
- });
- actions.push(doResolveUri(uri));
- uris.push(uri);
- }
- });
-
- actions.push({
- type: ACTIONS.SEARCH_SUCCESS,
- data: {
- query: queryWithOptions,
- uris,
- },
- });
- dispatch(batchActions(...actions));
- })
- .catch(e => {
- dispatch({
- type: ACTIONS.SEARCH_FAIL,
- });
- });
-};
diff --git a/src/styles/filePage.js b/src/styles/filePage.js
index 58d71eb..77ff2a0 100644
--- a/src/styles/filePage.js
+++ b/src/styles/filePage.js
@@ -435,6 +435,9 @@ const filePageStyle = StyleSheet.create({
fontSize: 16,
marginTop: 4,
},
+ relatedLoading: {
+ marginTop: 16,
+ },
});
export default filePageStyle;