2020-04-03 11:51:00 +00:00
|
|
|
import React, {useState, useEffect} from 'react';
|
2020-04-03 05:14:18 +00:00
|
|
|
import {connect} from 'react-redux';
|
2020-04-03 11:51:00 +00:00
|
|
|
import {View, Icon, Button, Text} from 'native-base';
|
2020-04-03 05:14:18 +00:00
|
|
|
import {TextField} from 'react-native-material-textfield';
|
|
|
|
import FieldEditor from './field-editor';
|
|
|
|
import TextInput from './text-input';
|
2020-04-03 11:51:00 +00:00
|
|
|
import {ScrollView} from 'react-native';
|
2020-04-03 05:14:18 +00:00
|
|
|
import PickerList from './picker-list';
|
2020-04-03 11:51:00 +00:00
|
|
|
import {setFields} from '../../actions/anki-set-actions';
|
|
|
|
import {
|
|
|
|
DEF_LIST1,
|
|
|
|
DEF_LIST2,
|
|
|
|
EXAMPLES,
|
|
|
|
PRONUNCIATION,
|
2020-04-22 05:34:14 +00:00
|
|
|
SOUND,
|
|
|
|
WORD,
|
2020-04-03 11:51:00 +00:00
|
|
|
} from '../../constants/anki-constants';
|
2020-04-11 16:49:25 +00:00
|
|
|
import {sendField} from '../../actions/form-actions';
|
2020-04-22 05:34:14 +00:00
|
|
|
import {addNote} from '../../actions/createAnkiLanModel';
|
2020-04-03 05:14:18 +00:00
|
|
|
|
2020-05-10 15:16:01 +00:00
|
|
|
const FieldList = (props) => {
|
2020-04-11 16:49:25 +00:00
|
|
|
const [pronunciation, setPronunciation] = useState(
|
|
|
|
props.response.pronunciation,
|
|
|
|
);
|
2020-04-03 11:51:00 +00:00
|
|
|
const [sound, setSound] = useState();
|
2020-04-11 16:49:25 +00:00
|
|
|
const [examples, setExamples] = useState();
|
2020-04-03 11:51:00 +00:00
|
|
|
const [completedFields, setCompletedFields] = useState({
|
|
|
|
word: props.word,
|
|
|
|
compounded: [{pos: '', tr: '', definition: ''}, {}],
|
|
|
|
examples: '',
|
|
|
|
pronunciation: '',
|
|
|
|
sound: '',
|
|
|
|
});
|
2020-04-11 16:49:25 +00:00
|
|
|
useEffect(() => {
|
|
|
|
if (
|
|
|
|
props.response.sound &&
|
|
|
|
props.response.pronunciation &&
|
|
|
|
props.response.compounded &&
|
|
|
|
props.response.examples
|
|
|
|
) {
|
|
|
|
// console.log("LOOOADED")
|
|
|
|
} else {
|
|
|
|
}
|
|
|
|
});
|
2020-04-03 11:51:00 +00:00
|
|
|
useEffect(() => {
|
|
|
|
setSound(props.response.sound);
|
|
|
|
setPronunciation(props.response.pronunciation);
|
|
|
|
setExamples(props.response.examples);
|
2020-05-10 15:16:01 +00:00
|
|
|
console.log('DPEDDDDD', props.response.compounded);
|
2020-04-03 11:51:00 +00:00
|
|
|
}, [props]);
|
2020-04-11 16:49:25 +00:00
|
|
|
const [loadingState, setLoadingState] = useState(false);
|
2020-04-03 11:51:00 +00:00
|
|
|
useEffect(() => {
|
2020-05-10 15:16:01 +00:00
|
|
|
// console.log('STATE', examples, pronunciation, sound);
|
2020-04-11 16:49:25 +00:00
|
|
|
if (examples && pronunciation && sound) {
|
|
|
|
setLoadingState(true);
|
|
|
|
} else {
|
|
|
|
setLoadingState(false);
|
|
|
|
}
|
2020-04-03 11:51:00 +00:00
|
|
|
});
|
2020-04-22 05:34:14 +00:00
|
|
|
useEffect(() => {}, [pronunciation]);
|
2020-04-03 11:51:00 +00:00
|
|
|
const submit = () => {
|
2020-04-11 16:49:25 +00:00
|
|
|
props.setFields(props.fields);
|
2020-04-03 11:51:00 +00:00
|
|
|
};
|
|
|
|
return (
|
2020-04-11 16:49:25 +00:00
|
|
|
<ScrollView keyboardShouldPersistTaps={'handled'} style={{height: '100%'}}>
|
|
|
|
{loadingState && props.loadingState ? (
|
|
|
|
<View>
|
2020-05-10 15:16:01 +00:00
|
|
|
<PickerList labelNum={1} id={props.pos1id} role={DEF_LIST1} />
|
2020-04-11 16:49:25 +00:00
|
|
|
{/*<PickerList labelNum={2} id={1} role={DEF_LIST2} />*/}
|
2020-05-10 15:16:01 +00:00
|
|
|
<PickerList labelNum={2} id={props.pos2id} role={DEF_LIST2} />
|
2020-04-11 16:49:25 +00:00
|
|
|
<FieldEditor
|
2020-05-10 15:16:01 +00:00
|
|
|
hasChanged={(c) =>
|
2020-04-11 16:49:25 +00:00
|
|
|
props.sendField({
|
|
|
|
text: c,
|
|
|
|
role: EXAMPLES,
|
|
|
|
})
|
|
|
|
}
|
|
|
|
role={EXAMPLES}
|
|
|
|
data={{
|
|
|
|
label: 'Usage example',
|
2020-04-22 03:19:44 +00:00
|
|
|
values: props.response.examples || ['can not find the example'],
|
2020-04-11 16:49:25 +00:00
|
|
|
}}
|
|
|
|
/>
|
|
|
|
<FieldEditor
|
2020-05-10 15:16:01 +00:00
|
|
|
hasChanged={(c) =>
|
2020-04-11 16:49:25 +00:00
|
|
|
props.sendField({
|
|
|
|
text: c,
|
|
|
|
role: SOUND,
|
|
|
|
})
|
|
|
|
}
|
2020-04-22 03:19:44 +00:00
|
|
|
data={{values: [props.response.sound], label: 'Sound'}}
|
2020-04-11 16:49:25 +00:00
|
|
|
role={SOUND}
|
|
|
|
/>
|
|
|
|
<FieldEditor
|
2020-05-10 15:16:01 +00:00
|
|
|
hasChanged={(c) =>
|
2020-04-11 16:49:25 +00:00
|
|
|
props.sendField({
|
|
|
|
text: c,
|
|
|
|
role: PRONUNCIATION,
|
|
|
|
})
|
|
|
|
}
|
|
|
|
role={PRONUNCIATION}
|
2020-04-22 05:34:14 +00:00
|
|
|
data={{
|
|
|
|
values: [props.response.pronunciation],
|
|
|
|
label: 'Pronunciation',
|
|
|
|
}}
|
2020-04-11 16:49:25 +00:00
|
|
|
/>
|
|
|
|
<Button style={{marginTop: 10}} onPress={submit}>
|
|
|
|
<Text>Submit</Text>
|
|
|
|
<Icon name={'send'} />
|
|
|
|
</Button>
|
|
|
|
</View>
|
|
|
|
) : (
|
|
|
|
<Text>Loading...</Text>
|
|
|
|
)}
|
2020-04-03 11:51:00 +00:00
|
|
|
</ScrollView>
|
|
|
|
);
|
|
|
|
};
|
2020-04-11 16:49:25 +00:00
|
|
|
export default connect(
|
2020-05-10 15:16:01 +00:00
|
|
|
(state) => ({
|
2020-04-11 16:49:25 +00:00
|
|
|
response: state.api.parsedDictionary,
|
|
|
|
word: state.api.availableApi.word,
|
|
|
|
loadingState: state.api.apiIsLoaded,
|
2020-04-22 05:34:14 +00:00
|
|
|
fields: state.anki.currentFields,
|
2020-05-10 15:16:01 +00:00
|
|
|
pos1id: state.anki.pos1id,
|
|
|
|
pos2id: state.anki.pos2id,
|
2020-04-11 16:49:25 +00:00
|
|
|
}),
|
|
|
|
{
|
|
|
|
sendField,
|
2020-04-22 05:34:14 +00:00
|
|
|
setFields,
|
2020-04-11 16:49:25 +00:00
|
|
|
},
|
|
|
|
)(FieldList);
|