LBRYCommunity/lbry-react-native
1
0
Fork 0
Code Issues Pull requests 12 Projects Releases Packages Wiki Activity

fix: merge conflict

Browse source
This commit is contained in:
Akinwale Ariwodola 2019-09-24 17:25:14 +01:00
commit ab4e7ee84d
21 changed files with 318 additions and 117 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
src/assets/gerbil-happy.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 265 KiB

BIN
src/assets/gerbil-sad.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 278 KiB

18
src/component/AppNavigator.js
View file

@ -29,8 +29,9 @@ import {
import { connect } from 'react-redux';
import { AppState, BackHandler, Linking, NativeModules, TextInput, ToastAndroid } from 'react-native';
import { selectDrawerStack } from 'redux/selectors/drawer';
import { SETTINGS, doDismissToast, doToast, selectToast } from 'lbry-redux';
import { SETTINGS, doDismissToast, doPopulateSharedUserState, doToast, selectToast } from 'lbry-redux';
import {
Lbryio,
doGetSync,
doUserCheckEmailVerified,
doUserEmailVerify,
@ -305,6 +306,13 @@ class AppWithNavigationState extends React.Component {
});
};
getUserSettings = () => {
const { dispatch } = this.props;
Lbryio.call('user_settings', 'get').then(settings => {
dispatch(doPopulateSharedUserState(settings));
});
};
componentWillUnmount() {
AppState.removeEventListener('change', this._handleAppStateChange);
BackHandler.removeEventListener('hardwareBackPress');
@ -321,12 +329,8 @@ class AppWithNavigationState extends React.Component {
NativeModules.Firebase.track('email_verified', { email: user.primary_email });
ToastAndroid.show('Your email address was successfully verified.', ToastAndroid.LONG);
// upon successful email verification, do wallet sync (if password has been set)
NativeModules.UtilityModule.getSecureValue(Constants.KEY_FIRST_RUN_PASSWORD).then(walletPassword => {
if (walletPassword && walletPassword.trim().length > 0) {
dispatch(doGetSync(walletPassword));
}
});
// get user settings after email verification
this.getUserSettings();
}
}

8
src/component/channelSelector/view.js
View file

@ -27,7 +27,7 @@ export default class ChannelSelector extends React.PureComponent {
componentDidMount() {
const { channels = [], channelName, fetchChannelListMine, fetchingChannels } = this.props;
if (!channels.length && !fetchingChannels) {
if ((!channels || channels.length === 0) && !fetchingChannels) {
fetchChannelListMine();
}
this.setState({ currentSelectedValue: channelName });
@ -37,7 +37,7 @@ export default class ChannelSelector extends React.PureComponent {
const { channels: prevChannels = [], channelName } = this.props;
const { channels = [] } = nextProps;
if (channels.length !== prevChannels.length && channelName !== this.state.currentSelectedValue) {
if (channels && channels.length !== prevChannels.length && channelName !== this.state.currentSelectedValue) {
this.setState({ currentSelectedValue: channelName });
}
}
@ -182,7 +182,9 @@ export default class ChannelSelector extends React.PureComponent {
render() {
const channel = this.state.addingChannel ? 'new' : this.props.channel;
const { enabled, fetchingChannels, channels = [] } = this.props;
const pickerItems = [Constants.ITEM_ANONYMOUS, Constants.ITEM_CREATE_A_CHANNEL].concat(channels.map(ch => ch.name));
const pickerItems = [Constants.ITEM_ANONYMOUS, Constants.ITEM_CREATE_A_CHANNEL].concat(
channels ? channels.map(ch => ch.name) : []
);
const {
newChannelName,

4
src/component/emptyStateView/index.js Normal file
View file

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

26
src/component/emptyStateView/view.js Normal file
View file

@ -0,0 +1,26 @@
import React from 'react';
import { NativeModules, Text, View, Image, TouchableOpacity } from 'react-native';
import Button from '../button';
import emptyStateStyle from 'styles/emptyState';
class EmptyStateView extends React.PureComponent {
render() {
const { message, buttonText, inner, onButtonPress } = this.props;
return (
<View
style={[emptyStateStyle.container, inner ? emptyStateStyle.innerContainer : emptyStateStyle.outerContainer]}
>
<Image style={emptyStateStyle.image} resizeMode={'stretch'} source={require('../../assets/gerbil-happy.png')} />
<Text style={emptyStateStyle.message}>{message}</Text>
{buttonText && (
<View style={emptyStateStyle.buttonContainer}>
<Button style={emptyStateStyle.button} text={buttonText} onPress={onButtonPress} />
</View>
)}
</View>
);
}
}
export default EmptyStateView;

3
src/component/rewardCard/view.js
View file

@ -59,7 +59,8 @@ class RewardCard extends React.PureComponent<Props> {
getDisplayAmount = () => {
const { reward } = this.props;
if (reward) {
if (reward.reward_range && reward.reward_range.includes('-')) {
const claimed = !!reward.transaction_id;
if (!claimed && reward.reward_range && reward.reward_range.includes('-')) {
return reward.reward_range.split('-')[0] + '+'; // ex: 5+
} else if (reward.reward_amount > 0) {
return reward.reward_amount;

4
src/page/channel/index.js
View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux';
import { makeSelectClaimForUri, selectMyChannelClaims } from 'lbry-redux';
import { doAbandonClaim, doFetchChannelListMine, makeSelectClaimForUri, selectMyChannelClaims } from 'lbry-redux';
import { doPopDrawerStack } from 'redux/actions/drawer';
import { doSetSortByItem, doSetTimeItem } from 'redux/actions/settings';
import { selectDrawerStack } from 'redux/selectors/drawer';
@ -15,6 +15,8 @@ const select = (state, props) => ({
});
const perform = dispatch => ({
abandonClaim: (txid, nout) => dispatch(doAbandonClaim(txid, nout)),
fetchChannelListMine: () => dispatch(doFetchChannelListMine()),
popDrawerStack: () => dispatch(doPopDrawerStack()),
setSortByItem: item => dispatch(doSetSortByItem(item)),
setTimeItem: item => dispatch(doSetTimeItem(item)),

9
src/page/channel/view.js
View file

@ -19,6 +19,7 @@ import ClaimList from 'component/claimList';
import Colors from 'styles/colors';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import Button from 'component/button';
import EmptyStateView from 'component/emptyStateView';
import Icon from 'react-native-vector-icons/FontAwesome5';
import Link from 'component/link';
import ModalPicker from 'component/modalPicker';
@ -47,7 +48,9 @@ class ChannelPage extends React.PureComponent {
}
componentDidMount() {
const { fetchChannelListMine } = this.props;
NativeModules.Firebase.setCurrentScreen('Channel');
fetchChannelListMine();
}
handleSortByItemSelected = item => {
@ -128,9 +131,7 @@ class ChannelPage extends React.PureComponent {
return (
<View style={channelPageStyle.aboutTab}>
{!websiteUrl && !email && !description && (
<View style={channelPageStyle.busyContainer}>
<Text style={channelPageStyle.infoText}>Nothing here yet. Please check back later.</Text>
</View>
<EmptyStateView message={"There's nothing here yet.\nPlease check back later."} />
)}
{(websiteUrl || email || description) && (
@ -266,7 +267,7 @@ class ChannelPage extends React.PureComponent {
)}
{ownedChannel && (
<Button
style={channelPageStyle.deleteButton}
style={[channelPageStyle.actionButton, channelPageStyle.deleteButton]}
theme={'light'}
icon={'trash-alt'}
text={'Delete'}

52
src/page/channelCreator/view.js
View file

@ -19,6 +19,7 @@ import Button from 'component/button';
import ChannelIconItem from 'component/channelIconItem';
import Colors from 'styles/colors';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import EmptyStateView from 'component/emptyStateView';
import FloatingWalletBalance from 'component/floatingWalletBalance';
import Icon from 'react-native-vector-icons/FontAwesome5';
import Link from 'component/link';
@ -175,10 +176,8 @@ export default class ChannelCreator extends React.PureComponent {
if (!isEditMode && hasFormState) {
this.loadPendingFormState();
this.setState({ currentPhase: Constants.PHASE_CREATE });
} else {
this.setState({ currentPhase: Constants.PHASE_LIST });
}
this.setState({ currentPhase: isEditMode || hasFormState ? Constants.PHASE_CREATE : Constants.PHASE_LIST });
});
};
@ -240,7 +239,7 @@ export default class ChannelCreator extends React.PureComponent {
componentDidUpdate() {
const { channels = [] } = this.props;
const { editChannelUrl } = this.state;
if (channels.length > 0) {
if (channels && channels.length > 0) {
if (this.state.autoStyles.length !== channels.length) {
this.setState({
autoStyles: this.generateAutoStyles(channels.length),
@ -534,10 +533,12 @@ export default class ChannelCreator extends React.PureComponent {
};
showChannelList = () => {
const { popDrawerStack } = this.props;
const { drawerStack, popDrawerStack } = this.props;
if (drawerStack[drawerStack.length - 1].route === Constants.DRAWER_ROUTE_CHANNEL_CREATOR_FORM) {
popDrawerStack();
this.resetChannelCreator();
}
this.setState({ currentPhase: Constants.PHASE_LIST });
this.resetChannelCreator();
};
resetChannelCreator = () => {
@ -606,6 +607,7 @@ export default class ChannelCreator extends React.PureComponent {
this.setState({
claimId: channel.claim_id,
currentPhase: Constants.PHASE_CREATE,
displayName: value && value.title ? value.title : channel.name.substring(1),
editMode: true,
coverImageUrl: value && value.cover ? value.cover.url : null,
currentChannelName: channel.name.substring(1),
@ -744,6 +746,8 @@ export default class ChannelCreator extends React.PureComponent {
uploadingImage,
} = this.state;
const hasChannels = channels && channels.length > 0;
return (
<View style={channelCreatorStyle.container}>
<UriBar
@ -756,26 +760,25 @@ export default class ChannelCreator extends React.PureComponent {
onExitSelectionMode={this.onExitSelectionMode}
/>
{fetchingChannels && (
<View style={channelCreatorStyle.loading}>
<ActivityIndicator size={'large'} color={Colors.NextLbryGreen} />
</View>
)}
{currentPhase === Constants.PHASE_LIST && !fetchingChannels && !hasChannels && (
<EmptyStateView
message={'You have not created a channel.\nStart now by creating a new channel!'}
buttonText={'Create a channel'}
onButtonPress={this.handleNewChannelPress}
/>
)}
{currentPhase === Constants.PHASE_LIST && (
<FlatList
extraData={this.state}
ListHeaderComponent={
fetchingChannels ? (
<View style={channelCreatorStyle.listHeader}>
<ActivityIndicator size={'small'} color={Colors.NextLbryGreen} />
</View>
) : null
}
ListEmptyComponent={
fetchingChannels ? null : (
<View style={channelCreatorStyle.listEmpty}>
<Text style={channelCreatorStyle.listEmptyText}>
You have not created a channel. Start now by creating a new channel!
</Text>
</View>
)
}
ListFooterComponent={
!channels || channels.length === 0 ? null : (
<View style={channelCreatorStyle.listFooter}>
<Button
style={channelCreatorStyle.createChannelButton}
@ -783,6 +786,7 @@ export default class ChannelCreator extends React.PureComponent {
onPress={this.handleNewChannelPress}
/>
</View>
)
}
style={channelCreatorStyle.scrollContainer}
contentContainerStyle={channelCreatorStyle.scrollPadding}
@ -825,7 +829,7 @@ export default class ChannelCreator extends React.PureComponent {
</TouchableOpacity>
);
}}
data={channels.filter(channel => !abandoningClaimIds.includes(channel.claim_id))}
data={channels ? channels.filter(channel => !abandoningClaimIds.includes(channel.claim_id)) : []}
keyExtractor={(item, index) => item.claim_id}
/>
)}
@ -864,7 +868,7 @@ export default class ChannelCreator extends React.PureComponent {
source={{ uri: thumbnailUrl }}
/>
)}
{thumbnailUrl !== null && thumbnailUrl.trim().length === 0 && newChannelName.length > 1 && (
{(thumbnailUrl === null || thumbnailUrl.trim().length === 0) && newChannelName.length > 1 && (
<Text style={channelIconStyle.autothumbCharacter}>
{newChannelName.substring(0, 1).toUpperCase()}
</Text>

11
src/page/downloads/view.js
View file

@ -15,6 +15,7 @@ import { __, navigateToUri, uriFromFileInfo } from 'utils/helper';
import Colors from 'styles/colors';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import PageHeader from 'component/pageHeader';
import EmptyStateView from 'component/emptyStateView';
import FileListItem from 'component/fileListItem';
import FloatingWalletBalance from 'component/floatingWalletBalance';
import StorageStatsCard from 'component/storageStatsCard';
@ -154,6 +155,10 @@ class DownloadsPage extends React.PureComponent {
onDeleteActionPressed={this.onDeleteActionPressed}
/>
{!fetching && !hasDownloads && (
<EmptyStateView message={'You do not have any\ndownloaded content on this device.'} />
)}
<View style={downloadsStyle.subContainer}>
{hasDownloads && <StorageStatsCard fileInfos={this.getFilteredFileInfos()} />}
{fetching && (
@ -161,11 +166,7 @@ class DownloadsPage extends React.PureComponent {
<ActivityIndicator size="large" color={Colors.NextLbryGreen} style={downloadsStyle.loading} />
</View>
)}
{!fetching && !hasDownloads && (
<View style={downloadsStyle.busyContainer}>
<Text style={downloadsStyle.noDownloadsText}>You do not have any downloaded content on this device.</Text>
</View>
)}
{!fetching && hasDownloads && (
<FlatList
extraData={this.state}

33
src/page/file/view.js
View file

@ -22,6 +22,7 @@ import { navigateBack, navigateToUri } from 'utils/helper';
import Icon from 'react-native-vector-icons/FontAwesome5';
import ImageViewer from 'react-native-image-zoom-viewer';
import Button from 'component/button';
import EmptyStateView from 'component/emptyStateView';
import Tag from 'component/tag';
import ChannelPage from 'page/channel';
import Colors from 'styles/colors';
@ -100,7 +101,7 @@ class FilePage extends React.PureComponent {
DeviceEventEmitter.addListener('onDownloadUpdated', this.handleDownloadUpdated);
DeviceEventEmitter.addListener('onDownloadCompleted', this.handleDownloadCompleted);
const { fetchChannelListMine, fileInfo, isResolvingUri, resolveUri, navigation } = this.props;
const { fetchMyClaims, fileInfo, isResolvingUri, resolveUri, navigation } = this.props;
const { uri, uriVars } = navigation.state.params;
this.setState({ uri, uriVars });
@ -108,7 +109,7 @@ class FilePage extends React.PureComponent {
this.fetchFileInfo(this.props);
this.fetchCostInfo(this.props);
fetchChannelListMine();
fetchMyClaims();
if (NativeModules.Firebase) {
NativeModules.Firebase.track('open_file_page', { uri: uri });
@ -590,14 +591,15 @@ class FilePage extends React.PureComponent {
} = this.props;
const { uri, autoplay } = navigation.state.params;
const { isChannel } = parseURI(uri);
const myChannelUris = channels ? channels.map(channel => channel.permanent_url) : [];
const ownedClaim = myClaimUris.includes(uri) || myChannelUris.includes(uri);
const { isChannel } = parseURI(uri);
let innerContent = null;
if ((isResolvingUri && !claim) || !claim) {
return (
<View style={filePageStyle.container}>
<UriBar value={uri} navigation={navigation} />
{isResolvingUri && (
<View style={filePageStyle.busyContainer}>
<ActivityIndicator size="large" color={Colors.NextLbryGreen} />
@ -607,16 +609,29 @@ class FilePage extends React.PureComponent {
{claim === null && !isResolvingUri && (
<View style={filePageStyle.container}>
{ownedClaim && (
<Text style={filePageStyle.emptyClaimText}>
{isChannel
<EmptyStateView
message={
isChannel
? 'It looks like you just created this channel. It will appear in a few minutes.'
: 'It looks you just published this content. It will appear in a few minutes.'}
</Text>
: 'It looks you just published this content. It will appear in a few minutes.'
}
/>
)}
{!ownedClaim && (
<EmptyStateView
message={"There's nothing at this location."}
buttonText={'Publish something here'}
onButtonPress={() =>
navigation.navigate({
routeName: Constants.DRAWER_ROUTE_PUBLISH,
params: { vanityUrl: uri.trim() },
})
}
/>
)}
{!ownedClaim && <Text style={filePageStyle.emptyClaimText}>There's nothing at this location.</Text>}
</View>
)}
<UriBar value={uri} navigation={navigation} />
<FloatingWalletBalance navigation={navigation} />
</View>
);
}

2
src/page/publish/index.js
View file

@ -4,7 +4,6 @@ import {
doResolveUri,
doToast,
doUpdatePublishForm,
doUploadThumbnail,
selectBalance,
selectPublishFormValues,
} from 'lbry-redux';
@ -28,7 +27,6 @@ const perform = dispatch => ({
clearPublishFormState: () => dispatch(doClearPublishFormState()),
updatePublishForm: value => dispatch(doUpdatePublishForm(value)),
updatePublishFormState: data => dispatch(doUpdatePublishFormState(data)),
uploadThumbnail: (filePath, fsAdapter) => dispatch(doUploadThumbnail(filePath, null, fsAdapter)),
publish: (success, fail) => dispatch(doPublish(success, fail)),
resolveUri: uri => dispatch(doResolveUri(uri)),
pushDrawerStack: (routeName, params) => dispatch(doPushDrawerStack(routeName, params)),

120
src/page/publish/view.js
View file

@ -43,7 +43,7 @@ import Tag from 'component/tag';
import TagSearch from 'component/tagSearch';
import UriBar from 'component/uriBar';
import publishStyle from 'styles/publish';
import { __, navigateToUri } from 'utils/helper';
import { __, navigateToUri, uploadImageAsset } from 'utils/helper';
const languages = {
en: 'English',
@ -129,6 +129,8 @@ class PublishPage extends React.PureComponent {
uploadedThumbnailUri: null,
vanityUrlSet: false,
thumbnailImagePickerOpen: false,
// other
publishStarted: false,
};
@ -218,10 +220,8 @@ class PublishPage extends React.PureComponent {
// replace name with the specified vanity URL if there was one in the pending state
this.setState({ name: this.state.vanityUrl });
}
this.setState({ currentPhase: Constants.PHASE_DETAILS });
} else {
this.setState({ currentPhase: Constants.PHASE_SELECTOR });
}
this.setState({ currentPhase: isEditMode || hasFormState ? Constants.PHASE_DETAILS : Constants.PHASE_SELECTOR });
});
};
@ -256,6 +256,7 @@ class PublishPage extends React.PureComponent {
this.setState(
{
editMode: true,
publishStarted: false,
currentPhase: Constants.PHASE_DETAILS,
hasEditedContentAddress: true,
@ -382,10 +383,12 @@ class PublishPage extends React.PureComponent {
};
handlePublishSuccess = data => {
const { navigation, notify } = this.props;
const { clearPublishFormState, navigation, notify } = this.props;
notify({
message: `Your content was successfully published to ${this.state.uri}. It will be available in a few mintues.`,
});
clearPublishFormState();
this.setState({ publishStarted: false });
navigation.navigate({ routeName: Constants.DRAWER_ROUTE_PUBLISHES, params: { publishSuccess: true } });
};
@ -436,6 +439,7 @@ class PublishPage extends React.PureComponent {
updatePublishFormState({ currentMedia: media, name: newName });
this.setState(
{
publishStarted: false,
currentMedia: media,
title: null, // no title autogeneration (user will fill this in)
name: newName,
@ -453,7 +457,7 @@ class PublishPage extends React.PureComponent {
};
showSelector() {
const { updatePublishForm } = this.props;
const { clearPublishFormState, updatePublishForm } = this.props;
this.setState(
{
@ -490,9 +494,12 @@ class PublishPage extends React.PureComponent {
selectedChannel: null,
uploadedThumbnailUri: null,
thumbnailImagePickerOpen: false,
vanityUrlSet: false,
},
() => {
clearPublishFormState();
// reset thumbnail
updatePublishForm({ thumbnail: null });
}
@ -526,19 +533,59 @@ class PublishPage extends React.PureComponent {
);
};
handleThumbnailUploadSuccess = ({ url }) => {
const { updatePublishFormState } = this.props;
this.setState({
uploadThumbnailStarted: false,
currentThumbnailUri: url,
uploadedThumbnailUri: url,
});
updatePublishFormState({ currentThumbnailUri: url, uploadedThumbnailUri: url });
};
handleThumbnailUploadFailure = err => {
const { notify } = this.props;
this.setState({ uploadThumbnailStarted: false });
notify({ message: 'The thumbnail could not be uploaded. Please try again.' });
};
onFilePicked = evt => {
this.setState({ documentPickerOpen: false }, () => {
const { notify } = this.props;
if (evt.path && evt.path.length > 0) {
const fileUrl = `file://${evt.path}`;
if (this.state.documentPickerOpen) {
this.setState({ documentPickerOpen: false, thumbnailImagePickerOpen: false }, () => {
const currentMedia = {
id: -1,
filePath: `file://${evt.path}`,
filePath: fileUrl,
duration: 0,
};
this.setCurrentMedia(currentMedia);
});
} else if (this.state.thumbnailImagePickerOpen) {
this.setState(
{
documentPickerOpen: false,
thumbnailImagePickerOpen: false,
uploadThumbnailStarted: true,
currentThumbnailUri: fileUrl,
},
() => {
// upload a new thumbnail
uploadImageAsset(fileUrl, this.handleThumbnailUploadSuccess, this.handleThumbnailUploadFailure);
}
);
}
} else {
// could not determine the file path
notify({ message: 'The path could not be determined. Please try a different file.' });
}
};
onPickerCanceled = () => {
this.setState({ documentPickerOpen: false });
this.setState({ documentPickerOpen: false, thumbnailImagePickerOpen: false });
};
handleCloseCameraPressed = () => {
@ -573,6 +620,7 @@ class PublishPage extends React.PureComponent {
{
currentThumbnailUri: null,
updatingThumbnailUri: false,
publishStarted: false,
currentPhase: Constants.PHASE_DETAILS,
showCameraOverlay: false,
videoRecordingMode: false,
@ -597,6 +645,7 @@ class PublishPage extends React.PureComponent {
{
currentPhase: Constants.PHASE_DETAILS,
currentThumbnailUri: null,
publishStarted: false,
updatingThumbnailUri: false,
showCameraOverlay: false,
videoRecordingMode: false,
@ -701,7 +750,7 @@ class PublishPage extends React.PureComponent {
return;
}
const { notify, uploadThumbnail } = this.props;
const { notify } = this.props;
const { thumbnailPath } = this.state;
this.setState({ updatingThumbnailUri: true });
@ -716,7 +765,13 @@ class PublishPage extends React.PureComponent {
// upload the thumbnail
if (!this.state.uploadedThumbnailUri) {
this.setState({ uploadThumbnailStarted: true }, () => uploadThumbnail(this.getFilePathFromUri(uri), RNFS));
this.setState({ uploadThumbnailStarted: true }, () =>
uploadImageAsset(
this.getFilePathFromUri(uri),
this.handleThumbnailUploadSuccess,
this.handleThumbnailUploadFailure
)
);
}
} else if (mediaType === 'image' || mediaType === 'video') {
const create =
@ -727,7 +782,9 @@ class PublishPage extends React.PureComponent {
.then(path => {
this.setState({ currentThumbnailUri: `file://${path}`, updatingThumbnailUri: false });
if (!this.state.uploadedThumbnailUri) {
this.setState({ uploadThumbnailStarted: true }, () => uploadThumbnail(path, RNFS));
this.setState({ uploadThumbnailStarted: true }, () =>
uploadImageAsset(path, this.handleThumbnailUploadSuccess, this.handleThumbnailUploadFailure)
);
}
})
.catch(err => {
@ -783,7 +840,7 @@ class PublishPage extends React.PureComponent {
: '';
const licenseUrl = LICENSES.CC_LICENSES.reduce((value, item) => {
if (typeof value === 'object') {
value = '';
value = license === value.value ? item.url : '';
}
if (license === item.value) {
value = item.url;
@ -801,6 +858,25 @@ class PublishPage extends React.PureComponent {
this.setState({ otherLicenseDescription });
};
handleThumbnailPressed = () => {
const { notify } = this.props;
if (this.state.thumbnailImagePickerOpen || this.state.uploadThumbnailStarted) {
if (this.state.uploadThumbnailStarted) {
notify({ message: 'A thumbnail is already being uploaded. Please wait for the upload to finish.' });
}
return;
}
this.setState(
{
thumbnailImagePickerOpen: true,
},
() => {
NativeModules.UtilityModule.openDocumentPicker('image/*');
}
);
};
render() {
const { balance, navigation, notify, publishFormValues } = this.props;
const {
@ -895,22 +971,24 @@ class PublishPage extends React.PureComponent {
}
content = (
<ScrollView style={publishStyle.publishDetails}>
{currentThumbnailUri && currentThumbnailUri.trim().length > 0 && (
<View style={publishStyle.mainThumbnailContainer}>
<TouchableOpacity style={publishStyle.mainThumbnailContainer} onPress={this.handleThumbnailPressed}>
<FastImage
style={publishStyle.mainThumbnail}
resizeMode={FastImage.resizeMode.contain}
source={{ uri: currentThumbnailUri }}
/>
{this.state.uploadThumbnailStarted && !this.state.uploadedThumbnailUri && (
<View style={publishStyle.thumbnailEditOverlay}>
<Icon name={'edit'} style={publishStyle.editIcon} />
</View>
{this.state.uploadThumbnailStarted && (
<View style={publishStyle.thumbnailUploadContainer}>
<ActivityIndicator size={'small'} color={Colors.NextLbryGreen} />
<Text style={publishStyle.thumbnailUploadText}>Uploading thumbnail...</Text>
</View>
)}
</View>
)}
</TouchableOpacity>
{!this.state.canPublish && <PublishRewardsDriver navigation={navigation} />}
<View style={publishStyle.card}>
@ -1107,17 +1185,17 @@ class PublishPage extends React.PureComponent {
</View>
<View style={publishStyle.actionButtons}>
{(this.state.publishStarted || publishFormValues.publishing) && (
{this.state.publishStarted && (
<View style={publishStyle.progress}>
<ActivityIndicator size={'small'} color={Colors.NextLbryGreen} />
</View>
)}
{!publishFormValues.publishing && !this.state.publishStarted && (
{!this.state.publishStarted && (
<Link style={publishStyle.cancelLink} text="Cancel" onPress={() => this.showSelector()} />
)}
{!publishFormValues.publishing && !this.state.publishStarted && (
{!this.state.publishStarted && (
<View style={publishStyle.rightActionButtons}>
<Button
style={publishStyle.publishButton}

14
src/page/publishes/view.js
View file

@ -3,6 +3,7 @@ import { ActivityIndicator, Alert, FlatList, NativeModules, Text, TouchableOpaci
import Button from 'component/button';
import Colors from 'styles/colors';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import EmptyStateView from 'component/emptyStateView';
import FileListItem from 'component/fileListItem';
import FloatingWalletBalance from 'component/floatingWalletBalance';
import UriBar from 'component/uriBar';
@ -137,16 +138,11 @@ class PublishesPage extends React.PureComponent {
)}
{!fetching && (!uris || uris.length === 0) && (
<View style={publishStyle.noPublishes}>
<Text style={publishStyle.noPublishText}>
{__('It looks like you have not published anything to LBRY yet.')}
</Text>
<Button
style={publishStyle.publishNowButton}
text={__('Publish something new')}
onPress={() => navigation.navigate({ routeName: Constants.DRAWER_ROUTE_PUBLISH })}
<EmptyStateView
message={__('It looks like you have not\npublished any content to LBRY yet.')}
buttonText={__('Publish something new')}
onButtonPress={() => navigation.navigate({ routeName: Constants.DRAWER_ROUTE_PUBLISH })}
/>
</View>
)}
{uris && uris.length > 0 && (

5
src/page/transactionHistory/view.js
View file

@ -2,6 +2,7 @@ import React from 'react';
import { ActivityIndicator, NativeModules, View, ScrollView, Text } from 'react-native';
import Colors from 'styles/colors';
import Constants from 'constants'; // eslint-disable-line node/no-deprecated-api
import EmptyStateView from 'component/emptyStateView';
import TransactionList from 'component/transactionList';
import UriBar from 'component/uriBar';
import walletStyle from 'styles/wallet';
@ -53,11 +54,9 @@ class TransactionHistoryPage extends React.PureComponent {
<Text style={walletStyle.loadingText}>Loading transactions...</Text>
</View>
)}
{!fetchingTransactions && transactions.length === 0 && <EmptyStateView message={'No transactions to list.'} />}
<ScrollView style={walletStyle.transactionHistoryScroll}>
<View style={walletStyle.historyList}>
{!fetchingTransactions && transactions.length === 0 && (
<Text style={walletStyle.infoText}>No transactions to list.</Text>
)}
{!fetchingTransactions && transactions && transactions.length > 0 && (
<TransactionList navigation={navigation} transactions={transactions} />
)}

2
src/page/verification/internal/sync-verify-page.js
View file

@ -43,7 +43,7 @@ class SyncVerifyPage extends React.PureComponent {
navigation.goBack();
});
} else {
syncApply(syncHash, syncData, this.state.password);
syncApply(syncHash, syncData, this.state.password ? this.state.password : '');
}
});
};

11
src/styles/channelCreator.js
View file

@ -121,7 +121,7 @@ const channelCreatorStyle = StyleSheet.create({
height: '100%',
},
listFooter: {
marginTop: 24,
marginTop: 8,
},
createChannelButton: {
backgroundColor: Colors.LbryGreen,
@ -254,6 +254,15 @@ const channelCreatorStyle = StyleSheet.create({
fontSize: 12,
marginLeft: 4,
},
loading: {
position: 'absolute',
left: 0,
right: 0,
top: 0,
bottom: 0,
alignItems: 'center',
justifyContent: 'center',
},
});
export default channelCreatorStyle;

3
src/styles/channelPage.js
View file

@ -169,6 +169,9 @@ const channelPageStyle = StyleSheet.create({
actionButton: {
backgroundColor: Colors.White,
},
deleteButton: {
marginLeft: 8,
},
});
export default channelPageStyle;

40
src/styles/emptyState.js Normal file
View file

@ -0,0 +1,40 @@
import { StyleSheet } from 'react-native';
import Colors from './colors';
const emptyStateStyle = StyleSheet.create({
container: {
position: 'absolute',
left: 0,
right: 0,
bottom: 0,
paddingLeft: 24,
paddingRight: 24,
alignItems: 'center',
justifyContent: 'center',
zIndex: 99,
},
outerContainer: {
top: 60,
},
innerContainer: {
top: 0,
},
button: {
backgroundColor: Colors.LbryGreen,
fontSize: 18,
},
image: {
width: 128,
height: 170,
},
message: {
marginTop: 24,
textAlign: 'center',
fontFamily: 'Inter-UI-Regular',
fontSize: 18,
lineHeight: 28,
marginBottom: 24,
},
});
export default emptyStateStyle;

22
src/styles/publish.js
View file

@ -1,6 +1,9 @@
import { StyleSheet } from 'react-native';
import { Dimensions, StyleSheet } from 'react-native';
import Colors from './colors';
const screenDimension = Dimensions.get('window');
const screenWidth = screenDimension.width;
const publishStyle = StyleSheet.create({
container: {
flex: 1,
@ -434,7 +437,7 @@ const publishStyle = StyleSheet.create({
color: Colors.DescriptionGrey,
},
publishesFooter: {
marginTop: 16,
marginTop: 2,
marginLeft: 16,
marginRight: 16,
},
@ -443,6 +446,21 @@ const publishStyle = StyleSheet.create({
backgroundColor: Colors.LbryGreen,
marginTop: 16,
},
thumbnailEditOverlay: {
alignItems: 'center',
justifyContent: 'center',
borderRadius: 24,
position: 'absolute',
padding: 8,
left: screenWidth / 2 - 32 / 2,
bottom: 8,
backgroundColor: '#00000077',
},
editIcon: {
color: Colors.White,
fontFamily: 'Inter-UI-SemiBold',
fontSize: 12,
},
});
export default publishStyle;