add sound, transcription and examples picker

package.json

@@ -10,9 +10,6 @@
         "lint": "eslint ."
     },
     "dependencies": {
-        "@fortawesome/fontawesome-svg-core": "^1.2.28",
-        "@fortawesome/free-solid-svg-icons": "^5.13.0",
-        "@fortawesome/react-native-fontawesome": "^0.2.3",
         "@react-native-community/async-storage": "^1.8.1",
         "axios": "^0.19.2",
         "babel-preset-react-native": "^4.0.1",
@@ -20,10 +17,9 @@
         "native-base": "^2.13.8",
         "node-fetch": "^2.6.0",
         "react": "16.13.0",
-        "react-native": "^0.62.0",
+        "react-native": "^0.61.5",
         "react-native-ankidroid": "^0.4.0",
         "react-native-material-textfield": "^0.16.1",
-        "react-native-svg": "^12.0.3",
         "react-native-vector-icons": "^6.6.0",
         "react-redux": "^7.2.0",
         "redux": "^4.0.5",

src/actions/anki-get-actions.js

@@ -140,5 +140,5 @@ const setSavedData = data => ({
 
 export const getSavedData = () => async dispatch => {
   const data = await getAnkiData();
-  setSavedData(data);
+  await dispatch(setSavedData(data));
 };

src/actions/dictionary/create-dictionary.js

@@ -9,5 +9,5 @@ export const createDictionary = async apiRes => {
 
   const compounded = await compoundWithYDictionary(parsedDictionary, word);
   //TODO add shrinkToOneExample(compounded)
-  return {...compounded, sound: audio};
+  return {...compounded, sound: audio, examples: parsedDictionary.examples};
 };

src/actions/dictionary/get-translate.js

@@ -1,4 +1,5 @@
 import yDictionary from '../api/yandex-dictionary';
+import {parseDictionary} from './parsing-dictionary';
 
 const selectByPos = wordArray => {
   let posSet = new Set();
@@ -50,7 +51,6 @@ export const compoundWithYDictionary = async (definitionList, word) => {
       word,
       pronunciation: `/${definitionList.pronunciation}/`,
       compounded,
-      examples: words.examples,
     };
   } catch (e) {
     console.log('error is HERE', e);

src/components/Form/field-editor.jsx

@@ -4,7 +4,7 @@ import TextField from 'react-native-material-textfield/src/components/field';
 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 './iconed-button.jsx';
+import IconedButton from '../view/iconed-button.jsx';
 const FieldEditor = props => {
   const [data, setData] = useState({});
   const [editing, setEditing] = useState(true);
@@ -14,6 +14,7 @@ const FieldEditor = props => {
   const input = useRef();
   useEffect(() => {
     setData(props.data);
+    console.log(props.data)
   }, []);
 
   const selectValue = value => {
@@ -85,7 +86,7 @@ const FieldEditor = props => {
               <Picker
                 selectedValue={selectedValue}
                 onValueChange={value => selectValue(value)}>
-                {data.values.map((value, id) => {
+                {props.data.values.map((value, id) => {
                   return <Picker.Item value={value} label={value} key={id} />;
                 })}
               </Picker>

src/components/Form/field-list.jsx

@@ -0,0 +1,38 @@
+import React, {useState, useEffect} from 'react'
+import {connect} from 'react-redux';
+import {View, Input} from 'native-base'
+import {TextField} from 'react-native-material-textfield';
+import FieldEditor from './field-editor';
+import TextInput from './text-input';
+import PickerList from './picker-list';
+
+const FieldList = props => {
+    const [pronunciation, setPronunciation] = useState()
+    const [sound, setSound] = useState()
+    const [examples, setExamples] = useState([])
+    useEffect(() => {
+        setSound(props.response.sound)
+        setPronunciation(props.response.pronunciation)
+        setExamples(props.response.examples)
+    },[props.response])
+    useEffect(() => {
+            console.log(sound, pronunciation)
+        console.log("EXFSDFS", examples)
+        }
+    )
+    return (
+        <View>
+            <PickerList/>
+            <TextInput value={sound}  label={'Sound'}/>
+            <TextInput value={pronunciation}  label={'Transcription'}/>
+            <FieldEditor data={{
+                label: 'Usage example',
+                values: examples || ['can not find the example']
+            }}/>
+        </View>
+    )
+}
+
+export default connect(state => ({
+    response: state.api.parsedDictionary
+}))(FieldList)

src/components/Form/picker-list.jsx

@@ -0,0 +1,19 @@
+import React,{useState, useEffect, useRef} from 'react'
+import {View} from 'native-base';
+import {connect} from 'react-redux'
+
+/*
+****************** props:*****************
+* startId props.data[0] / [1] /[8] ...
+* labelNum // Translate 1 / Translate 2 ...
+* */
+const PickerList = props => {
+    return(
+        <View>
+
+        </View>
+    )
+}
+export default connect(state => ({
+    data: state.api.parsedDictionary.compounded
+}))(PickerList)

src/components/Form/text-input.jsx

@@ -0,0 +1,34 @@
+import React, {useState, useEffect, useRef} from 'react';
+import {connect} from 'react-redux';
+import {TextField} from 'react-native-material-textfield';
+import {View} from 'native-base';
+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]);
+  return (
+    <View>
+      <TextField
+        value={props.value}
+        label={props.label}
+        editable={true}
+        onChangeText={text => setText(text)}
+        ref={input}
+        lineType={'none'}
+      />
+      <View
+        style={{
+          width: '100%',
+          height: 1,
+          backgroundColor: '#00000050',
+        }}
+      />
+    </View>
+  );
+};
+export default connect()(TextInput);

src/components/anki-form.jsx

@@ -4,9 +4,10 @@ import DeckPicker from './view/deck-picker';
 import {Form, Container, Item} from 'native-base';
 import {checkAnkiLanModelForExisting} from '../actions/anki-get-actions';
 import InputWord from './view/translatable-word';
-import SubmitButton from './view/submit-button';
+import SubmitButton from './Form/submit-button';
 import {wordInfo} from '../actions/api/dictionary';
-import FieldEditor from './view/field-editor';
+import FieldEditor from './Form/field-editor';
+import FieldList from './Form/field-list';
 
 const AnkiForm = props => {
 	const [target, setTarget] = useState('');
@@ -35,12 +36,13 @@ const AnkiForm = props => {
 				<DeckPicker />
 				<InputWord word={getWord} onSubmit={submit} />
 				{submitted ? (
-					<FieldEditor
-						data={{
-							type: 'part of speech',
-							values: ['1', '2', '3','5',],
-						}}
-					/>
+					// <FieldEditor
+					// 	data={{
+					// 		type: 'part of speech',
+					// 		values: ['1', '2', '3','5',],
+					// 	}}
+					// />
+                    <FieldList/>
 				) : (
 					<SubmitButton onSubmit={submit} />
 				)}