gracefully handle dynamic sdk ready state

This commit is contained in:
Akinwale Ariwodola 2020-03-18 18:07:47 +01:00
parent 863507803f
commit 390b410414
30 changed files with 218 additions and 106 deletions

@ -1 +1 @@
Subproject commit 5b165a2339bec005e83b5349028a10a8839bc23e
Subproject commit 558b609ce2b7301437a2b8db237621b32bedade9

View file

@ -42,8 +42,10 @@ import {
} from 'react-native';
import { selectDrawerStack } from 'redux/selectors/drawer';
import {
Lbry,
ACTIONS,
SETTINGS,
doBalanceSubscribe,
doDismissToast,
doPopulateSharedUserState,
doPreferenceGet,
@ -52,6 +54,8 @@ import {
} from 'lbry-redux';
import {
Lbryio,
doBlackListedOutpointsSubscribe,
doFilteredOutpointsSubscribe,
doGetSync,
doUserCheckEmailVerified,
doUserEmailVerify,
@ -75,6 +79,7 @@ import discoverStyle from 'styles/discover';
import searchStyle from 'styles/search';
import SearchRightHeaderIcon from 'component/searchRightHeaderIcon';
import Snackbar from 'react-native-snackbar';
import { doSetSdkReady } from 'redux/actions/settings';
const SYNC_GET_INTERVAL = 1000 * 60 * 5; // every 5 minutes
@ -327,6 +332,7 @@ class AppWithNavigationState extends React.Component {
this.emailVerifyCheckInterval = setInterval(() => this.checkEmailVerification(), 5000);
Linking.addEventListener('url', this._handleUrl);
DeviceEventEmitter.addListener('onSdkReady', this.handleSdkReady);
DeviceEventEmitter.addListener('onDownloadAborted', this.handleDownloadAborted);
DeviceEventEmitter.addListener('onDownloadStarted', this.handleDownloadStarted);
DeviceEventEmitter.addListener('onDownloadUpdated', this.handleDownloadUpdated);
@ -366,6 +372,46 @@ class AppWithNavigationState extends React.Component {
);
};
handleSdkReady = () => {
const { dispatch } = this.props;
dispatch(doSetSdkReady());
dispatch(doBalanceSubscribe());
dispatch(doBlackListedOutpointsSubscribe());
dispatch(doFilteredOutpointsSubscribe());
Lbry.wallet_status().then(secureWalletStatus => {
// For now, automatically unlock the wallet if a password is set so that downloads work
NativeModules.UtilityModule.getSecureValue(Constants.KEY_WALLET_PASSWORD).then(password => {
if ((secureWalletStatus.is_encrypted && !secureWalletStatus.is_locked) || secureWalletStatus.is_locked) {
this.setState({
message: __('Unlocking account'),
details: __('Decrypting wallet'),
});
// unlock the wallet and then finish the splash screen
Lbry.wallet_unlock({ password: password || '' }).then(unlocked => {
if (unlocked) {
} else {
// this.handleAccountUnlockFailed();
}
});
}
});
});
};
handleAccountUnlockFailed() {
const { dispatch } = this.props;
dispatch(
doToast({
message: __(
'Your wallet failed to unlock, which means you may not be able to play any videos or access your funds. Restart the app to fix this.',
),
isError: true,
}),
);
}
handleDownloadStarted = evt => {
const { dispatch } = this.props;
const { uri, outpoint, fileInfo } = evt;

View file

@ -16,7 +16,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri, 'https://api.lbry.tv/api/v1/proxy')),
resolveUri: uri => dispatch(doResolveUri(uri)),
});
export default connect(select, perform)(ChannelIconItem);

View file

@ -20,7 +20,7 @@ const select = state => ({
});
const perform = dispatch => ({
claimSearch: options => dispatch(doClaimSearch(options, 'https://api.lbry.tv/api/v1/proxy')),
claimSearch: options => dispatch(doClaimSearch(options)),
});
export default connect(select, perform)(ClaimList);

View file

@ -32,7 +32,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri, 'https://api.lbry.tv/api/v1/proxy')),
resolveUri: uri => dispatch(doResolveUri(uri)),
setPlayerVisible: (visible, uri) => dispatch(doSetPlayerVisible(visible, uri)),
});

View file

@ -1,18 +1,17 @@
import { connect } from 'react-redux';
import { doFetchChannelListMine, selectMyChannelClaims } from 'lbry-redux';
import { doToast, selectMyChannelClaims } from 'lbry-redux';
import { selectUser } from 'lbryinc';
import { selectSdkReady } from 'redux/selectors/settings';
import DrawerContent from './view';
const select = state => ({
channels: selectMyChannelClaims(state),
sdkReady: selectSdkReady(state),
user: selectUser(state),
});
const perform = dispatch => ({
fetchChannelListMine: () => dispatch(doFetchChannelListMine(1, 99999, true)),
notify: data => dispatch(doToast(data)),
});
export default connect(
select,
perform,
)(DrawerContent);
export default connect(select, perform)(DrawerContent);

View file

@ -31,13 +31,17 @@ const groupedMenuItems = {
};
const groupNames = Object.keys(groupedMenuItems);
const routesRequiringSdkReady = [
Constants.DRAWER_ROUTE_CHANNEL_CREATOR,
Constants.DRAWER_ROUTE_MY_LBRY,
Constants.DRAWER_ROUTE_PUBLISHES,
Constants.DRAWER_ROUTE_PUBLISH,
Constants.DRAWER_ROUTE_WALLET,
Constants.DRAWER_ROUTE_REWARDS,
Constants.DRAWER_ROUTE_INVITES,
];
class DrawerContent extends React.PureComponent {
componentDidMount() {
const { fetchChannelListMine } = this.props;
fetchChannelListMine();
}
getAvatarImageUrl = () => {
const { channels = [] } = this.props;
if (channels) {
@ -62,6 +66,21 @@ class DrawerContent extends React.PureComponent {
});
};
handleItemPress = routeName => {
const { navigation, notify, sdkReady } = this.props;
if (true && routesRequiringSdkReady.includes(routeName)) {
if (navigation.closeDrawer) {
navigation.closeDrawer();
}
notify({
message: __('The background service is still initializing. Please try again when initialization is complete.'),
});
return;
}
navigation.navigate({ routeName: routeName });
};
render() {
const { activeTintColor, navigation, user, onItemPress } = this.props;
const { state } = navigation;
@ -157,7 +176,7 @@ class DrawerContent extends React.PureComponent {
focused ? discoverStyle.menuItemTouchAreaFocused : null,
]}
key={item.label}
onPress={() => navigation.navigate({ routeName: item.route })}
onPress={() => this.handleItemPress(item.route)}
delayPressIn={0}
>
<View style={discoverStyle.menuItemIcon}>

View file

@ -31,7 +31,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri, 'https://api.lbry.tv/api/v1/proxy')),
resolveUri: uri => dispatch(doResolveUri(uri)),
setPlayerVisible: (visible, uri) => dispatch(doSetPlayerVisible(visible, uri)),
});

View file

@ -32,7 +32,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri, 'https://api.lbry.tv/api/v1/proxy')),
resolveUri: uri => dispatch(doResolveUri(uri)),
setPlayerVisible: (visible, uri) => dispatch(doSetPlayerVisible(visible, uri)),
});

View file

@ -0,0 +1,4 @@
import { connect } from 'react-redux';
import SdkLoadingStatus from './view';
export default connect()(SdkLoadingStatus);

View file

@ -0,0 +1,15 @@
import { ActivityIndicator, Text, View } from 'react-native';
import React from 'react';
import discoverStyle from 'styles/discover';
import Colors from 'styles/colors';
export default class SdkLoadingStatus extends React.PureComponent {
render() {
return (
<View style={discoverStyle.sdkLoading}>
<ActivityIndicator color={Colors.White} size={'small'} />
<Text style={discoverStyle.sdkLoadingText}>{__('The LBRY background service is initializing...')}</Text>
</View>
);
}
}

View file

@ -18,7 +18,7 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
resolveUri: uri => dispatch(doResolveUri(uri, 'https://api.lbry.tv/api/v1/proxy')),
resolveUri: uri => dispatch(doResolveUri(uri)),
subscribe: subscription => doChannelSubscribe(subscription),
unsubscribe: subscription => doChannelUnsubscribe(subscription),
});

View file

@ -13,7 +13,7 @@ const select = state => ({
});
const perform = dispatch => ({
claimSearch: options => dispatch(doClaimSearch(options, 'https://api.lbry.tv/api/v1/proxy')),
claimSearch: options => dispatch(doClaimSearch(options)),
});
export default connect(select, perform)(SuggestedSubscriptions);

View file

@ -21,7 +21,7 @@ const select = state => ({
});
const perform = dispatch => ({
claimSearch: options => dispatch(doClaimSearch(options, 'https://api.lbry.tv/api/v1/proxy')),
claimSearch: options => dispatch(doClaimSearch(options)),
});
export default connect(select, perform)(SuggestedSubscriptionsGrid);

View file

@ -46,6 +46,8 @@ const Constants = {
SETTING_DEVICE_WALLET_SYNCED: 'deviceWalletSynced',
SETTING_DHT_ENABLED: 'dhtEnabled',
ACTION_SDK_READY: 'SDK_READY',
ACTION_DELETE_COMPLETED_BLOBS: 'DELETE_COMPLETED_BLOBS',
ACTION_FIRST_RUN_PAGE_CHANGED: 'FIRST_RUN_PAGE_CHANGED',

View file

@ -55,6 +55,8 @@ import settingsReducer from 'redux/reducers/settings';
import thunk from 'redux-thunk';
window.__ = __;
Lbry.alternateConnectionString = 'https://api.lbry.tv/api/v1/proxy';
Lbry.methodsUsingAlternateConnectionString = ['claim_search', 'resolve'];
const globalExceptionHandler = (error, isFatal) => {
if (error && NativeModules.Firebase) {

View file

@ -13,7 +13,7 @@ import {
} from 'lbryinc';
import { doPushDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
import { doSetClientSetting, doSetSortByItem, doSetTimeItem } from 'redux/actions/settings';
import { makeSelectClientSetting, selectSortByItem, selectTimeItem } from 'redux/selectors/settings';
import { makeSelectClientSetting, selectSdkReady, selectSortByItem, selectTimeItem } from 'redux/selectors/settings';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import DiscoverPage from './view';
@ -27,6 +27,7 @@ const select = state => ({
followedTags: selectFollowedTags(state),
ratingReminderDisabled: makeSelectClientSetting(Constants.SETTING_RATING_REMINDER_DISABLED)(state),
ratingReminderLastShown: makeSelectClientSetting(Constants.SETTING_RATING_REMINDER_LAST_SHOWN)(state),
sdkReady: selectSdkReady(state),
sortByItem: selectSortByItem(state),
timeItem: selectTimeItem(state),
unreadSubscriptions: selectUnreadSubscriptions(state),
@ -46,7 +47,4 @@ const perform = dispatch => ({
setTimeItem: item => dispatch(doSetTimeItem(item)),
});
export default connect(
select,
perform,
)(DiscoverPage);
export default connect(select, perform)(DiscoverPage);

View file

@ -23,6 +23,7 @@ import Icon from 'react-native-vector-icons/FontAwesome5';
import Link from 'component/link';
import ModalTagSelector from 'component/modalTagSelector';
import ModalPicker from 'component/modalPicker';
import SdkLoadingStatus from 'component/sdkLoadingStatus';
import UriBar from 'component/uriBar';
import _ from 'lodash';
@ -268,8 +269,8 @@ class DiscoverPage extends React.PureComponent {
);
render() {
const { currentRoute, navigation, sortByItem, timeItem } = this.props;
const { orderBy, showModalTagSelector, showSortPicker, showTimePicker } = this.state;
const { currentRoute, navigation, sdkReady, sortByItem, timeItem } = this.props;
const { showModalTagSelector, showSortPicker, showTimePicker } = this.state;
return (
<View style={discoverStyle.container}>
@ -289,7 +290,7 @@ class DiscoverPage extends React.PureComponent {
keyExtractor={(item, index) => item}
/>
)}
{!showModalTagSelector && !showSortPicker && !showTimePicker && (
{sdkReady && !showModalTagSelector && !showSortPicker && !showTimePicker && (
<FloatingWalletBalance navigation={navigation} />
)}
{showModalTagSelector && (
@ -316,6 +317,8 @@ class DiscoverPage extends React.PureComponent {
items={Constants.CLAIM_SEARCH_TIME_ITEMS}
/>
)}
{!sdkReady && <SdkLoadingStatus />}
</View>
);
}

View file

@ -41,6 +41,7 @@ import { doDeleteFile, doStopDownloadingFile } from 'redux/actions/file';
import { doPushDrawerStack, doPopDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
import { doToggleFullscreenMode } from 'redux/actions/settings';
import { selectDrawerStack, makeSelectPlayerVisible } from 'redux/selectors/drawer';
import { selectSdkReady } from 'redux/selectors/settings';
import FilePage from './view';
const select = (state, props) => {
@ -66,6 +67,7 @@ const select = (state, props) => {
failedPurchaseUris: selectFailedPurchaseUris(state),
myClaimUris: selectMyClaimUrisWithoutChannels(state),
purchaseUriErrorMessage: selectPurchaseUriErrorMessage(state),
sdkReady: selectSdkReady(state),
streamingUrl: makeSelectStreamingUrlForUri(contentUri)(state),
thumbnail: makeSelectThumbnailForUri(contentUri)(state),
title: makeSelectTitleForUri(contentUri)(state),
@ -99,7 +101,4 @@ const perform = dispatch => ({
toggleFullscreenMode: mode => dispatch(doToggleFullscreenMode(mode)),
});
export default connect(
select,
perform,
)(FilePage);
export default connect(select, perform)(FilePage);

View file

@ -43,7 +43,6 @@ import RelatedContent from 'component/relatedContent';
import SubscribeButton from 'component/subscribeButton';
import SubscribeNotificationButton from 'component/subscribeNotificationButton';
import UriBar from 'component/uriBar';
import Video from 'react-native-video';
import FileRewardsDriver from 'component/fileRewardsDriver';
import filePageStyle from 'styles/filePage';
import uriBarStyle from 'styles/uriBar';
@ -73,7 +72,7 @@ class FilePage extends React.PureComponent {
constructor(props) {
super(props);
this.state = {
attemptAutoGet: false,
autoGetAttempted: false,
autoOpened: false,
autoDownloadStarted: false,
autoPlayMedia: false,
@ -297,7 +296,17 @@ class FilePage extends React.PureComponent {
}
componentDidUpdate(prevProps, prevState) {
const { claim, contentType, costInfo, fileInfo, isResolvingUri, resolveUri, navigation, title } = this.props;
const {
claim,
contentType,
costInfo,
fileInfo,
isResolvingUri,
resolveUri,
sdkReady,
navigation,
title,
} = this.props;
const { uri } = this.state;
if (!isResolvingUri && claim === undefined && uri) {
resolveUri(uri);
@ -323,10 +332,12 @@ class FilePage extends React.PureComponent {
const isPlayable = mediaType === 'video' || mediaType === 'audio';
const isViewable = mediaType === 'image' || mediaType === 'text';
if (claim && costInfo && costInfo.cost === 0 && !this.state.autoGetAttempted && isViewable) {
this.setState({ autoGetAttempted: true }, () => this.checkStoragePermissionForDownload());
this.setState({ autoGetAttempted: true }, () => {
this.checkStoragePermissionForDownload();
});
}
if (((costInfo && costInfo.cost > 0) || !isPlayable) && (!fileInfo && !isViewable) && !this.state.showRecommended) {
if (((costInfo && costInfo.cost > 0) || !isPlayable) && !fileInfo && !isViewable && !this.state.showRecommended) {
this.setState({ showRecommended: true });
}
@ -706,7 +717,7 @@ class FilePage extends React.PureComponent {
};
confirmPurchaseUri = (uri, costInfo, download) => {
const { notify, purchaseUri, title } = this.props;
const { notify, purchaseUri, sdkReady, title } = this.props;
if (!costInfo) {
notify({ message: __('This content cannot be viewed at this time. Please try again in a bit.'), isError: true });
this.setState({ downloadPressed: false });
@ -715,6 +726,11 @@ class FilePage extends React.PureComponent {
}
const { cost } = costInfo;
if (!NativeModules.UtilityModule.dhtEnabled && !sdkReady && parseFloat(cost) === 0) {
this.attemptLbryTvPlayback();
return;
}
if (costInfo.cost > 0) {
Alert.alert(
__('Confirm Purchase'),
@ -742,22 +758,40 @@ class FilePage extends React.PureComponent {
}
};
getStreamUrlForClaim = claim => {
const { name, claim_id: claimId } = claim;
return `https://player.lbry.tv/content/claims/${name}/${claimId}/stream`;
};
attemptLbryTvPlayback = () => {
const { claim } = this.props;
if (claim) {
this.setState({ streamingMode: true, currentStreamUrl: this.getStreamUrlForClaim(claim) });
}
};
onFileDownloadButtonPressed = () => {
this.startTime = Date.now();
const { claim, costInfo, contentType, setPlayerVisible } = this.props;
const { claim, costInfo, contentType, notify, sdkReady, setPlayerVisible } = this.props;
const mediaType = Lbry.getMediaType(contentType);
const isPlayable = mediaType === 'video' || mediaType === 'audio';
const isViewable = mediaType === 'image' || mediaType === 'text';
const purchaseUrl = this.getPurchaseUrl();
NativeModules.Firebase.track('purchase_uri', { uri: purchaseUrl });
if (!isPlayable) {
if (!sdkReady) {
notify({
message: __('The LBRY background service is still initializing. Please wait a few moments and try again.'),
});
return;
}
this.onDownloadPressed();
} else {
this.confirmPurchaseUri(purchaseUrl, costInfo, !isPlayable);
}
NativeModules.Firebase.track('purchase_uri', { uri: purchaseUrl });
if (isPlayable) {
this.setState({ downloadPressed: true, autoPlayMedia: true, stopDownloadConfirmed: false });
}
@ -1177,7 +1211,7 @@ class FilePage extends React.PureComponent {
style={filePageStyle.mediaContainer}
onPress={this.onFileDownloadButtonPressed}
>
{(canOpen || (!fileInfo || (isPlayable && !canLoadMedia)) || (!canOpen && fileInfo)) && (
{(canOpen || !fileInfo || (isPlayable && !canLoadMedia) || (!canOpen && fileInfo)) && (
<FileItemMedia
duration={duration}
style={filePageStyle.thumbnail}

View file

@ -1,11 +1,8 @@
import { connect } from 'react-redux';
import { SETTINGS, doBalanceSubscribe, doUpdateBlockHeight, doPopulateSharedUserState, doToast } from 'lbry-redux';
import { SETTINGS, doUpdateBlockHeight, doPopulateSharedUserState, doToast } from 'lbry-redux';
import {
doAuthenticate,
doInstallNew,
doInstallNewWithParams,
doBlackListedOutpointsSubscribe,
doFilteredOutpointsSubscribe,
doFetchMySubscriptions,
doFetchRewardedContent,
doGetSync,
@ -32,9 +29,6 @@ const perform = dispatch => ({
dispatch(doAuthenticate(appVersion, os, firebaseToken, true, null, callInstall)),
installNewWithParams: (appVersion, installationId, nodeId, lbrynetVersion, os, platform, firebaseToken) =>
dispatch(doInstallNewWithParams(appVersion, installationId, nodeId, lbrynetVersion, os, platform, firebaseToken)),
balanceSubscribe: () => dispatch(doBalanceSubscribe()),
blacklistedOutpointsSubscribe: () => dispatch(doBlackListedOutpointsSubscribe()),
filteredOutpointsSubscribe: () => dispatch(doFilteredOutpointsSubscribe()),
fetchRewardedContent: () => dispatch(doFetchRewardedContent()),
fetchSubscriptions: callback => dispatch(doFetchMySubscriptions(callback)),
getSync: (password, callback) => dispatch(doGetSync(password, callback)),

View file

@ -213,12 +213,7 @@ class SplashScreen extends React.PureComponent {
user,
} = this.props;
// Lbry.resolve({ urls: 'lbry://one' }).then(() => {
// Leave the splash screen
balanceSubscribe();
blacklistedOutpointsSubscribe();
filteredOutpointsSubscribe();
if (user && user.id && user.has_verified_email) {
// user already authenticated
NativeModules.UtilityModule.getSecureValue(Constants.KEY_WALLET_PASSWORD).then(walletPassword => {

View file

@ -16,7 +16,7 @@ import {
import { doToast, selectFetchingClaimSearch } from 'lbry-redux';
import { doPushDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
import { doSetClientSetting, doSetTimeItem } from 'redux/actions/settings';
import { makeSelectClientSetting, selectTimeItem } from 'redux/selectors/settings';
import { makeSelectClientSetting, selectSdkReady, selectTimeItem } from 'redux/selectors/settings';
import { selectCurrentRoute } from 'redux/selectors/drawer';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import SubscriptionsPage from './view';
@ -34,6 +34,7 @@ const select = state => ({
firstRunCompleted: selectFirstRunCompleted(state),
showSuggestedSubs: selectShowSuggestedSubs(state),
timeItem: selectTimeItem(state),
sdkReady: selectSdkReady(state),
});
const perform = dispatch => ({
@ -48,7 +49,4 @@ const perform = dispatch => ({
setTimeItem: item => dispatch(doSetTimeItem(item)),
});
export default connect(
select,
perform,
)(SubscriptionsPage);
export default connect(select, perform)(SubscriptionsPage);

View file

@ -30,6 +30,7 @@ import SubscribedChannelList from 'component/subscribedChannelList';
import SuggestedSubscriptions from 'component/suggestedSubscriptions';
import SuggestedSubscriptionsGrid from 'component/suggestedSubscriptionsGrid';
import UriBar from 'component/uriBar';
import SdkLoadingStatus from 'component/sdkLoadingStatus';
class SubscriptionsPage extends React.PureComponent {
state = {
@ -137,21 +138,7 @@ class SubscriptionsPage extends React.PureComponent {
};
render() {
const {
suggestedChannels,
subscribedChannels,
allSubscriptions,
doCompleteFirstRun,
doShowSuggestedSubs,
loading,
loadingSuggested,
firstRunCompleted,
showSuggestedSubs,
timeItem,
unreadSubscriptions,
navigation,
notify,
} = this.props;
const { subscribedChannels, loading, loadingSuggested, sdkReady, timeItem, navigation, notify } = this.props;
const { currentSortByItem, filteredChannels, showModalSuggestedSubs, showSortPicker, showTimePicker } = this.state;
const numberOfSubscriptions = subscribedChannels ? subscribedChannels.length : 0;
@ -296,6 +283,8 @@ class SubscriptionsPage extends React.PureComponent {
onDonePress={() => this.setState({ showModalSuggestedSubs: false })}
/>
)}
{!sdkReady && <SdkLoadingStatus />}
</View>
);
}

View file

@ -3,11 +3,12 @@ import { selectFollowedTags, doToggleTagFollow } from 'lbry-redux';
import { doPushDrawerStack, doSetPlayerVisible } from 'redux/actions/drawer';
import { doSetSortByItem, doSetTimeItem } from 'redux/actions/settings';
import { selectCurrentRoute } from 'redux/selectors/drawer';
import { selectSortByItem, selectTimeItem } from 'redux/selectors/settings';
import { selectSdkReady, selectSortByItem, selectTimeItem } from 'redux/selectors/settings';
import TagPage from './view';
const select = state => ({
currentRoute: selectCurrentRoute(state),
sdkReady: selectSdkReady(state),
sortByItem: selectSortByItem(state),
timeItem: selectTimeItem(state),
followedTags: selectFollowedTags(state),
@ -21,7 +22,4 @@ const perform = dispatch => ({
toggleTagFollow: tag => dispatch(doToggleTagFollow(tag)),
});
export default connect(
select,
perform
)(TagPage);
export default connect(select, perform)(TagPage);

View file

@ -14,6 +14,7 @@ import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import FloatingWalletBalance from 'component/floatingWalletBalance';
import Link from 'component/link';
import ModalPicker from 'component/modalPicker';
import SdkLoadingStatus from 'component/sdkLoadingStatus';
import UriBar from 'component/uriBar';
class TagPage extends React.PureComponent {
@ -127,7 +128,7 @@ class TagPage extends React.PureComponent {
};
render() {
const { navigation, sortByItem, timeItem } = this.props;
const { navigation, sdkReady, sortByItem, timeItem } = this.props;
const { tag, showSortPicker, showTimePicker } = this.state;
return (
@ -144,7 +145,7 @@ class TagPage extends React.PureComponent {
orientation={Constants.ORIENTATION_VERTICAL}
/>
)}
{!showSortPicker && !showTimePicker && <FloatingWalletBalance navigation={navigation} />}
{sdkReady && !showSortPicker && !showTimePicker && <FloatingWalletBalance navigation={navigation} />}
{showSortPicker && (
<ModalPicker
title={__('Sort content by')}
@ -163,6 +164,7 @@ class TagPage extends React.PureComponent {
items={Constants.CLAIM_SEARCH_TIME_ITEMS}
/>
)}
{!sdkReady && <SdkLoadingStatus />}
</View>
);
}

View file

@ -17,6 +17,14 @@ export function doSetClientSetting(key, value) {
};
}
export function doSetSdkReady() {
return dispatch => {
dispatch({
type: Constants.ACTION_SDK_READY,
});
};
}
export function doSetSortByItem(item) {
return dispatch => {
dispatch({

View file

@ -4,6 +4,7 @@ import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
const reducers = {};
const defaultState = {
clientSettings: {},
sdkReady: false,
sortByItemName: Constants.SORT_BY_HOT,
timeItemName: Constants.TIME_WEEK,
fullscreenMode: false,
@ -20,6 +21,11 @@ reducers[ACTIONS.CLIENT_SETTING_CHANGED] = (state, action) => {
});
};
reducers[Constants.ACTION_SDK_READY] = (state, action) =>
Object.assign({}, state, {
sdkReady: true,
});
reducers[Constants.ACTION_SORT_BY_ITEM_CHANGED] = (state, action) =>
Object.assign({}, state, {
sortByItemName: action.data.name,

View file

@ -4,38 +4,22 @@ import { getSortByItemForName, getTimeItemForName } from 'utils/helper';
const selectState = state => state.settings || {};
export const selectDaemonSettings = createSelector(
selectState,
state => state.daemonSettings
);
export const selectDaemonSettings = createSelector(selectState, state => state.daemonSettings);
export const selectClientSettings = createSelector(
selectState,
state => state.clientSettings || {}
);
export const selectClientSettings = createSelector(selectState, state => state.clientSettings || {});
export const selectSortByItem = createSelector(
selectState,
state => getSortByItemForName(state.sortByItemName)
);
export const selectSortByItem = createSelector(selectState, state => getSortByItemForName(state.sortByItemName));
export const selectTimeItem = createSelector(
selectState,
state => getTimeItemForName(state.timeItemName)
);
export const selectTimeItem = createSelector(selectState, state => getTimeItemForName(state.timeItemName));
export const makeSelectClientSetting = setting =>
createSelector(
selectClientSettings,
settings => (settings ? settings[setting] : undefined)
);
createSelector(selectClientSettings, settings => (settings ? settings[setting] : undefined));
// refactor me
export const selectShowNsfw = makeSelectClientSetting(SETTINGS.SHOW_NSFW);
export const selectKeepDaemonRunning = makeSelectClientSetting(SETTINGS.KEEP_DAEMON_RUNNING);
export const selectFullscreenMode = createSelector(
selectState,
state => state.fullscreenMode
);
export const selectFullscreenMode = createSelector(selectState, state => state.fullscreenMode);
export const selectSdkReady = createSelector(selectState, state => state.sdkReady);

View file

@ -398,6 +398,23 @@ const discoverStyle = StyleSheet.create({
fontSize: 14,
textAlign: 'center',
},
sdkLoading: {
position: 'absolute',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
bottom: 0,
left: 0,
right: 0,
padding: 8,
backgroundColor: Colors.LbryGreen,
},
sdkLoadingText: {
fontFamily: 'Inter-Regular',
fontSize: 14,
color: Colors.White,
marginLeft: 8,
},
});
export default discoverStyle;