mirror of
https://github.com/ecency/ecency-mobile.git
synced 2024-12-23 21:35:04 +03:00
fixed draft bugs and editor
This commit is contained in:
parent
b362a90d33
commit
2bbef31991
@ -37,6 +37,7 @@
|
|||||||
"dsteem": "^0.10.1",
|
"dsteem": "^0.10.1",
|
||||||
"intl": "^1.2.5",
|
"intl": "^1.2.5",
|
||||||
"jsc-android": "^236355.1.1",
|
"jsc-android": "^236355.1.1",
|
||||||
|
"lodash": "^4.17.11",
|
||||||
"moment": "^2.22.2",
|
"moment": "^2.22.2",
|
||||||
"react": "^16.7.0",
|
"react": "^16.7.0",
|
||||||
"react-intl": "^2.7.2",
|
"react-intl": "^2.7.2",
|
||||||
@ -69,8 +70,8 @@
|
|||||||
"remarkable": "^1.7.1",
|
"remarkable": "^1.7.1",
|
||||||
"rn-placeholder": "^1.3.2",
|
"rn-placeholder": "^1.3.2",
|
||||||
"speakingurl": "^14.0.1",
|
"speakingurl": "^14.0.1",
|
||||||
"steemconnect": "^2.0.1",
|
"stacktrace-parser": "0.1.4",
|
||||||
"stacktrace-parser": "0.1.4"
|
"steemconnect": "^2.0.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"babel-eslint": "^10.0.1",
|
"babel-eslint": "^10.0.1",
|
||||||
|
@ -97,6 +97,7 @@ class BasicHeaderView extends Component {
|
|||||||
title,
|
title,
|
||||||
} = this.props;
|
} = this.props;
|
||||||
const { isInputVisible, datePickerValue } = this.state;
|
const { isInputVisible, datePickerValue } = this.state;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SafeAreaView style={styles.safeArea}>
|
<SafeAreaView style={styles.safeArea}>
|
||||||
<View style={styles.container}>
|
<View style={styles.container}>
|
||||||
|
@ -43,9 +43,11 @@ export default class TagAreaView extends Component {
|
|||||||
// Component Functions
|
// Component Functions
|
||||||
_handleOnChange = (text, i) => {
|
_handleOnChange = (text, i) => {
|
||||||
this.setState({ currentText: text.replace(/\s/g, '') });
|
this.setState({ currentText: text.replace(/\s/g, '') });
|
||||||
|
|
||||||
if (text.indexOf(' ') > 0 && text) {
|
if (text.indexOf(' ') > 0 && text) {
|
||||||
this._handleTagAdded();
|
this._handleTagAdded();
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!text) {
|
if (!text) {
|
||||||
this._handleTagRemove(i);
|
this._handleTagRemove(i);
|
||||||
}
|
}
|
||||||
|
@ -3,6 +3,7 @@ import { connect } from 'react-redux';
|
|||||||
import { injectIntl } from 'react-intl';
|
import { injectIntl } from 'react-intl';
|
||||||
import { Alert, AsyncStorage } from 'react-native';
|
import { Alert, AsyncStorage } from 'react-native';
|
||||||
import ImagePicker from 'react-native-image-crop-picker';
|
import ImagePicker from 'react-native-image-crop-picker';
|
||||||
|
import { get } from 'lodash';
|
||||||
|
|
||||||
// Services and Actions
|
// Services and Actions
|
||||||
import { Buffer } from 'buffer';
|
import { Buffer } from 'buffer';
|
||||||
@ -122,6 +123,7 @@ class EditorContainer extends Component {
|
|||||||
_getDraft = async (username, isReply) => {
|
_getDraft = async (username, isReply) => {
|
||||||
if (isReply) {
|
if (isReply) {
|
||||||
const draftReply = await AsyncStorage.getItem('temp-reply');
|
const draftReply = await AsyncStorage.getItem('temp-reply');
|
||||||
|
|
||||||
if (draftReply) {
|
if (draftReply) {
|
||||||
this.setState({
|
this.setState({
|
||||||
draftPost: { body: draftReply },
|
draftPost: { body: draftReply },
|
||||||
@ -137,9 +139,6 @@ class EditorContainer extends Component {
|
|||||||
tags: result.tags.split(','),
|
tags: result.tags.split(','),
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
// alert(error);
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -223,7 +222,7 @@ class EditorContainer extends Component {
|
|||||||
const { intl } = this.props;
|
const { intl } = this.props;
|
||||||
this.setState({ isCameraOrPickerOpen: false });
|
this.setState({ isCameraOrPickerOpen: false });
|
||||||
|
|
||||||
if (error.code === 'E_PERMISSION_MISSING') {
|
if (get(error, 'code') === 'E_PERMISSION_MISSING') {
|
||||||
Alert.alert(
|
Alert.alert(
|
||||||
intl.formatMessage({
|
intl.formatMessage({
|
||||||
id: 'alert.permission_denied',
|
id: 'alert.permission_denied',
|
||||||
@ -235,28 +234,30 @@ class EditorContainer extends Component {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Media select functions <- END ->
|
|
||||||
|
|
||||||
_saveDraftToDB = (fields) => {
|
_saveDraftToDB = (fields) => {
|
||||||
const { isDraftSaved, draftId } = this.state;
|
const { isDraftSaved, draftId } = this.state;
|
||||||
|
|
||||||
if (!isDraftSaved) {
|
if (!isDraftSaved) {
|
||||||
const { currentAccount } = this.props;
|
const { currentAccount } = this.props;
|
||||||
const username = currentAccount && currentAccount.name ? currentAccount.name : '';
|
const username = get(currentAccount, 'name', '');
|
||||||
|
let draftField;
|
||||||
|
|
||||||
this.setState({ isDraftSaving: true });
|
this.setState({ isDraftSaving: true });
|
||||||
const draftField = {
|
if (fields) {
|
||||||
|
draftField = {
|
||||||
...fields,
|
...fields,
|
||||||
tags: fields.tags.join(' '),
|
tags: fields.tags.join(' '),
|
||||||
username,
|
username,
|
||||||
};
|
};
|
||||||
|
}
|
||||||
|
|
||||||
if (draftId) {
|
if (draftId && draftField) {
|
||||||
updateDraft({ ...draftField, draftId }).then(() => {
|
updateDraft({ ...draftField, draftId }).then(() => {
|
||||||
this.setState({
|
this.setState({
|
||||||
isDraftSaved: true,
|
isDraftSaved: true,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
} else {
|
} else if (draftField) {
|
||||||
addDraft(draftField).then((response) => {
|
addDraft(draftField).then((response) => {
|
||||||
this.setState({
|
this.setState({
|
||||||
isDraftSaved: true,
|
isDraftSaved: true,
|
||||||
@ -267,6 +268,7 @@ class EditorContainer extends Component {
|
|||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
isDraftSaving: false,
|
isDraftSaving: false,
|
||||||
|
isDraftSaved,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -346,15 +348,6 @@ class EditorContainer extends Component {
|
|||||||
0,
|
0,
|
||||||
)
|
)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
// Alert.alert(
|
|
||||||
// intl.formatMessage({
|
|
||||||
// id: 'alert.success',
|
|
||||||
// }),
|
|
||||||
// intl.formatMessage({
|
|
||||||
// id: 'alert.success_shared',
|
|
||||||
// }),
|
|
||||||
// );
|
|
||||||
|
|
||||||
dispatch(
|
dispatch(
|
||||||
toastNotification(
|
toastNotification(
|
||||||
intl.formatMessage({
|
intl.formatMessage({
|
||||||
@ -488,8 +481,10 @@ class EditorContainer extends Component {
|
|||||||
_handleSubmitSuccess = () => {
|
_handleSubmitSuccess = () => {
|
||||||
const { navigation } = this.props;
|
const { navigation } = this.props;
|
||||||
|
|
||||||
|
if (navigation) {
|
||||||
navigation.goBack();
|
navigation.goBack();
|
||||||
navigation.state.params.fetchPost();
|
navigation.state.params.fetchPost();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
_handleOnBackPress = () => {
|
_handleOnBackPress = () => {
|
||||||
@ -526,7 +521,7 @@ class EditorContainer extends Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
_setScheduledPost = (data) => {
|
_setScheduledPost = (data) => {
|
||||||
const { dispatch } = this.props;
|
const { dispatch, intl } = this.props;
|
||||||
|
|
||||||
schedule(
|
schedule(
|
||||||
data.author,
|
data.author,
|
||||||
@ -542,10 +537,9 @@ class EditorContainer extends Component {
|
|||||||
this.setState({ isPostSending: false });
|
this.setState({ isPostSending: false });
|
||||||
dispatch(
|
dispatch(
|
||||||
toastNotification(
|
toastNotification(
|
||||||
// intl.formatMessage({
|
intl.formatMessage({
|
||||||
// id: 'alert.copied',
|
id: 'alert.success',
|
||||||
// }),
|
}),
|
||||||
'Scheduled',
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
@ -553,6 +547,17 @@ class EditorContainer extends Component {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_initialEditor = () => {
|
||||||
|
const { currentAccount: { name } } = this.props;
|
||||||
|
|
||||||
|
setDraftPost(
|
||||||
|
{ title: '', body: '', tags: '' },
|
||||||
|
name,
|
||||||
|
);
|
||||||
|
|
||||||
|
this.setState({ uploadedImage: null });
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { isLoggedIn, isDarkTheme } = this.props;
|
const { isLoggedIn, isDarkTheme } = this.props;
|
||||||
const {
|
const {
|
||||||
@ -579,6 +584,7 @@ class EditorContainer extends Component {
|
|||||||
handleOnBackPress={this._handleOnBackPress}
|
handleOnBackPress={this._handleOnBackPress}
|
||||||
handleOnImagePicker={this._handleRoutingAction}
|
handleOnImagePicker={this._handleRoutingAction}
|
||||||
handleOnSubmit={this._handleSubmit}
|
handleOnSubmit={this._handleSubmit}
|
||||||
|
initialEditor={this._initialEditor}
|
||||||
isCameraOrPickerOpen={isCameraOrPickerOpen}
|
isCameraOrPickerOpen={isCameraOrPickerOpen}
|
||||||
isDarkTheme={isDarkTheme}
|
isDarkTheme={isDarkTheme}
|
||||||
isDraftSaved={isDraftSaved}
|
isDraftSaved={isDraftSaved}
|
||||||
|
@ -1,6 +1,7 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import { View } from 'react-native';
|
import { View } from 'react-native';
|
||||||
import { injectIntl } from 'react-intl';
|
import { injectIntl } from 'react-intl';
|
||||||
|
import { get } from 'lodash';
|
||||||
|
|
||||||
// Utils
|
// Utils
|
||||||
import { getWordsCount } from '../../../utils/editor';
|
import { getWordsCount } from '../../../utils/editor';
|
||||||
@ -57,6 +58,8 @@ class EditorScreen extends Component {
|
|||||||
|
|
||||||
// Component Functions
|
// Component Functions
|
||||||
_initialFields = () => {
|
_initialFields = () => {
|
||||||
|
const { initialEditor } = this.props;
|
||||||
|
|
||||||
this.setState({
|
this.setState({
|
||||||
fields: {
|
fields: {
|
||||||
title: '',
|
title: '',
|
||||||
@ -66,6 +69,8 @@ class EditorScreen extends Component {
|
|||||||
},
|
},
|
||||||
isRemoveTag: true,
|
isRemoveTag: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
if (initialEditor) initialEditor();
|
||||||
};
|
};
|
||||||
|
|
||||||
_handleOnPressPreviewButton = () => {
|
_handleOnPressPreviewButton = () => {
|
||||||
@ -115,24 +120,23 @@ class EditorScreen extends Component {
|
|||||||
_handleIsFormValid = (bodyText) => {
|
_handleIsFormValid = (bodyText) => {
|
||||||
const { fields } = this.state;
|
const { fields } = this.state;
|
||||||
const { isReply } = this.props;
|
const { isReply } = this.props;
|
||||||
let _isFormValid;
|
let isFormValid;
|
||||||
|
|
||||||
if (isReply) {
|
if (isReply) {
|
||||||
_isFormValid = fields && fields.body && fields.body.length > 0;
|
isFormValid = get(fields, 'body').length > 0;
|
||||||
} else {
|
} else {
|
||||||
_isFormValid = fields
|
isFormValid = get(fields, 'title', '')
|
||||||
&& fields.title
|
&& (get(fields, 'body', '') || (bodyText && bodyText > 0))
|
||||||
&& fields.title.length > 0
|
&& get(fields, 'tags', null);
|
||||||
&& ((fields.body && fields.body.length > 0 && fields.tags.length > 0)
|
|
||||||
|| (bodyText && bodyText.length > 0));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({ isFormValid: _isFormValid });
|
this.setState({ isFormValid });
|
||||||
};
|
};
|
||||||
|
|
||||||
_handleFormUpdate = (componentID, content) => {
|
_handleFormUpdate = (componentID, content) => {
|
||||||
const { handleFormChanged, isReply } = this.props;
|
const { handleFormChanged } = this.props;
|
||||||
const fields = { ...this.state.fields };
|
const { fields: _fields } = this.state;
|
||||||
|
const fields = { ..._fields };
|
||||||
|
|
||||||
if (componentID === 'body') {
|
if (componentID === 'body') {
|
||||||
fields.body = content;
|
fields.body = content;
|
||||||
@ -140,20 +144,26 @@ class EditorScreen extends Component {
|
|||||||
fields.title = content;
|
fields.title = content;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({ fields });
|
if ((get(fields, 'body', '').trim() !== get(_fields, 'body', '').trim()
|
||||||
|
|| get(fields, 'title', '').trim() !== get(_fields, 'title', '').trim()
|
||||||
|
|| get(fields, 'tags') !== get(_fields, 'tags'))) {
|
||||||
handleFormChanged();
|
handleFormChanged();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.setState({ fields });
|
||||||
|
|
||||||
this._handleIsFormValid();
|
this._handleIsFormValid();
|
||||||
this._saveCurrentDraft();
|
this._saveCurrentDraft();
|
||||||
};
|
};
|
||||||
|
|
||||||
_handleOnTagAdded = (tags) => {
|
_handleOnTagAdded = async (tags) => {
|
||||||
|
const { fields: _fields } = this.state;
|
||||||
const _tags = tags.filter(tag => tag && tag !== ' ');
|
const _tags = tags.filter(tag => tag && tag !== ' ');
|
||||||
const fields = { ...this.state.fields };
|
|
||||||
|
|
||||||
fields.tags = _tags;
|
const fields = { ..._fields, tags: [..._tags] };
|
||||||
this.setState({ fields, isRemoveTag: false });
|
await this.setState({ fields, isRemoveTag: false });
|
||||||
|
|
||||||
|
this._handleFormUpdate();
|
||||||
};
|
};
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
@ -161,7 +171,6 @@ class EditorScreen extends Component {
|
|||||||
fields, isPreviewActive, wordsCount, isFormValid, isRemoveTag,
|
fields, isPreviewActive, wordsCount, isFormValid, isRemoveTag,
|
||||||
} = this.state;
|
} = this.state;
|
||||||
const {
|
const {
|
||||||
draftPost,
|
|
||||||
handleOnImagePicker,
|
handleOnImagePicker,
|
||||||
intl,
|
intl,
|
||||||
isDraftSaved,
|
isDraftSaved,
|
||||||
|
Loading…
Reference in New Issue
Block a user