Dev #4

Merged
Horhik merged 18 commits from dev into master 2020-04-11 16:52:54 +00:00
27 changed files with 351 additions and 74 deletions
Showing only changes of commit 4766e3d7fb - Show all commits

View file

@ -179,6 +179,7 @@ android {
}
dependencies {
implementation project(':react-native-vector-icons')
implementation project(':@react-native-community_async-storage')
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "com.facebook.react:react-native:+" // From node_modules

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View file

@ -4,6 +4,7 @@ import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import com.oblador.vectoricons.VectorIconsPackage;
import com.reactnativecommunity.asyncstorage.AsyncStoragePackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;

View file

@ -1,4 +1,6 @@
rootProject.name = 'ankilan'
include ':react-native-vector-icons'
project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')
include ':@react-native-community_async-storage'
project(':@react-native-community_async-storage').projectDir = new File(rootProject.projectDir, '../node_modules/@react-native-community/async-storage/android')
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)

View file

@ -36,6 +36,8 @@ target 'ankilan' do
pod 'RNCAsyncStorage', :path => '../node_modules/@react-native-community/async-storage'
pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'
target 'ankilanTests' do
inherit! :search_paths
# Pods for testing

View file

@ -16,6 +16,22 @@
2D02E4BD1E0B4A84006451C7 /* Images.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 13B07FB51A68108700A75B9A /* Images.xcassets */; };
2D02E4BF1E0B4AB3006451C7 /* main.m in Sources */ = {isa = PBXBuildFile; fileRef = 13B07FB71A68108700A75B9A /* main.m */; };
2DCD954D1E0B4F2C00145EB5 /* ankilanTests.m in Sources */ = {isa = PBXBuildFile; fileRef = 00E356F21AD99517003FC87E /* ankilanTests.m */; };
4D52FDE523E84B2791C3D67D /* AntDesign.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 3000D2B3834E4C66A28382F8 /* AntDesign.ttf */; };
B90493FFE9264DF5B6CC7C44 /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = ADE75B0AF3E84621B5059B43 /* Entypo.ttf */; };
31DBC812F4DE446B9D3DC7B1 /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 7AD629F9A4B44BFE9AFEA2E9 /* EvilIcons.ttf */; };
52508E432BC44BF7A5E64891 /* Feather.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 4712AA6A09254CA2B29AF3F5 /* Feather.ttf */; };
BA64553EADB24FB9AB6E0F82 /* FontAwesome.ttf in Resources */ = {isa = PBXBuildFile; fileRef = DE8FAE89F42A46C381F68DAF /* FontAwesome.ttf */; };
42092AB24C2F4A0987A993FA /* FontAwesome5_Brands.ttf in Resources */ = {isa = PBXBuildFile; fileRef = F6F0D28CAB1A451DAA9BA6AE /* FontAwesome5_Brands.ttf */; };
A2E24CE7C18C4CFF97F78377 /* FontAwesome5_Regular.ttf in Resources */ = {isa = PBXBuildFile; fileRef = BCC0EEAD424E456DA490EE4F /* FontAwesome5_Regular.ttf */; };
631DA64D244F4F8F915F2121 /* FontAwesome5_Solid.ttf in Resources */ = {isa = PBXBuildFile; fileRef = BDB3D4C6185B4CB69E360505 /* FontAwesome5_Solid.ttf */; };
369E14D730C449659A20A504 /* Fontisto.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 256E5C94D0AC40E381A107A5 /* Fontisto.ttf */; };
0F7CA4B8C6454C77B1E45705 /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D3378FED83674C7297D95B3C /* Foundation.ttf */; };
D2D1008687164C9CB74A95D7 /* Ionicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = CCF85275316C4FA29EBEBEF3 /* Ionicons.ttf */; };
659D1586ED4C433BA9DD67DB /* MaterialCommunityIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 37CF45EBB8E541AFB0AEEED1 /* MaterialCommunityIcons.ttf */; };
97EA10A37A0942C0B0FD6C44 /* MaterialIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 99E0F4267E0B4BB69A5994F3 /* MaterialIcons.ttf */; };
60D08C8669D9491891F0EAE0 /* Octicons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 006C0665080F4DB581A45597 /* Octicons.ttf */; };
157D60FEAF7C49948291342D /* SimpleLineIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 00E332BD0E6B4F69AD2BFB66 /* SimpleLineIcons.ttf */; };
31C2D4A00BF24B9989303435 /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 16C65B2FFA244990A98EED99 /* Zocial.ttf */; };
/* End PBXBuildFile section */
/* Begin PBXContainerItemProxy section */
@ -51,6 +67,22 @@
2D02E4901E0B4A5D006451C7 /* ankilan-tvOSTests.xctest */ = {isa = PBXFileReference; explicitFileType = wrapper.cfbundle; includeInIndex = 0; path = "ankilan-tvOSTests.xctest"; sourceTree = BUILT_PRODUCTS_DIR; };
ED297162215061F000B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = System/Library/Frameworks/JavaScriptCore.framework; sourceTree = SDKROOT; };
ED2971642150620600B7C4FE /* JavaScriptCore.framework */ = {isa = PBXFileReference; lastKnownFileType = wrapper.framework; name = JavaScriptCore.framework; path = Platforms/AppleTVOS.platform/Developer/SDKs/AppleTVOS12.0.sdk/System/Library/Frameworks/JavaScriptCore.framework; sourceTree = DEVELOPER_DIR; };
3000D2B3834E4C66A28382F8 /* AntDesign.ttf */ = {isa = PBXFileReference; name = "AntDesign.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/AntDesign.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
ADE75B0AF3E84621B5059B43 /* Entypo.ttf */ = {isa = PBXFileReference; name = "Entypo.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Entypo.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
7AD629F9A4B44BFE9AFEA2E9 /* EvilIcons.ttf */ = {isa = PBXFileReference; name = "EvilIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/EvilIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
4712AA6A09254CA2B29AF3F5 /* Feather.ttf */ = {isa = PBXFileReference; name = "Feather.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Feather.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
DE8FAE89F42A46C381F68DAF /* FontAwesome.ttf */ = {isa = PBXFileReference; name = "FontAwesome.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
F6F0D28CAB1A451DAA9BA6AE /* FontAwesome5_Brands.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Brands.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Brands.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
BCC0EEAD424E456DA490EE4F /* FontAwesome5_Regular.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Regular.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Regular.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
BDB3D4C6185B4CB69E360505 /* FontAwesome5_Solid.ttf */ = {isa = PBXFileReference; name = "FontAwesome5_Solid.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/FontAwesome5_Solid.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
256E5C94D0AC40E381A107A5 /* Fontisto.ttf */ = {isa = PBXFileReference; name = "Fontisto.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Fontisto.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
D3378FED83674C7297D95B3C /* Foundation.ttf */ = {isa = PBXFileReference; name = "Foundation.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Foundation.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
CCF85275316C4FA29EBEBEF3 /* Ionicons.ttf */ = {isa = PBXFileReference; name = "Ionicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Ionicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
37CF45EBB8E541AFB0AEEED1 /* MaterialCommunityIcons.ttf */ = {isa = PBXFileReference; name = "MaterialCommunityIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialCommunityIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
99E0F4267E0B4BB69A5994F3 /* MaterialIcons.ttf */ = {isa = PBXFileReference; name = "MaterialIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/MaterialIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
006C0665080F4DB581A45597 /* Octicons.ttf */ = {isa = PBXFileReference; name = "Octicons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Octicons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
00E332BD0E6B4F69AD2BFB66 /* SimpleLineIcons.ttf */ = {isa = PBXFileReference; name = "SimpleLineIcons.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/SimpleLineIcons.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
16C65B2FFA244990A98EED99 /* Zocial.ttf */ = {isa = PBXFileReference; name = "Zocial.ttf"; path = "../node_modules/react-native-vector-icons/Fonts/Zocial.ttf"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = unknown; explicitFileType = undefined; includeInIndex = 0; };
/* End PBXFileReference section */
/* Begin PBXFrameworksBuildPhase section */
@ -140,6 +172,7 @@
00E356EF1AD99517003FC87E /* ankilanTests */,
83CBBA001A601CBA00E9B192 /* Products */,
2D16E6871FA4F8E400B85C8A /* Frameworks */,
F26EA599C9CA4864823C1698 /* Resources */,
);
indentWidth = 2;
sourceTree = "<group>";
@ -157,6 +190,30 @@
name = Products;
sourceTree = "<group>";
};
F26EA599C9CA4864823C1698 /* Resources */ = {
isa = "PBXGroup";
children = (
3000D2B3834E4C66A28382F8 /* AntDesign.ttf */,
ADE75B0AF3E84621B5059B43 /* Entypo.ttf */,
7AD629F9A4B44BFE9AFEA2E9 /* EvilIcons.ttf */,
4712AA6A09254CA2B29AF3F5 /* Feather.ttf */,
DE8FAE89F42A46C381F68DAF /* FontAwesome.ttf */,
F6F0D28CAB1A451DAA9BA6AE /* FontAwesome5_Brands.ttf */,
BCC0EEAD424E456DA490EE4F /* FontAwesome5_Regular.ttf */,
BDB3D4C6185B4CB69E360505 /* FontAwesome5_Solid.ttf */,
256E5C94D0AC40E381A107A5 /* Fontisto.ttf */,
D3378FED83674C7297D95B3C /* Foundation.ttf */,
CCF85275316C4FA29EBEBEF3 /* Ionicons.ttf */,
37CF45EBB8E541AFB0AEEED1 /* MaterialCommunityIcons.ttf */,
99E0F4267E0B4BB69A5994F3 /* MaterialIcons.ttf */,
006C0665080F4DB581A45597 /* Octicons.ttf */,
00E332BD0E6B4F69AD2BFB66 /* SimpleLineIcons.ttf */,
16C65B2FFA244990A98EED99 /* Zocial.ttf */,
);
name = Resources;
sourceTree = "<group>";
path = "";
};
/* End PBXGroup section */
/* Begin PBXNativeTarget section */
@ -240,7 +297,7 @@
83CBB9F71A601CBA00E9B192 /* Project object */ = {
isa = PBXProject;
attributes = {
LastUpgradeCheck = 0940;
LastUpgradeCheck = 940;
ORGANIZATIONNAME = Facebook;
TargetAttributes = {
00E356ED1AD99517003FC87E = {
@ -293,6 +350,22 @@
files = (
13B07FBF1A68108700A75B9A /* Images.xcassets in Resources */,
13B07FBD1A68108700A75B9A /* LaunchScreen.xib in Resources */,
4D52FDE523E84B2791C3D67D /* AntDesign.ttf in Resources */,
B90493FFE9264DF5B6CC7C44 /* Entypo.ttf in Resources */,
31DBC812F4DE446B9D3DC7B1 /* EvilIcons.ttf in Resources */,
52508E432BC44BF7A5E64891 /* Feather.ttf in Resources */,
BA64553EADB24FB9AB6E0F82 /* FontAwesome.ttf in Resources */,
42092AB24C2F4A0987A993FA /* FontAwesome5_Brands.ttf in Resources */,
A2E24CE7C18C4CFF97F78377 /* FontAwesome5_Regular.ttf in Resources */,
631DA64D244F4F8F915F2121 /* FontAwesome5_Solid.ttf in Resources */,
369E14D730C449659A20A504 /* Fontisto.ttf in Resources */,
0F7CA4B8C6454C77B1E45705 /* Foundation.ttf in Resources */,
D2D1008687164C9CB74A95D7 /* Ionicons.ttf in Resources */,
659D1586ED4C433BA9DD67DB /* MaterialCommunityIcons.ttf in Resources */,
97EA10A37A0942C0B0FD6C44 /* MaterialIcons.ttf in Resources */,
60D08C8669D9491891F0EAE0 /* Octicons.ttf in Resources */,
157D60FEAF7C49948291342D /* SimpleLineIcons.ttf in Resources */,
31C2D4A00BF24B9989303435 /* Zocial.ttf in Resources */,
);
runOnlyForDeploymentPostprocessing = 0;
};

View file

@ -38,7 +38,7 @@
</dict>
</dict>
<key>NSLocationWhenInUseUsageDescription</key>
<string></string>
<string/>
<key>UILaunchStoryboardName</key>
<string>LaunchScreen</string>
<key>UIRequiredDeviceCapabilities</key>
@ -53,5 +53,24 @@
</array>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
<key>UIAppFonts</key>
<array>
<string>AntDesign.ttf</string>
<string>Entypo.ttf</string>
<string>EvilIcons.ttf</string>
<string>Feather.ttf</string>
<string>FontAwesome.ttf</string>
<string>FontAwesome5_Brands.ttf</string>
<string>FontAwesome5_Regular.ttf</string>
<string>FontAwesome5_Solid.ttf</string>
<string>Fontisto.ttf</string>
<string>Foundation.ttf</string>
<string>Ionicons.ttf</string>
<string>MaterialCommunityIcons.ttf</string>
<string>MaterialIcons.ttf</string>
<string>Octicons.ttf</string>
<string>SimpleLineIcons.ttf</string>
<string>Zocial.ttf</string>
</array>
</dict>
</plist>

View file

@ -20,6 +20,7 @@
"react-native": "^0.61.5",
"react-native-ankidroid": "^0.4.0",
"react-native-material-textfield": "^0.16.1",
"react-native-vector-icons": "^6.6.0",
"react-redux": "^7.2.0",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8",

View file

@ -7,41 +7,49 @@ import DeckPicker from './view/deck-picker';
import AddWordForm from './anki-form';
import AnkiTemplate from './view/add-main-template';
import {Grid, Row} from 'native-base';
import {checkAnkiLanModelForExisting, getDeckList, getModelList} from '../actions/anki-get-actions';
import {
checkAnkiLanModelForExisting,
getDeckList,
getModelList,
} from '../actions/anki-get-actions';
const StartScreen = props => {
useEffect(() => {
props.getDeckList();
props.getModelList();
}, [])
useEffect(() => {
props.checkAnkiLanModelForExisting(props.modelName, props.modelList);
});
return (
<ScrollView>
{props.ankiAvailable ? (
props.ankiLanModelExists ? (
<AddWordForm />
) : (
<AnkiTemplate />
)
) : (
<Permissions />
)}
</ScrollView>
);
useEffect(() => {
props.getDeckList();
props.getModelList();
}, []);
useEffect(() => {
props.checkAnkiLanModelForExisting(
props.modelName,
props.modelList,
);
});
return (
<ScrollView keyboardShouldPersistTaps="handled">
{props.ankiAvailable ? (
props.ankiLanModelExists ? (
<AddWordForm />
) : (
<AnkiTemplate />
)
) : (
<Permissions />
)}
</ScrollView>
);
};
export default connect(
state => ({
ankiAvailable: state.anki.appHasAccess,
ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists,
modelName: state.anki.ankiLanModelName,
modelList: state.anki.modelList,
creator: state.anki.noteCreator,
}),
{
checkAnkiLanModelForExisting,
getDeckList,
getModelList
})(StartScreen);
state => ({
ankiAvailable: state.anki.appHasAccess,
ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists,
modelName: state.anki.ankiLanModelName,
modelList: state.anki.modelList,
creator: state.anki.noteCreator,
}),
{
checkAnkiLanModelForExisting,
getDeckList,
getModelList,
},
)(StartScreen);

View file

@ -5,49 +5,61 @@ 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 {wordInfo} from "../actions/api/dictionary";
import {wordInfo} from '../actions/api/dictionary';
import FieldEditor from './view/field-editor';
const AnkiForm = props => {
const [target, setTarget] = useState('')
const [fields, setFields] = useState({})
useEffect(() => {
// props.wordInfo('Urge');
// props.wordInfo('Maze');
// props.wordInfo('Ramification');
// props.wordInfo('Dare');
// props.wordInfo('Entrepreneurship');
// props.wordInfo('meagre');
// props.wordInfo('meager');
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);
console.log(props.data)
};
}, []);
const getWord = (word) => {
setTarget(word)
};
const submit = () => {
props.wordInfo(target);
};
return (
<Container style={{padding: 20}}>
<Form >
<DeckPicker />
<InputWord word={getWord} onSubmit={submit}/>
<SubmitButton onSubmit={submit} />
</Form>
</Container>
);
return (
<Container style={{padding: 20}}>
<Form>
<DeckPicker />
<InputWord word={getWord} onSubmit={submit} />
{submitted ? (
<FieldEditor
data={{
type: 'part of speech',
values: ['1', '2', '3','5',],
}}
/>
) : (
<SubmitButton onSubmit={submit} />
)}
</Form>
</Container>
);
};
export default connect(
state => ({
ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists,
modelName: state.anki.ankiLanModelName,
modelList: state.anki.modelList,
creator: state.anki.noteCreator,
}),
{
checkAnkiLanModelForExisting,
wordInfo
},
state => ({
ankiLanModelExists: state.anki.ankiLanModelIsAlreadyExists,
modelName: state.anki.ankiLanModelName,
modelList: state.anki.modelList,
creator: state.anki.noteCreator,
data: state
}),
{
checkAnkiLanModelForExisting,
wordInfo,
},
)(AnkiForm);

View file

@ -0,0 +1,132 @@
import React, {useState, useEffect, useRef} from 'react';
import {connect} from 'react-redux';
import TextField from 'react-native-material-textfield/src/components/field';
import {StyleSheet} 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';
const FieldEditor = props => {
const [data, setData] = useState({});
const [editing, setEditing] = useState(true);
const label = props.data.label;
const [selectedValue, setSelectedValue] = useState(
props.data.values[0],
);
const [userTyped, setUserTyped] = useState('');
const input = useRef();
useEffect(() => {
setData(props.data);
}, []);
const selectValue = value => {
setSelectedValue(value);
};
const typing = text => {
setUserTyped(text)
};
const confirmTyped = () => {
const values = data.values
setData({...data, values: [...values, userTyped]})
}
const styles = StyleSheet.create({
wrapper: {},
inner: {
display: 'flex',
justifyContent: 'space-between',
flexDirection: 'row',
alignItems: 'center',
alignContent: 'center',
},
row: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
width: 90,
},
button: {
width: 40,
height: 40,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
},
tfWrapper: {
width: editing ? '75%' : '84%',
},
});
return (
<View style={styles.wrapper}>
<Text>{label}</Text>
<View style={styles.inner}>
<View style={styles.tfWrapper}>
{editing ? (
<TextField
multiline={true}
label={data.type}
value={selectedValue}
ref={input}
onChangeText={text =>
typing(text)
}
/>
) : (
<Picker
selectedValue={
selectedValue
}
onValueChange={value =>
selectValue(
value,
)
}>
{data.values.map(
(value, id) => {
return (
<Picker.Item
value={
value
}
label={
value
}
key={
id
}
/>
);
},
)}
</Picker>
)}
</View>
{editing ? (
<View style={styles.row}>
<IconedButton
icon="caret-down"
onPress={() => {
setEditing(
!editing,
);
}}
/>
<IconedButton
icon="check"
onPress={confirmTyped}
/>
</View>
) : (
<IconedButton
icon="pen"
onPress={() => {
setEditing(!editing);
}}
/>
)}
</View>
</View>
);
};
export default connect()(FieldEditor);

View file

@ -0,0 +1,26 @@
import React, {useState} from 'react';
import TextField from 'react-native-material-textfield/src/components/field';
import {StyleSheet} from 'react-native';
import {View, Text, Button, Picker} from 'native-base';
import Icon from 'react-native-vector-icons/FontAwesome5';
const IconedButton = props => {
return (
<Button bordered style={styles.button} onPress={props.onPress}>
<Icon name={props.icon} size={20} color={'blue'} />
</Button>
);
};
const styles = StyleSheet.create({
button: {
width: 40,
height: 40,
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
},
});
export default IconedButton;