diff --git a/src/components/Form/field-editor.jsx b/src/components/Form/field-editor.jsx index 20df7e4..6d8a416 100644 --- a/src/components/Form/field-editor.jsx +++ b/src/components/Form/field-editor.jsx @@ -5,9 +5,10 @@ import {StyleSheet, TextInput} from 'react-native'; import {View, Text, Button, Picker} from 'native-base'; import Icon from 'react-native-vector-icons/FontAwesome5'; import IconedButton from '../view/iconed-button.jsx'; +import {POS_PICKER} from '../../constants/component-types'; const FieldEditor = props => { const [data, setData] = useState({}); - const [editing, setEditing] = useState(true); + const [editing, setEditing] = useState(false); const label = props.data.label; const [selectedValue, setSelectedValue] = useState(props.data.values[0]); const [userTyped, setUserTyped] = useState(''); @@ -17,8 +18,14 @@ const FieldEditor = props => { console.log(props.data) }, []); - const selectValue = value => { - setSelectedValue(value); + const selectValue = selected => { + setSelectedValue(selected); + if(props.type === POS_PICKER){ + data.values.forEach((value, id) => { + if(value === selected) + props.onSelect(id) + }) + } }; const typing = text => { console.log(text); @@ -74,7 +81,8 @@ const FieldEditor = props => { { /> ) : ( - {'label'} + {props.data.label} selectValue(value)}> diff --git a/src/components/Form/field-list.jsx b/src/components/Form/field-list.jsx index 5aec74b..c008199 100644 --- a/src/components/Form/field-list.jsx +++ b/src/components/Form/field-list.jsx @@ -17,18 +17,18 @@ const FieldList = props => { },[props.response]) useEffect(() => { console.log(sound, pronunciation) - console.log("EXFSDFS", examples) } ) return ( - - - + + + + ) } diff --git a/src/components/Form/picker-list.jsx b/src/components/Form/picker-list.jsx index fc97f33..e43a8a1 100644 --- a/src/components/Form/picker-list.jsx +++ b/src/components/Form/picker-list.jsx @@ -1,19 +1,38 @@ -import React,{useState, useEffect, useRef} from 'react' +import React, {useState, useEffect, useRef} from 'react'; import {View} from 'native-base'; -import {connect} from 'react-redux' +import {connect} from 'react-redux'; +import PosPicker from './pos-picker'; +import FieldEditor from './field-editor'; /* -****************** props:***************** -* startId props.data[0] / [1] /[8] ... -* labelNum // Translate 1 / Translate 2 ... -* */ + ****************** props:***************** + * startId props.data[0] / [1] /[8] ... + * labelNum // Translate 1 / Translate 2 ... + * */ const PickerList = props => { - return( - - - - ) -} + const [data, setData] = useState({translates: [], definitions: []}); + useEffect(() => { + console.log('PROPPPPS', props); + }); + const setId = id => { + console.log(id); + }; + const selectDef = id => { + console.log(props.data[id]) + setData(props.data[id]) + } + return ( + + selectDef(id)} + // getId={id => setId(id)} + /> + + + + ); +}; export default connect(state => ({ - data: state.api.parsedDictionary.compounded -}))(PickerList) + data: state.api.parsedDictionary.compounded, +}))(PickerList); diff --git a/src/components/Form/pos-picker.jsx b/src/components/Form/pos-picker.jsx new file mode 100644 index 0000000..245855d --- /dev/null +++ b/src/components/Form/pos-picker.jsx @@ -0,0 +1,38 @@ +import React, {useState, useEffect} from 'react'; +import {connect} from 'react-redux'; +import {View} from 'native-base'; +import FieldEditor from './field-editor'; +import {POS_PICKER} from '../../constants/component-types'; + +const PosPicker = props => { + const [ready, setReady] = useState(false); + const [poses, setPoses] = useState([]); + useEffect(() => { + console.log('PRT', props.parts); + if (props.parts) { + let posArray = props.parts.map((part, id) => part.pos); + console.log('ARRRRAY', posArray); + setPoses(posArray); + setReady(true); + } + }, [props]); + return ( + + {ready ? ( + props.onSelect(value)} + /> + ) : ( + + )} + + ); +}; +export default connect(state => ({ + parts: state.api.parsedDictionary.compounded, +}))(PosPicker); diff --git a/src/components/Form/text-input.jsx b/src/components/Form/text-input.jsx index f9eb798..4be4d2f 100644 --- a/src/components/Form/text-input.jsx +++ b/src/components/Form/text-input.jsx @@ -6,8 +6,6 @@ const TextInput = props => { const input = useRef(); const [text, setText] = useState(props.value); useEffect(() => { - console.log('changing'); - console.log(props.value); setText(props.value); input.current.setValue(props.value); }, [props, props.value]); diff --git a/src/components/anki-form.jsx b/src/components/anki-form.jsx index 3a72cb9..7511247 100644 --- a/src/components/anki-form.jsx +++ b/src/components/anki-form.jsx @@ -10,57 +10,57 @@ import FieldEditor from './Form/field-editor'; import FieldList from './Form/field-list'; const AnkiForm = props => { - const [target, setTarget] = useState(''); - const [fields, setFields] = useState({}); - const [submitted, setSubmitted] = useState(true); - useEffect(() => { - // props.wordInfo('Urge'); - // props.wordInfo('Maze'); - // props.wordInfo('Ramification'); - // props.wordInfo('Dare'); - // props.wordInfo('Entrepreneurship'); - // props.wordInfo('meagre'); - // props.wordInfo('meager'); - }, []); - const getWord = word => { - setTarget(word); - }; - const submit = () => { - props.wordInfo(target); - setSubmitted(true); - }; + const [target, setTarget] = useState(''); + const [fields, setFields] = useState({}); + const [submitted, setSubmitted] = useState(false); + useEffect(() => { + // props.wordInfo('Urge'); + // props.wordInfo('Maze'); + // props.wordInfo('Ramification'); + // props.wordInfo('Dare'); + // props.wordInfo('Entrepreneurship'); + // props.wordInfo('meagre'); + // props.wordInfo('meager'); + }, []); + const getWord = word => { + setTarget(word); + }; + const submit = () => { + props.wordInfo(target); + setSubmitted(true); + }; - return ( - -
- - - {submitted ? ( - // - - ) : ( - - )} - -
- ); + return ( + +
+ + + {submitted ? ( + // + + ) : ( + + )} + +
+ ); }; export default connect( - state => ({ - ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists, - modelName: state.anki.ankiLanModelName, - modelList: state.anki.modelList, - creator: state.anki.noteCreator, - data: state - }), - { - checkAnkiLanModelForExisting, - wordInfo, - }, + state => ({ + ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists, + modelName: state.anki.ankiLanModelName, + modelList: state.anki.modelList, + creator: state.anki.noteCreator, + data: state, + }), + { + checkAnkiLanModelForExisting, + wordInfo, + }, )(AnkiForm); diff --git a/src/constants/component-types.js b/src/constants/component-types.js new file mode 100644 index 0000000..2c97c3f --- /dev/null +++ b/src/constants/component-types.js @@ -0,0 +1 @@ +export const POS_PICKER = 'POS_PICKER'