Skip to content

Commit a3cac4d

Browse files
muhozimuhozi
committed
Add linting & style guide config
1 parent 616f827 commit a3cac4d

File tree

16 files changed

+1123
-728
lines changed

16 files changed

+1123
-728
lines changed

‎.eslintrc.json‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"extends": "airbnb",
3+
"plugins": ["react", "jest"],
4+
"parser": "babel-eslint",
5+
"rules": {
6+
"react/jsx-filename-extension": [
7+
1,
8+
{
9+
"extensions": [".js", ".jsx"]
10+
}
11+
],
12+
"no-alert": 0
13+
},
14+
"globals": {
15+
"fetch": true,
16+
"alert": true
17+
}
18+
}

‎.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -54,3 +54,6 @@ buck-out/
5454

5555
# Bundle artifact
5656
*.jsbundle
57+
58+
# VS Code settings
59+
.vscode

‎.vscode/settings.json‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎index.android.js‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎index.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import React, { Component } from 'react';
2-
import { AppRegistry, StyleSheet, Text, View } from 'react-native';
1+
import { AppRegistry } from 'react-native';
32
import App from './src/App';
43

54
AppRegistry.registerComponent('EventLocator', () => App);

‎package.json‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,18 +8,25 @@
88
},
99
"dependencies": {
1010
"module-resolver": "^1.0.0",
11+
"prop-types": "^15.6.2",
1112
"react": "16.5.0",
1213
"react-native": "0.57.0",
1314
"react-native-global-props": "^1.1.3",
1415
"react-native-maps": "^0.21.0",
15-
"react-native-router-flux": "^4.0.1",
16+
"react-native-router-flux": "^4.0.5",
1617
"react-native-vector-icons": "^5.0.0"
1718
},
1819
"devDependencies": {
20+
"babel-eslint": "^10.0.1",
1921
"babel-jest": "19.0.0",
2022
"babel-preset-react-native": "4.0.0",
23+
"eslint": "^5.6.1",
24+
"eslint-config-airbnb": "^17.1.0",
25+
"eslint-plugin-import": "^2.14.0",
26+
"eslint-plugin-jest": "^21.24.1",
27+
"eslint-plugin-jsx-a11y": "^6.1.2",
28+
"eslint-plugin-react": "^7.11.1",
2129
"jest": "19.0.2",
22-
"prop-types": "^15.6.2",
2330
"react-test-renderer": "^16.4.2"
2431
},
2532
"jest": {

‎src/App.js‎

Lines changed: 60 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -1,105 +1,74 @@
11
/**
22
* TODO: Refactor codes
33
*
4-
* TODO: Add code styles linting
5-
*
64
*/
7-
import React, { Component } from 'react';
8-
import { AppRegistry, StyleSheet, Text, View } from 'react-native';
9-
import Icon from 'react-native-vector-icons/Ionicons';
10-
import { Router, Scene, Schema, ActionConst } from 'react-native-router-flux';
5+
import React from 'react';
6+
import { Router, Scene, ActionConst } from 'react-native-router-flux';
7+
import { setCustomTextInput } from 'react-native-global-props';
118
import Splash from './containers/Splash';
129
import Events from './containers/Events';
1310
import SingleEvent from './containers/SingleEvent';
1411
import Reserve from './containers/Reserve';
1512
import Comment from './containers/Comment';
16-
import {
17-
setCustomView,
18-
setCustomTextInput,
19-
setCustomText,
20-
setCustomImage,
21-
setCustomTouchableOpacity
22-
} from 'react-native-global-props';
2313

2414
const customTextInputProps = {
2515
underlineColorAndroid: 'rgba(0,0,0,0)',
2616
};
17+
setCustomTextInput(customTextInputProps);
18+
const App = () => (
19+
<Router>
20+
<Scene key="root">
21+
<Scene
22+
key="splash"
23+
component={Splash}
24+
hideNavBar="true"
25+
title="Splash"
26+
titleStyle={{ color: '#009688', fontSize: 18 }}
27+
navigationBarStyle={{ borderBottomWidth: 0 }}
28+
/>
29+
<Scene
30+
key="events"
31+
title="Events"
32+
component={Events}
33+
titleStyle={{ color: '#ffffff', fontSize: 18 }}
34+
navigationBarStyle={{
35+
borderBottomWidth: 0,
36+
backgroundColor: 'rgba(25, 43, 62, 0.9)',
37+
}}
38+
animation="fade"
39+
type={ActionConst.RESET}
40+
/>
41+
<Scene
42+
key="event"
43+
title="Event details"
44+
hideNavBar
45+
component={SingleEvent}
46+
titleStyle={{ color: '#ffffff', fontSize: 18 }}
47+
navigationBarStyle={{
48+
borderBottomWidth: 0,
49+
backgroundColor: 'rgba(25, 43, 62, 0.9)',
50+
}}
51+
animation="fade"
52+
/>
53+
<Scene
54+
key="reserve"
55+
title="Reserve"
56+
hideNavBar
57+
direction="vertical"
58+
component={Reserve}
59+
schema="modal"
60+
/>
61+
<Scene
62+
key="comment"
63+
title="Comment"
64+
hideNavBar
65+
renderBackButton={() => null}
66+
direction="vertical"
67+
component={Comment}
68+
schema="modal"
69+
/>
70+
</Scene>
71+
</Router>
72+
);
2773

28-
export default class App extends Component {
29-
render() {
30-
return (
31-
<Router>
32-
<Scene key="root">
33-
<Scene
34-
key="splash"
35-
component={Splash}
36-
hideNavBar="true"
37-
title="Splash"
38-
titleStyle={{ color: '#009688', fontSize: 18 }}
39-
navigationBarStyle={{ borderBottomWidth: 0 }}
40-
/>
41-
<Scene
42-
key="events"
43-
title="Events"
44-
component={Events}
45-
titleStyle={{ color: '#ffffff', fontSize: 18 }}
46-
navigationBarStyle={{
47-
borderBottomWidth: 0,
48-
backgroundColor: 'rgba(25, 43, 62, 0.9)'
49-
}}
50-
animation="fade"
51-
type={ActionConst.RESET}
52-
/>
53-
<Scene
54-
key="event"
55-
title="Event details"
56-
hideNavBar={true}
57-
component={SingleEvent}
58-
titleStyle={{ color: '#ffffff', fontSize: 18 }}
59-
navigationBarStyle={{
60-
borderBottomWidth: 0,
61-
backgroundColor: 'rgba(25, 43, 62, 0.9)'
62-
}}
63-
animation="fade"
64-
/>
65-
<Scene
66-
key="reserve"
67-
title="Reserve"
68-
hideNavBar={true}
69-
direction="vertical"
70-
component={Reserve}
71-
schema="modal"
72-
/>
73-
<Scene
74-
key="comment"
75-
title="Comment"
76-
hideNavBar={true}
77-
renderBackButton={() => null}
78-
direction="vertical"
79-
component={Comment}
80-
schema="modal"
81-
/>
82-
</Scene>
83-
</Router>
84-
);
85-
}
86-
}
87-
88-
const styles = StyleSheet.create({
89-
container: {
90-
flex: 1,
91-
justifyContent: 'center',
92-
alignItems: 'center',
93-
backgroundColor: '#F5FCFF'
94-
},
95-
welcome: {
96-
fontSize: 20,
97-
textAlign: 'center',
98-
margin: 10
99-
},
100-
instructions: {
101-
textAlign: 'center',
102-
color: '#333333',
103-
marginBottom: 5
104-
}
105-
});
74+
export default App;

‎src/components/Form.js‎

Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,22 @@
11
import React from 'react';
2-
import {
3-
Text,
4-
View,
5-
TouchableHighlight,
6-
} from 'react-native';
2+
import { Text, View, TouchableHighlight } from 'react-native';
73
import styles from '../styles/Styles';
84
import values from '../styles/Values';
95

10-
export const Button = props => {
11-
const color = props.danger ? values.danger : values.primary;
6+
const Button = (props) => {
7+
const { danger, title } = props;
8+
const color = danger ? 'danger' : 'primary';
129
return (
1310
<TouchableHighlight
1411
underlayColor="rgba(255,255,255,0.2)"
1512
style={{ borderRadius: 5 }}
1613
{...props}
1714
>
18-
<View style={[styles.btn, { backgroundColor: color }]}>
19-
<Text style={{ color: '#fff' }}>{props.title}</Text>
15+
<View style={[styles.btn, { backgroundColor: values[color] }]}>
16+
<Text style={{ color: '#fff' }}>{title}</Text>
2017
</View>
2118
</TouchableHighlight>
2219
);
2320
};
21+
22+
export default Button;

0 commit comments

Comments
 (0)