Added Header, Icon and MessageModal. Refactor screens into directories.

mobile/src/WorkItem/WorkItem.js

@@ -0,0 +1,32 @@
+import React from 'react'
+import { StyleSheet, View, TouchableOpacity, Image, ScrollView, Picker, Text } from 'react-native'
+
+export class WorkItem extends React.Component {
+  static styles = StyleSheet.create({
+    container: {
+      height: '100%',
+      width: '100%',
+      backgroundColor: '#DDDDDD',
+    },
+  })
+
+  constructor(props) {
+    super(props)
+  }
+
+  render() {
+    return (
+      <ScrollView style={WorkItem.styles.container}>
+        <View style={{ width: '94%', backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }}>
+          <Text>Work Item</Text>
+          <Picker selectedValue={this.props.item.type}>
+            <Picker.Item label='Work Item' value='work' />
+            <Picker.Item label='Inspection' value='inspection' />
+            <Picker.Item label='Complaint' value='complaint' />
+          </Picker>
+        </View>
+        <View style={{ width: '94%', height: 300, backgroundColor: 'white', alignSelf: 'center', marginTop: '3%', shadowColor: 'gray', shadowOffset: { width: 2, height: 2 }, shadowRadius: 2, shadowOpacity: .5 }} />
+      </ScrollView>
+    );
+  }
+}

mobile/src/WorkItem/WorkItemList.js

@@ -0,0 +1,71 @@
+import React from 'react'
+import { StyleSheet, View, TouchableOpacity, Image, FlatList, Text} from 'react-native'
+import autobind from 'autobind-decorator'
+
+const styles = StyleSheet.create({
+  container: {
+    height: '100%',
+    width: '100%',
+    justifyContent: 'flex-start',
+    backgroundColor: '#FFFFFF',
+  },
+})
+
+const data = [
+  {key: '1', type: 'work', location: 'Ossington Ave. | 0.2 mi.', state: 'open', latlng: { latitude: 43.653226, longitude: -79.383184 } },
+  {key: '2', type: 'inspection', location: 'Alexandre St. | 0.7 mi.', state: 'open', latlng: { latitude: 43.648118, longitude: 79.392636 }},
+  {key: '3', type: 'complaint', location: 'Bay St. | 0.8 mi.', state: 'open', latlng: { latitude: 43.640168, longitude: -79.409373 }},
+  {key: '4', type: 'work', location: 'Bloor St. | 1.2 mi.', state: 'open', latlng: { latitude: 43.633110, longitude: -79.415880 }},
+  {key: '5', type: 'inspection', location: 'Blue Jays Way | 2.2 mi.', state: 'open', latlng: { latitude: 43.653526, longitude: -79.361385 }},
+  {key: '6', type: 'complaint', location: 'Christie St. | 3.0 mi.', state: 'open', latlng: { latitude: 43.663870, longitude: -79.383705 }},
+  {key: '7', type: 'work', location: 'Cummer Ave. | 4.2 mi.', state: 'open', latlng: { latitude: 43.659166, longitude: -79.391350 }},
+  {key: '8', type: 'complaint', location: 'Danforth Ave. | 4.7 mi.', state: 'open', latlng: { latitude: 43.663538, longitude: -79.423212 }},
+]
+
+const inspectionTypes = {
+  work: {
+    title: 'Work Order'
+  },
+  inspection: {
+    title: 'Inspection',
+  },
+  complaint: {
+    title: 'Complaint',
+  }
+}
+
+export class WorkItemList extends React.Component {
+  constructor(props) {
+    super(props)
+    this._handleItemSelect = this._handleItemSelect.bind(this)
+  }
+
+  @autobind
+  _handleItemSelect(item, index) {
+    this.props.history.push('/activity')
+  }
+
+  render() {
+    return (
+      <View style={styles.container}>
+      <FlatList
+        style={{ width: '100%', flexGrow: 1, paddingTop: 20, paddingBottom: 20 }}
+        data={data}
+        renderItem={({item, index}) => {
+          return (
+            <View style={{ flexDirection: 'row', height: 50 }}>
+              <Text style={{ fontSize: 8, width: 45, marginLeft: 15, alignSelf: 'center' }}>{item.state.toUpperCase()}</Text>
+              <View style={{ flexDirection: 'column', width: '75%' }}>
+                <Text style={{ fontSize: 20 }}>{Admin.inspectionTypes[item.type].title}</Text>
+                <Text style={{ fontSize: 14, color: 'gray' }}>{item.location}</Text>
+              </View>
+              <TouchableOpacity style={{ alignSelf: 'center' }} onPress={() => (this._handleItemSelect(item, index))} >
+                <Image source={rightArrowImage} style={{ width: 16, height: 16 }} />
+              </TouchableOpacity>
+            </View>
+          )
+        }} />
+      </View>
+    );
+  }
+}

mobile/src/WorkItem/index.js

@@ -0,0 +1,3 @@
+export { WorkItem } from './WorkItem'
+export { WorkItemList } from './WorkItemList'
+