diff --git a/android/app/build.gradle b/android/app/build.gradle index e1796ef..2737100 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -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 diff --git a/android/app/src/main/assets/fonts/AntDesign.ttf b/android/app/src/main/assets/fonts/AntDesign.ttf new file mode 100644 index 0000000..2abf035 Binary files /dev/null and b/android/app/src/main/assets/fonts/AntDesign.ttf differ diff --git a/android/app/src/main/assets/fonts/Entypo.ttf b/android/app/src/main/assets/fonts/Entypo.ttf new file mode 100644 index 0000000..1c8f5e9 Binary files /dev/null and b/android/app/src/main/assets/fonts/Entypo.ttf differ diff --git a/android/app/src/main/assets/fonts/EvilIcons.ttf b/android/app/src/main/assets/fonts/EvilIcons.ttf new file mode 100644 index 0000000..6868f7b Binary files /dev/null and b/android/app/src/main/assets/fonts/EvilIcons.ttf differ diff --git a/android/app/src/main/assets/fonts/Feather.ttf b/android/app/src/main/assets/fonts/Feather.ttf new file mode 100644 index 0000000..852c713 Binary files /dev/null and b/android/app/src/main/assets/fonts/Feather.ttf differ diff --git a/android/app/src/main/assets/fonts/FontAwesome.ttf b/android/app/src/main/assets/fonts/FontAwesome.ttf new file mode 100644 index 0000000..35acda2 Binary files /dev/null and b/android/app/src/main/assets/fonts/FontAwesome.ttf differ diff --git a/android/app/src/main/assets/fonts/FontAwesome5_Brands.ttf b/android/app/src/main/assets/fonts/FontAwesome5_Brands.ttf new file mode 100644 index 0000000..5f72e91 Binary files /dev/null and b/android/app/src/main/assets/fonts/FontAwesome5_Brands.ttf differ diff --git a/android/app/src/main/assets/fonts/FontAwesome5_Regular.ttf b/android/app/src/main/assets/fonts/FontAwesome5_Regular.ttf new file mode 100644 index 0000000..a309313 Binary files /dev/null and b/android/app/src/main/assets/fonts/FontAwesome5_Regular.ttf differ diff --git a/android/app/src/main/assets/fonts/FontAwesome5_Solid.ttf b/android/app/src/main/assets/fonts/FontAwesome5_Solid.ttf new file mode 100644 index 0000000..7ece328 Binary files /dev/null and b/android/app/src/main/assets/fonts/FontAwesome5_Solid.ttf differ diff --git a/android/app/src/main/assets/fonts/Fontisto.ttf b/android/app/src/main/assets/fonts/Fontisto.ttf new file mode 100755 index 0000000..96e2e81 Binary files /dev/null and b/android/app/src/main/assets/fonts/Fontisto.ttf differ diff --git a/android/app/src/main/assets/fonts/Foundation.ttf b/android/app/src/main/assets/fonts/Foundation.ttf new file mode 100644 index 0000000..6cce217 Binary files /dev/null and b/android/app/src/main/assets/fonts/Foundation.ttf differ diff --git a/android/app/src/main/assets/fonts/Ionicons.ttf b/android/app/src/main/assets/fonts/Ionicons.ttf new file mode 100644 index 0000000..67bd842 Binary files /dev/null and b/android/app/src/main/assets/fonts/Ionicons.ttf differ diff --git a/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf b/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf new file mode 100644 index 0000000..9cc8db1 Binary files /dev/null and b/android/app/src/main/assets/fonts/MaterialCommunityIcons.ttf differ diff --git a/android/app/src/main/assets/fonts/MaterialIcons.ttf b/android/app/src/main/assets/fonts/MaterialIcons.ttf new file mode 100644 index 0000000..7015564 Binary files /dev/null and b/android/app/src/main/assets/fonts/MaterialIcons.ttf differ diff --git a/android/app/src/main/assets/fonts/Octicons.ttf b/android/app/src/main/assets/fonts/Octicons.ttf new file mode 100644 index 0000000..ceac75d Binary files /dev/null and b/android/app/src/main/assets/fonts/Octicons.ttf differ diff --git a/android/app/src/main/assets/fonts/SimpleLineIcons.ttf b/android/app/src/main/assets/fonts/SimpleLineIcons.ttf new file mode 100644 index 0000000..6ecb686 Binary files /dev/null and b/android/app/src/main/assets/fonts/SimpleLineIcons.ttf differ diff --git a/android/app/src/main/assets/fonts/Zocial.ttf b/android/app/src/main/assets/fonts/Zocial.ttf new file mode 100644 index 0000000..e4ae46c Binary files /dev/null and b/android/app/src/main/assets/fonts/Zocial.ttf differ diff --git a/android/app/src/main/java/com/ankilan/MainApplication.java b/android/app/src/main/java/com/ankilan/MainApplication.java index dcbf61c..a854614 100644 --- a/android/app/src/main/java/com/ankilan/MainApplication.java +++ b/android/app/src/main/java/com/ankilan/MainApplication.java @@ -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; diff --git a/android/settings.gradle b/android/settings.gradle index 8078645..bed8814 100644 --- a/android/settings.gradle +++ b/android/settings.gradle @@ -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) diff --git a/ios/Podfile b/ios/Podfile index 0cc14b5..55ddee4 100644 --- a/ios/Podfile +++ b/ios/Podfile @@ -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 diff --git a/ios/ankilan.xcodeproj/project.pbxproj b/ios/ankilan.xcodeproj/project.pbxproj index d7b9c1f..9c880e7 100644 --- a/ios/ankilan.xcodeproj/project.pbxproj +++ b/ios/ankilan.xcodeproj/project.pbxproj @@ -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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; 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 = ""; @@ -157,6 +190,30 @@ name = Products; sourceTree = ""; }; + 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 = ""; + 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; }; diff --git a/ios/ankilan/Info.plist b/ios/ankilan/Info.plist index 5107c21..7ae1458 100644 --- a/ios/ankilan/Info.plist +++ b/ios/ankilan/Info.plist @@ -38,7 +38,7 @@ NSLocationWhenInUseUsageDescription - + UILaunchStoryboardName LaunchScreen UIRequiredDeviceCapabilities @@ -53,5 +53,24 @@ UIViewControllerBasedStatusBarAppearance + UIAppFonts + + AntDesign.ttf + Entypo.ttf + EvilIcons.ttf + Feather.ttf + FontAwesome.ttf + FontAwesome5_Brands.ttf + FontAwesome5_Regular.ttf + FontAwesome5_Solid.ttf + Fontisto.ttf + Foundation.ttf + Ionicons.ttf + MaterialCommunityIcons.ttf + MaterialIcons.ttf + Octicons.ttf + SimpleLineIcons.ttf + Zocial.ttf + diff --git a/package.json b/package.json index ca8c2e0..82e2790 100644 --- a/package.json +++ b/package.json @@ -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", diff --git a/src/components/add-anklan-model.jsx b/src/components/add-anklan-model.jsx index a563fec..dcd18f3 100644 --- a/src/components/add-anklan-model.jsx +++ b/src/components/add-anklan-model.jsx @@ -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 ( - - {props.ankiAvailable ? ( - props.ankiLanModelExists ? ( - - ) : ( - - ) - ) : ( - - )} - - ); + useEffect(() => { + props.getDeckList(); + props.getModelList(); + }, []); + useEffect(() => { + props.checkAnkiLanModelForExisting( + props.modelName, + props.modelList, + ); + }); + return ( + + {props.ankiAvailable ? ( + props.ankiLanModelExists ? ( + + ) : ( + + ) + ) : ( + + )} + + ); }; 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); diff --git a/src/components/anki-form.jsx b/src/components/anki-form.jsx index a36e977..8e4a75e 100644 --- a/src/components/anki-form.jsx +++ b/src/components/anki-form.jsx @@ -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 ( - -
- - - - -
- ); + return ( + +
+ + + {submitted ? ( + + ) : ( + + )} + +
+ ); }; 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); diff --git a/src/components/view/field-editor.jsx b/src/components/view/field-editor.jsx new file mode 100644 index 0000000..5117f9a --- /dev/null +++ b/src/components/view/field-editor.jsx @@ -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 ( + + {label} + + + {editing ? ( + + typing(text) + } + /> + ) : ( + + selectValue( + value, + ) + }> + {data.values.map( + (value, id) => { + return ( + + ); + }, + )} + + )} + + {editing ? ( + + { + setEditing( + !editing, + ); + }} + /> + + + ) : ( + { + setEditing(!editing); + }} + /> + )} + + + ); +}; +export default connect()(FieldEditor); diff --git a/src/components/view/iconed-button.jsx b/src/components/view/iconed-button.jsx new file mode 100644 index 0000000..7fff2c2 --- /dev/null +++ b/src/components/view/iconed-button.jsx @@ -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 ( + + ); +}; + +const styles = StyleSheet.create({ + button: { + width: 40, + height: 40, + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + }, +}); + +export default IconedButton;