ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-24 05:42:33 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

changed example for developers folders && created dropdown component

Browse Source
This commit is contained in:
ue 2018-09-29 23:34:04 +03:00
parent 323ba0cacf
commit 56bcc1560b
22 changed files with 271 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
package-lock.json generated
View File

@ -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",

1
package.json
View File

@ -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",

0
src/_EXAMPLES FOR DEVELOPER/actions/.gitkeep Normal file
View File

43
src/_EXAMPLES FOR DEVELOPER/components/statefull/container/exampleContainer.js Normal file
View File

@ -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 <ExampleView />;
}
}
const mapStateToProps = state => ({
user: state.user.user,
});
export default connect(mapStateToProps)(ExampleContainer);

5
src/_EXAMPLES FOR DEVELOPER/components/statefull/index.js Normal file
View File

@ -0,0 +1,5 @@
import ExampleView from "./view/exampleView";
import ExampleContainer from "./container/exampleContainer";
export { ExampleView, ExampleContainer };
export default ExampleContainer;

7
src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleStyles.js Normal file
View File

@ -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.
},
});

7
src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleScreen.js → src/_EXAMPLES FOR DEVELOPER/components/statefull/view/exampleView.js
View File

@ -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 = {};

7
src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleStyles.js Normal file
View File

@ -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.
},
});

12
src/_EXAMPLES FOR DEVELOPER/components/stateless/exampleView.js Normal file
View File

@ -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 }) => <View />;
export default ExampleView;

0
src/_EXAMPLES FOR DEVELOPER/constant/.gitkeep Normal file
View File

0
src/_EXAMPLES FOR DEVELOPER/reducer/.gitkeep Normal file
View File

0
src/_EXAMPLES FOR DEVELOPER/screen/.gitkeep Normal file
View File

49
src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/container/exampleContainer.js
View File

@ -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 <ExampleView />;
}
}
const mapStateToProps = state => ({
user: state.user.user,
});
const mapDispatchToProps = (dispatch, ownProps) => ({
// onClick: () => dispatch(setVisibilityFilter(ownProps.filter))
});
export default connect(
mapStateToProps,
mapDispatchToProps
)(ExampleContainer);

5
src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/index.js
View File

@ -1,5 +0,0 @@
import ExampleView from "./exampleView";
import ExampleContainer from "./exampleContainer";
export { ExampleView, ExampleContainer };
export default ExampleContainer;

3
src/_EXAMPLES FOR DEVELOPERS/componentsScreens/example/screen/exampleStyles.js
View File

@ -1,3 +0,0 @@
import EStyleSheet from "react-native-extended-stylesheet";
export default EStyleSheet.create({});

3
src/_EXAMPLES FOR DEVELOPERS/componentsScreens/index.js
View File

@ -1,3 +0,0 @@
import Exmaple from "./example/example.container";
export { Exmaple };

4
src/components/dropdownButton/index.js Normal file
View File

@ -0,0 +1,4 @@
import DropdownButton from "./view/dropdownButtonView";
export { DropdownButton };
export default DropdownButton;

49
src/components/dropdownButton/view/dropdownButtonStyles.js Normal file
View File

@ -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",
},
});

57
src/components/dropdownButton/view/dropdownButtonView.js Normal file
View File

@ -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,
}) => (
<View style={styles.container}>
<View style={styles.dropdownWrapper}>
<ModalDropdown
style={styles.button}
textStyle={styles.buttonText}
dropdownStyle={[
styles.dropdown,
{ height: DEVICE_HEIGHT / (19 / options.length + 1) },
]}
dropdownTextStyle={styles.dropdownText}
dropdownTextHighlightStyle={styles.dropdownTextHighlight}
options={options}
onSelect={e => onSelect && onSelect(e)}
defaultIndex={defaultIndex}
defaultValue={defaultText}
/>
</View>
<View style={styles.iconWrapper}>
<Ionicons
style={styles.dropdownIcon}
name={!iconName ? "md-arrow-dropdown" : iconName}
/>
</View>
</View>
);
export default DropdownButtonView;

13
src/components/notification/view/notificationStyles.js
View File

@ -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,
},
});

38
src/components/notification/view/notificationView.js
View File

@ -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 (
<View
@ -112,13 +112,18 @@ class NotificationView extends Component {
return (
<View style={styles.container}>
<LineBreak color="#f6f6f6" height={35}>
<View styles={styles.lineBreakItem}>
<Text style={styles.lineBreakItemText}>
{/* TODO: I guess these will be dropdown there for it should be a component */}
ALL NOTIFICATION
{/* <Ionicons style={styles.arrowIcon} name="md-arrow-dropdown" /> */}
</Text>
</View>
<DropdownButton
iconName="md-arrow-dropdown"
options={[
"ALL NOTIFICATION",
"LATEST NOTF",
"ESTEEMAPP",
"UGUR ERDAL",
"ONLY YESTERDAY",
]}
defaultText="ALL NOTIFICATION"
onSelect={this._handleOnDropdownSelect}
/>
</LineBreak>
<ScrollView style={styles.scrollView}>
<ContainerHeader title="Recent" />
@ -127,6 +132,7 @@ class NotificationView extends Component {
renderItem={({ item }) => this._getRenderItem(item)}
keyExtractor={item => item.email}
/>
{/* Will remove fallow lines */}
<ContainerHeader title="Yesterday" />
<FlatList
data={notification}

57
yarn.lock
View File

@ -2082,6 +2082,13 @@ create-react-class@^15.6.2, create-react-class@^15.6.3:
loose-envify "^1.3.1"
object-assign "^4.1.1"
cross-fetch@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-1.1.1.tgz#dede6865ae30f37eae62ac90ebb7bdac002b05a0"
dependencies:
node-fetch "1.7.3"
whatwg-fetch "2.0.3"
cross-spawn@^5.0.1, cross-spawn@^5.1.0:
version "5.1.0"
resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@ -2104,6 +2111,10 @@ crypto-js@^3.1.9-1:
version "3.1.9-1"
resolved "https://registry.yarnpkg.com/crypto-js/-/crypto-js-3.1.9-1.tgz#fda19e761fc077e01ffbfdc6e9fdfc59e8806cd8"
css-mediaquery@^0.1.2:
version "0.1.2"
resolved "https://registry.yarnpkg.com/css-mediaquery/-/css-mediaquery-0.1.2.tgz#6a2c37344928618631c54bd33cedd301da18bea0"
cssom@0.3.x, "cssom@>= 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"