single city

config/availability.js

@@ -1,323 +1,5 @@
 export const availability = [
-    {
-        name: 'Cities',
-        id: 0,
-        children: [
-            {
-                name: 'Adjuntas',
-                id: 0,
-            },
-            {
-                name: 'Aguada',
-                id: 1,
-            },
-            {
-                name: 'Aguadilla',
-                id: 2,
-            },
-            {
-                name: 'Aguas Buenas',
-                id: 3,
-            },
-            {
-                name: 'Aibonito',
-                id: 4,
-            },
-            {
-                name: 'Arecibo',
-                id: 5,
-            },
-            {
-                name: 'Arroyo',
-                id: 6,
-            },
-            {
-                name: 'Añasco',
-                id: 7,
-            },
-            {
-                name: 'Barceloneta',
-                id: 8,
-            },
-            {
-                name: 'Barranquitas',
-                id: 9,
-            },
-            {
-                name: 'Bayamón',
-                id: 10,
-            },
-            {
-                name: 'Cabo Rojo',
-                id: 11,
-            },
-            {
-                name: 'Caguas',
-                id: 12,
-            },
-            {
-                name: 'Camuy',
-                id: 13,
-            },
-            {
-                name: 'Canóvanas',
-                id: 14,
-            },
-            {
-                name: 'Carolina',
-                id: 15,
-            },
-            {
-                name: 'Cataño',
-                id: 16,
-            },
-            {
-                name: 'Cayey',
-                id: 17,
-            },
-            {
-                name: 'Ceiba',
-                id: 18,
-            },
-            {
-                name: 'Ciales',
-                id: 19,
-            },
-            {
-                name: 'Cidra',
-                id: 20,
-            },
-            {
-                name: 'Coamo',
-                id: 21,
-            },
-            {
-                name: 'Comerío',
-                id: 22,
-            },
-            {
-                name: 'Corozal',
-                id: 23,
-            },
-            {
-                name: 'Culebra',
-                id: 24,
-            },
-            {
-                name: 'Dorado',
-                id: 25,
-            },
-            {
-                name: 'Fajardo',
-                id: 26,
-            },
-            {
-                name: 'Florida',
-                id: 27,
-            },
-            {
-                name: 'Guayama',
-                id: 28,
-            },
-            {
-                name: 'Guayanilla',
-                id: 29,
-            },
-            {
-                name: 'Guaynabo',
-                id: 30,
-            },
-            {
-                name: 'Gurabo',
-                id: 31,
-            },
-            {
-                name: 'Guánica',
-                id: 32,
-            },
-            {
-                name: 'Hatillo',
-                id: 33,
-            },
-            {
-                name: 'Hormigueros',
-                id: 34,
-            },
-            {
-                name: 'Humacao',
-                id: 35,
-            },
-            {
-                name: 'Isabela',
-                id: 36,
-            },
-            {
-                name: 'Jayuya',
-                id: 37,
-            },
-            {
-                name: 'Juana Díaz',
-                id: 38,
-            },
-            {
-                name: 'Juncos',
-                id: 39,
-            },
-            {
-                name: 'Lajas',
-                id: 40,
-            },
-            {
-                name: 'Lares',
-                id: 41,
-            },
-            {
-                name: 'Las Marías',
-                id: 42,
-            },
-            {
-                name: 'Las Piedras',
-                id: 43,
-            },
-            {
-                name: 'Loíza',
-                id: 44,
-            },
-            {
-                name: 'Luquillo',
-                id: 45,
-            },
-            {
-                name: 'Manatí',
-                id: 46,
-            },
-            {
-                name: 'Maricao',
-                id: 47,
-            },
-            {
-                name: 'Maunabo',
-                id: 48,
-            },
-            {
-                name: 'Mayagüez',
-                id: 49,
-            },
-            {
-                name: 'Moca',
-                id: 50,
-            },
-            {
-                name: 'Morovis',
-                id: 51,
-            },
-            {
-                name: 'Naguabo',
-                id: 52,
-            },
-            {
-                name: 'Naranjito',
-                id: 53,
-            },
-            {
-                name: 'Orocovis',
-                id: 54,
-            },
-            {
-                name: 'Patillas',
-                id: 55,
-            },
-            {
-                name: 'Peñuelas',
-                id: 56,
-            },
-            {
-                name: 'Ponce',
-                id: 57,
-            },
-            {
-                name: 'Quebradillas',
-                id: 58,
-            },
-            {
-                name: 'Rincón',
-                id: 59,
-            },
-            {
-                name: 'Rio Grande',
-                id: 60,
-            },
-            {
-                name: 'Sabana Grande',
-                id: 61,
-            },
-            {
-                name: 'Salinas',
-                id: 62,
-            },
-            {
-                name: 'San Germán',
-                id: 63,
-            },
-            {
-                name: 'San Juan',
-                id: 64,
-            },
-            {
-                name: 'San Lorenzo',
-                id: 65,
-            },
-            {
-                name: 'San Sebastián',
-                id: 66,
-            },
-            {
-                name: 'Santa Isabel',
-                id: 67,
-            },
-            {
-                name: 'Toa Alta',
-                id: 68,
-            },
-            {
-                name: 'Toa Baja',
-                id: 69,
-            },
-            {
-                name: 'Trujillo Alto',
-                id: 70,
-            },
-            {
-                name: 'Utuado',
-                id: 71,
-            },
-            {
-                name: 'Vega Alta',
-                id: 72,
-            },
-            {
-                name: 'Vega Baja',
-                id: 73,
-            },
-            {
-                name: 'Vieques',
-                id: 74,
-            },
-            {
-                name: 'Villalba',
-                id: 75,
-            },
-            {
-                name: 'Yabucoa',
-                id: 76,
-            },
-            {
-                name: 'Yauco',
-                id: 77,
-            },
-        ],
-    },
-
+   
     {
         name: 'Languages',
         id: 1,

screens/main/AvailabilityScreen.js

@@ -7,6 +7,7 @@ import SectionedMultiSelect from 'react-native-sectioned-multi-select';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
+import { Picker } from "@react-native-picker/picker";
 
 import { fetchUser } from "../../redux/actions";
 import { styles } from "../../config/styles";
@@ -16,13 +17,16 @@ export class AvailabilityScreen extends Component {
     constructor(props) {
         super(props);
         this.state = {
+            //x : this.route.params.availabilityData.selectedItems,
+            //y : this.route.params.availabilityData.markedDates,
             english: false,
             spanish: false,
             virtual: false,
             face_to_face: false,
             personal: false,
             group: false,
-            cities: [],
+            city: 'San Juan',
+            //cities: [],
             selectedItems: [],
             markedDates: {}
         };
@@ -33,6 +37,12 @@ export class AvailabilityScreen extends Component {
     };
 
     componentDidMount(){
+        /*if (x != undefined){
+            this.setState({selectedItems : x});
+        };
+        if (y != undefined){
+            this.setState({markedDates : y});
+        }*/
         this.props.fetchUser();
         this.forceUpdate(() => {this.handleUpdate()})
     };
@@ -40,10 +50,11 @@ export class AvailabilityScreen extends Component {
     handleUpdate(){
         const { currentUser } = this.props;
         if (currentUser != undefined){
-            if (currentUser.hasOwnProperty('selectedItems') && currentUser.hasOwnProperty('markedDates'))
+            if (currentUser.hasOwnProperty('selectedItems') && currentUser.hasOwnProperty('markedDates') && currentUser.hasOwnProperty('city'))
             this.setState( {selectedItems: currentUser.selectedItems});
             this.setState( {markedDates: currentUser.markedDates});
-        }    
+            this.setState({city: currentUser.city})
+        }
     };
 
     onSave(){
@@ -79,9 +90,9 @@ export class AvailabilityScreen extends Component {
                     }
                 }
             }
-            else{
+            /*else{
                 this.state.cities.push(value);
-            }
+            }*/
         })
         firebase.firestore().collection('Interpreters')
             .doc(firebase.auth().currentUser.uid)
@@ -123,6 +134,87 @@ export class AvailabilityScreen extends Component {
                     onSelectedItemsChange={this.onSelectedItemsChange}
                     selectedItems={this.state.selectedItems}
                 />
+                <Picker selectedValue={this.state.city} onValueChange={(itemValue, itemIndex) => this.setState({city : itemValue})}>
+                    <Picker.Item label='Adjuntas' value={'Adjuntas'}/>
+                    <Picker.Item label='Aguada' value={'Aguada'}/>
+                    <Picker.Item label='Adjuntas' value={'Adjuntas'}/>
+                    <Picker.Item label='Aguadilla' value={'Aguadilla'}/>
+                    <Picker.Item label='Aguas Buenas' value={'Aguas Buenas'}/>
+                    <Picker.Item label='Aibonito' value={'Aibonito'}/>
+                    <Picker.Item label='Arecibo' value={'Arecibo'}/>
+                    <Picker.Item label='Arroyo' value={'Arroyo'}/>
+                    <Picker.Item label='Añasco' value={'Añasco'}/>
+                    <Picker.Item label='Barceloneta' value={'Barceloneta'}/>
+                    <Picker.Item label='Barranquitas' value={'Barranquitas'}/>
+                    <Picker.Item label='Bayamón' value={'Bayamón'}/>
+                    <Picker.Item label='Cabo Rojo' value={'Cabo Rojo'}/>
+                    <Picker.Item label='Caguas' value={'Caguas'}/>
+                    <Picker.Item label='Camuy' value={'Camuy'}/>
+                    <Picker.Item label='Canóvanas' value={'Canóvanas'}/>
+                    <Picker.Item label='Carolina' value={'Carolina'}/>
+                    <Picker.Item label='Cataño' value={'Cataño'}/>
+                    <Picker.Item label='Cayey' value={'Cayey'}/>
+                    <Picker.Item label='Ceiba' value={'Ceiba'}/>
+                    <Picker.Item label='Ciales' value={'Ciales'}/>
+                    <Picker.Item label='Cidra' value={'Cidra'}/>
+                    <Picker.Item label='Coamo' value={'Coamo'}/>
+                    <Picker.Item label='Comerío' value={'Comerío'}/>
+                    <Picker.Item label='Corozal' value={'Corozal'}/>
+                    <Picker.Item label='Culebra' value={'Culebra'}/>
+                    <Picker.Item label='Dorado' value={'Dorado'}/>
+                    <Picker.Item label='Fajardo' value={'Fajardo'}/>
+                    <Picker.Item label='Florida' value={'Florida'}/>
+                    <Picker.Item label='Guayama' value={'Guayama'}/>
+                    <Picker.Item label='Guayanilla' value={'Guayanilla'}/>
+                    <Picker.Item label='Guaynabo' value={'Guaynabo'}/>
+                    <Picker.Item label='Gurabo' value={'Gurabo'}/>
+                    <Picker.Item label='Guánica' value={'Guánica'}/>
+                    <Picker.Item label='Hatillo' value={'Hatillo'}/>
+                    <Picker.Item label='Hormigueros' value={'Hormigueros'}/>
+                    <Picker.Item label='Humacao' value={'Humacao'}/>
+                    <Picker.Item label='Isabela' value={'Isabela'}/>
+                    <Picker.Item label='Jayuya' value={'Jayuya'}/>
+                    <Picker.Item label='Juana Díaz' value={'Juana Díaz'}/>
+                    <Picker.Item label='Juncos' value={'Juncos'}/>
+                    <Picker.Item label='Lajas' value={'Lajas'}/>
+                    <Picker.Item label='Lares' value={'Lares'}/>
+                    <Picker.Item label='Las Marías' value={'Las Marías'}/>
+                    <Picker.Item label='Las Piedras' value={'Las Piedras'}/>
+                    <Picker.Item label='Loíza' value={'Loíza'}/>
+                    <Picker.Item label='Luquillo' value={'Luquillo'}/>
+                    <Picker.Item label='Manatí' value={'Manatí'}/>
+                    <Picker.Item label='Maricao' value={'Maricao'}/>
+                    <Picker.Item label='Maunabo' value={'Maunabo'}/>
+                    <Picker.Item label='Mayagüez' value={'Mayagüez'}/>
+                    <Picker.Item label='Moca' value={'Moca'}/>
+                    <Picker.Item label='Morovis' value={'Morovis'}/>
+                    <Picker.Item label='Naguabo' value={'Naguabo'}/>
+                    <Picker.Item label='Naranjito' value={'Naranjito'}/>
+                    <Picker.Item label='Orocovis' value={'Orocovis'}/>
+                    <Picker.Item label='Patillas' value={'Patillas'}/>
+                    <Picker.Item label='Peñuelas' value={'Peñuelas'}/>
+                    <Picker.Item label='Ponce' value={'Ponce'}/>
+                    <Picker.Item label='Quebradillas' value={'Quebradillas'}/>
+                    <Picker.Item label='Rincón' value={'Rincón'}/>
+                    <Picker.Item label='Rio Grande' value={'Rio Grande'}/>
+                    <Picker.Item label='Sabana Grande' value={'Sabana Grande'}/>
+                    <Picker.Item label='Salinas' value={'Salinas'}/>
+                    <Picker.Item label='San Germán' value={'San Germán'}/>
+                    <Picker.Item label='San Juan' value={'San Juan'}/>
+                    <Picker.Item label='San Lorenzo' value={'San Lorenzo'}/>
+                    <Picker.Item label='San Sebastián' value={'San Sebastián'}/>
+                    <Picker.Item label='Santa Isabel' value={'Santa Isabel'}/>
+                    <Picker.Item label='Toa Alta' value={'Toa Alta'}/>
+                    <Picker.Item label='Toa Baja' value={'Toa Baja'}/>
+                    <Picker.Item label='Trujillo Alto' value={'Trujillo Alto'}/>
+                    <Picker.Item label='Utuado' value={'Utuado'}/>
+                    <Picker.Item label='Vega Alta' value={'Vega Alta'}/>
+                    <Picker.Item label='Vega Baja' value={'Vega Baja'}/>
+                    <Picker.Item label='Vieques' value={'Vieques'}/>
+                    <Picker.Item label='Villalba' value={'Villalba'}/>
+                    <Picker.Item label='Yabucoa' value={'Yabucoa'}/>
+                    <Picker.Item label='Yauco' value={'Yauco'}/>
+                </Picker>
                 <Button title='Save' onPress={() => {this.onSave()}}/>
             </ScrollView>
         );