From 56bcc1560bf8be4f5ac9127f0eaac5b9f5b7bf32 Mon Sep 17 00:00:00 2001 From: ue Date: Sat, 29 Sep 2018 23:34:04 +0300 Subject: [PATCH] changed example for developers folders && created dropdown component --- package-lock.json | 8 +++ package.json | 1 + src/_EXAMPLES FOR DEVELOPER/actions/.gitkeep | 0 .../statefull/container/exampleContainer.js | 43 ++++++++++++++ .../components/statefull/index.js | 5 ++ .../statefull/view/exampleStyles.js | 7 +++ .../components/statefull/view/exampleView.js} | 7 +-- .../components/stateless/exampleStyles.js | 7 +++ .../components/stateless/exampleView.js | 12 ++++ src/_EXAMPLES FOR DEVELOPER/constant/.gitkeep | 0 src/_EXAMPLES FOR DEVELOPER/reducer/.gitkeep | 0 src/_EXAMPLES FOR DEVELOPER/screen/.gitkeep | 0 .../example/container/exampleContainer.js | 49 ---------------- .../componentsScreens/example/index.js | 5 -- .../example/screen/exampleStyles.js | 3 - .../componentsScreens/index.js | 3 - src/components/dropdownButton/index.js | 4 ++ .../view/dropdownButtonStyles.js | 49 ++++++++++++++++ .../dropdownButton/view/dropdownButtonView.js | 57 +++++++++++++++++++ .../notification/view/notificationStyles.js | 13 ----- .../notification/view/notificationView.js | 38 +++++++------ yarn.lock | 57 +++++++++++++++++-- 22 files changed, 271 insertions(+), 97 deletions(-) create mode 100644 src/_EXAMPLES FOR DEVELOPER/actions/.gitkeep create mode 100644 src/_EXAMPLES FOR DEVELOPER/components/statefull/container/exampleContainer.js create mode 100644 src/_EXAMPLES FOR DEVELOPER/components/statefull/index.js create mode 100644 src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleStyles.js rename src/{_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleScreen.js => _EXAMPLES FOR DEVELOPER/components/statefull/view/exampleView.js} (72%) create mode 100644 src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleStyles.js create mode 100644 src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleView.js create mode 100644 src/_EXAMPLES FOR DEVELOPER/constant/.gitkeep create mode 100644 src/_EXAMPLES FOR DEVELOPER/reducer/.gitkeep create mode 100644 src/_EXAMPLES FOR DEVELOPER/screen/.gitkeep delete mode 100644 src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/container/exampleContainer.js delete mode 100644 src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/index.js delete mode 100644 src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleStyles.js delete mode 100644 src/_EXAMPLES FOR DEVELOPERS/componentsScreens/index.js create mode 100644 src/components/dropdownButton/index.js create mode 100644 src/components/dropdownButton/view/dropdownButtonStyles.js create mode 100644 src/components/dropdownButton/view/dropdownButtonView.js diff --git a/package-lock.json b/package-lock.json index 1389be4ba..cb85b33f0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8923,6 +8923,14 @@ "react-native-animatable": "^1.2.4" } }, + "react-native-modal-dropdown": { + "version": "0.6.2", + "resolved": "https://registry.npmjs.org/react-native-modal-dropdown/-/react-native-modal-dropdown-0.6.2.tgz", + "integrity": "sha512-1jzByA+ME+q0mZJ2rZrLsf6jVwJhNxNHdg7I50xYZ9oYJsmmKwF9r/ks95tZxxks4Zvd7/FnaveNtyd+uevXAw==", + "requires": { + "prop-types": "^15.6.0" + } + }, "react-native-modal-popover": { "version": "0.0.10", "resolved": "https://registry.npmjs.org/react-native-modal-popover/-/react-native-modal-popover-0.0.10.tgz", diff --git a/package.json b/package.json index 30adbf80d..546ddb159 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "react-native-keyboard-aware-scroll-view": "^0.7.2", "react-native-markdown-editor": "^1.0.1", "react-native-modal": "^6.5.0", + "react-native-modal-dropdown": "^0.6.2", "react-native-modal-popover": "0.0.10", "react-native-navigation": "^2.0.2519", "react-native-restart": "0.0.6", diff --git a/src/_EXAMPLES FOR DEVELOPER/actions/.gitkeep b/src/_EXAMPLES FOR DEVELOPER/actions/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/src/_EXAMPLES FOR DEVELOPER/components/statefull/container/exampleContainer.js b/src/_EXAMPLES FOR DEVELOPER/components/statefull/container/exampleContainer.js new file mode 100644 index 000000000..de63d9b50 --- /dev/null +++ b/src/_EXAMPLES FOR DEVELOPER/components/statefull/container/exampleContainer.js @@ -0,0 +1,43 @@ +import React, { Component } from "react"; +import { connect } from "react-redux"; + +// Services and Actions + +// Middleware + +// Constants + +// Utilities + +// Component +import { ExampleView } from "../"; + +/* +* Props Name Description Value +*@props --> props name here description here Value Type Here +* +*/ + +class ExampleContainer extends Component { + constructor(props) { + super(props); + this.state = {}; + } + + // Component Life Cycle Functions + + // Component Functions + + render() { + // eslint-disable-next-line + const {} = this.props; + + return ; + } +} + +const mapStateToProps = state => ({ + user: state.user.user, +}); + +export default connect(mapStateToProps)(ExampleContainer); diff --git a/src/_EXAMPLES FOR DEVELOPER/components/statefull/index.js b/src/_EXAMPLES FOR DEVELOPER/components/statefull/index.js new file mode 100644 index 000000000..d1e9460be --- /dev/null +++ b/src/_EXAMPLES FOR DEVELOPER/components/statefull/index.js @@ -0,0 +1,5 @@ +import ExampleView from "./view/exampleView"; +import ExampleContainer from "./container/exampleContainer"; + +export { ExampleView, ExampleContainer }; +export default ExampleContainer; diff --git a/src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleStyles.js b/src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleStyles.js new file mode 100644 index 000000000..15460415e --- /dev/null +++ b/src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleStyles.js @@ -0,0 +1,7 @@ +import EStyleSheet from "react-native-extended-stylesheet"; + +export default EStyleSheet.create({ + styleName: { + // TODO: If we need default style. We can put there. + }, +}); diff --git a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleScreen.js b/src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleView.js similarity index 72% rename from src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleScreen.js rename to src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleView.js index fc96cd237..ac33f46a1 100644 --- a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleScreen.js +++ b/src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleView.js @@ -11,11 +11,10 @@ import styles from "./_styles"; class ExampleView extends Component { /* Props - * ------------------------------------------------ TODO: Fill fallowlines - * @prop { type } name - Description. - * @prop { type } name - Description. - * + * ------------------------------------------------ + * @prop { type } name - Description.... */ + constructor(props) { super(props); this.state = {}; diff --git a/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleStyles.js b/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleStyles.js new file mode 100644 index 000000000..15460415e --- /dev/null +++ b/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleStyles.js @@ -0,0 +1,7 @@ +import EStyleSheet from "react-native-extended-stylesheet"; + +export default EStyleSheet.create({ + styleName: { + // TODO: If we need default style. We can put there. + }, +}); diff --git a/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleView.js b/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleView.js new file mode 100644 index 000000000..0d72efe50 --- /dev/null +++ b/src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleView.js @@ -0,0 +1,12 @@ +import React from "react"; +import { View } from "react-native"; +import styles from "./exampleStyles"; + +/* Props +* ------------------------------------------------ +* @prop { type } name - Description.... +*/ + +const ExampleView = ({ x, y, z }) => ; + +export default ExampleView; diff --git a/src/_EXAMPLES FOR DEVELOPER/constant/.gitkeep b/src/_EXAMPLES FOR DEVELOPER/constant/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/src/_EXAMPLES FOR DEVELOPER/reducer/.gitkeep b/src/_EXAMPLES FOR DEVELOPER/reducer/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/src/_EXAMPLES FOR DEVELOPER/screen/.gitkeep b/src/_EXAMPLES FOR DEVELOPER/screen/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/container/exampleContainer.js b/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/container/exampleContainer.js deleted file mode 100644 index 306d3a35b..000000000 --- a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/container/exampleContainer.js +++ /dev/null @@ -1,49 +0,0 @@ -import React, { Component } from "react"; -import { connect } from "react-redux"; - -// Services and Actions - -// Middleware - -// Constants - -// Utilities - -// Component -import { ExampleView } from "../.."; - -/* -* Props Name Description Value -*@props --> props name here description here Value Type Here -* -*/ - -class ExampleContainer extends Component { - constructor(props) { - super(props); - this.state = {}; - } - - // Component Life Cycle Functions - - // Component Functions - - render() { - const {} = this.props; - - return ; - } -} - -const mapStateToProps = state => ({ - user: state.user.user, -}); - -const mapDispatchToProps = (dispatch, ownProps) => ({ - // onClick: () => dispatch(setVisibilityFilter(ownProps.filter)) -}); - -export default connect( - mapStateToProps, - mapDispatchToProps -)(ExampleContainer); diff --git a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/index.js b/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/index.js deleted file mode 100644 index 35b7a581e..000000000 --- a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/index.js +++ /dev/null @@ -1,5 +0,0 @@ -import ExampleView from "./exampleView"; -import ExampleContainer from "./exampleContainer"; - -export { ExampleView, ExampleContainer }; -export default ExampleContainer; diff --git a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleStyles.js b/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleStyles.js deleted file mode 100644 index 814b1b4f6..000000000 --- a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleStyles.js +++ /dev/null @@ -1,3 +0,0 @@ -import EStyleSheet from "react-native-extended-stylesheet"; - -export default EStyleSheet.create({}); diff --git a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/index.js b/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/index.js deleted file mode 100644 index 4483c09d6..000000000 --- a/src/_EXAMPLES FOR DEVELOPERS/componentsScreens/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import Exmaple from "./example/example.container"; - -export { Exmaple }; diff --git a/src/components/dropdownButton/index.js b/src/components/dropdownButton/index.js new file mode 100644 index 000000000..9a4b49faa --- /dev/null +++ b/src/components/dropdownButton/index.js @@ -0,0 +1,4 @@ +import DropdownButton from "./view/dropdownButtonView"; + +export { DropdownButton }; +export default DropdownButton; diff --git a/src/components/dropdownButton/view/dropdownButtonStyles.js b/src/components/dropdownButton/view/dropdownButtonStyles.js new file mode 100644 index 000000000..0ea4f6835 --- /dev/null +++ b/src/components/dropdownButton/view/dropdownButtonStyles.js @@ -0,0 +1,49 @@ +import EStyleSheet from "react-native-extended-stylesheet"; + +export default EStyleSheet.create({ + container: { + flex: 1, + flexDirection: "row", + justifyContent: "center", + alignItems: "center", + alignSelf: "flex-start", + }, + dropdownWrapper: {}, + dropdownText: { + fontSize: 9, + color: "#788187", + marginLeft: 25, + }, + dropdownIcon: { + fontSize: 18, + color: "#c1c5c7", + marginLeft: 7, + marginTop: 1, + }, + dropdown: { + marginTop: 5, + marginLeft: -2, + minWidth: "$deviceWidth / 3", + borderColor: "#e7e7e7", + }, + iconWrapper: { + justifyContent: "center", + alignItems: "center", + }, + dropdownText: { + fontSize: 9, + color: "#788187", + padding: 5, + borderColor: "#e7e7e7", + }, + dropdownTextHighlight: {}, + button: { + marginLeft: 25, + }, + buttonText: { + fontSize: 9, + alignSelf: "center", + color: "#788187", + fontWeight: "normal", + }, +}); diff --git a/src/components/dropdownButton/view/dropdownButtonView.js b/src/components/dropdownButton/view/dropdownButtonView.js new file mode 100644 index 000000000..690dae5f6 --- /dev/null +++ b/src/components/dropdownButton/view/dropdownButtonView.js @@ -0,0 +1,57 @@ +import React from "react"; +import { View, Text } from "react-native"; +import { Dimensions } from "react-native"; + +// Constants +const DEVICE_HEIGHT = Dimensions.get("window").height; + +// External components +import ModalDropdown from "react-native-modal-dropdown"; +import Ionicons from "react-native-vector-icons/Ionicons"; + +// Styles +import styles from "./dropdownButtonStyles"; + +/* Props + * ------------------------------------------------ + * @prop { string } text - Description.... + * @prop { string } iconName - Description.... + * @prop { array } options - Description.... + * @prop { function } onSelect - Description.... + * + */ + +const DropdownButtonView = ({ + defaultText, + iconName, + options, + onSelect, + defaultIndex, +}) => ( + + + onSelect && onSelect(e)} + defaultIndex={defaultIndex} + defaultValue={defaultText} + /> + + + + + +); + +export default DropdownButtonView; diff --git a/src/components/notification/view/notificationStyles.js b/src/components/notification/view/notificationStyles.js index 0179d11cd..d21ab8081 100644 --- a/src/components/notification/view/notificationStyles.js +++ b/src/components/notification/view/notificationStyles.js @@ -59,17 +59,4 @@ export default EStyleSheet.create({ hasNoAvatar: { backgroundColor: "#d8d8d8", }, - lineBreakItem: { - flex: 1, - flexDirection: "row", - }, - lineBreakItemText: { - fontSize: 9, - color: "#788187", - marginLeft: 25, - }, - arrowIcon: { - color: "#c1c5c7", - fontSize: 18, - }, }); diff --git a/src/components/notification/view/notificationView.js b/src/components/notification/view/notificationView.js index c712b61b9..d7e9d9f04 100644 --- a/src/components/notification/view/notificationView.js +++ b/src/components/notification/view/notificationView.js @@ -2,23 +2,19 @@ import React, { Component } from "react"; import { View, ScrollView, Text, FlatList, Image } from "react-native"; import { LineBreak } from "../../basicUIElements"; import { ContainerHeader } from "../../containerHeader"; -import Ionicons from "react-native-vector-icons/Ionicons"; - // Constants // Components +import { DropdownButton } from "../../../components/dropdownButton"; // Styles -// eslint-disable-next-line import styles from "./notificationStyles"; -/* -* Props Name Description Value -*@props --> props name here description here Value Type Here -* -*/ - class NotificationView extends Component { + /* Props + * ------------------------------------------------ + * @prop { type } name - Description.... + */ constructor(props) { super(props); this.state = { @@ -72,6 +68,10 @@ class NotificationView extends Component { // Component Functions + _handleOnDropdownSelect = index => { + console.log("selected index is:" + index); + }; + _getRenderItem = item => { return ( - - - {/* TODO: I guess these will be dropdown there for it should be a component */} - ALL NOTIFICATION - {/* */} - - + @@ -127,6 +132,7 @@ class NotificationView extends Component { renderItem={({ item }) => this._getRenderItem(item)} keyExtractor={item => item.email} /> + {/* Will remove fallow lines */} = 0.3.2 < 0.4.0": version "0.3.4" resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.4.tgz#8cd52e8a3acfd68d3aed38ee0a640177d2f9d797" @@ -2364,9 +2375,9 @@ drbg.js@^1.0.1: create-hash "^1.1.2" create-hmac "^1.1.4" -dsteem@^0.9.0: - version "0.9.0" - resolved "https://registry.yarnpkg.com/dsteem/-/dsteem-0.9.0.tgz#43daa6107035a399e7a2e56d716ed4fd5d8cbea8" +dsteem@^0.10.0: + version "0.10.1" + resolved "https://registry.yarnpkg.com/dsteem/-/dsteem-0.10.1.tgz#1921d9f662f138c0b52f8fa77c7abc37ceab42f4" dependencies: bs58 "^4.0.1" bytebuffer "^5.0.1" @@ -4973,7 +4984,7 @@ nice-try@^1.0.4: version "1.0.5" resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366" -node-fetch@^1.0.1, node-fetch@^1.3.3, node-fetch@^1.6.3: +node-fetch@1.7.3, node-fetch@^1.0.1, node-fetch@^1.3.3, node-fetch@^1.6.3: version "1.7.3" resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef" dependencies: @@ -5133,6 +5144,10 @@ object-keys@^1.0.12: version "1.0.12" resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.0.12.tgz#09c53855377575310cca62f55bb334abff7b3ed2" +object-resolve-path@^1.1.0: + version "1.1.1" + resolved "https://registry.yarnpkg.com/object-resolve-path/-/object-resolve-path-1.1.1.tgz#a7f8f93e8a20af80e44217ba7db54316d9d12232" + object-visit@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/object-visit/-/object-visit-1.0.1.tgz#f79c4493af0c5377b59fe39d395e41042dd045bb" @@ -5592,6 +5607,13 @@ react-native-easy-grid@0.2.0: dependencies: lodash "^4.11.1" +react-native-extended-stylesheet@^0.10.0: + version "0.10.0" + resolved "https://registry.yarnpkg.com/react-native-extended-stylesheet/-/react-native-extended-stylesheet-0.10.0.tgz#bc77caf7494dcc67f681128dd8cb5e07dacef9dd" + dependencies: + css-mediaquery "^0.1.2" + object-resolve-path "^1.1.0" + react-native-fast-image@^4.0.14: version "4.0.14" resolved "https://registry.yarnpkg.com/react-native-fast-image/-/react-native-fast-image-4.0.14.tgz#1e84c9a01b1471793e294ef4e7c3cc20e09562a0" @@ -5613,6 +5635,10 @@ react-native-iphone-x-helper@^1.0.1: version "1.1.0" resolved "https://registry.yarnpkg.com/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.1.0.tgz#3a881720900bd8d1c67de2c465ea9aa9296180a7" +react-native-iphone-x-helper@^1.0.3: + version "1.2.0" + resolved "https://registry.yarnpkg.com/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.2.0.tgz#9f8a376eb00bc712115abff4420318a0063fa796" + react-native-keyboard-aware-scroll-view@0.5.0: version "0.5.0" resolved "https://registry.yarnpkg.com/react-native-keyboard-aware-scroll-view/-/react-native-keyboard-aware-scroll-view-0.5.0.tgz#57ab933089375bf62f4324797e8be949ad97849d" @@ -5620,6 +5646,13 @@ react-native-keyboard-aware-scroll-view@0.5.0: prop-types "^15.6.0" react-native-iphone-x-helper "^1.0.1" +react-native-keyboard-aware-scroll-view@^0.7.2: + version "0.7.2" + resolved "https://registry.yarnpkg.com/react-native-keyboard-aware-scroll-view/-/react-native-keyboard-aware-scroll-view-0.7.2.tgz#3c758dea21bfe1d292ad907b89b74fcbd9d13a73" + dependencies: + prop-types "^15.6.2" + react-native-iphone-x-helper "^1.0.3" + "react-native-lightbox@git+https://github.com/oblador/react-native-lightbox.git": version "0.8.0" resolved "git+https://github.com/oblador/react-native-lightbox.git#4448979323623a56c62b5f8be1032322485cbd31" @@ -5640,6 +5673,12 @@ react-native-markdown-view@^1.0.0: react-native-tabular-grid-markdown-view "0.1.x" simple-markdown "0.3.x" +react-native-modal-dropdown@^0.6.2: + version "0.6.2" + resolved "https://registry.yarnpkg.com/react-native-modal-dropdown/-/react-native-modal-dropdown-0.6.2.tgz#da6027b3546d2031fbce46242bffc95561e13599" + dependencies: + prop-types "^15.6.0" + react-native-modal-popover@0.0.10: version "0.0.10" resolved "https://registry.yarnpkg.com/react-native-modal-popover/-/react-native-modal-popover-0.0.10.tgz#89271eb45f6c3f83702669378c6af97f0c258711" @@ -6204,6 +6243,12 @@ sax@~1.1.1: version "1.1.6" resolved "https://registry.yarnpkg.com/sax/-/sax-1.1.6.tgz#5d616be8a5e607d54e114afae55b7eaf2fcc3240" +sc2-sdk@^1.0.2: + version "1.1.0" + resolved "https://registry.yarnpkg.com/sc2-sdk/-/sc2-sdk-1.1.0.tgz#d44ef79bcc096606cb42154438b4f56327133a0a" + dependencies: + cross-fetch "^1.1.1" + secp256k1@^3.3.1: version "3.5.2" resolved "https://registry.yarnpkg.com/secp256k1/-/secp256k1-3.5.2.tgz#f95f952057310722184fe9c914e6b71281f2f2ae" @@ -7023,6 +7068,10 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3: dependencies: iconv-lite "0.4.23" +whatwg-fetch@2.0.3: + version "2.0.3" + resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz#9c84ec2dcf68187ff00bc64e1274b442176e1c84" + whatwg-fetch@>=0.10.0, whatwg-fetch@^2.0.3: version "2.0.4" resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"