Merge remote-tracking branch 'origin/master' into async

frontend/components/Cards/HomeCard.js

 import React, { Component } from 'react';
-import { StyleSheet, Text, View, Alert, TouchableHighlight, Image, FlatList, TouchableHighlightBase } from 'react-native';
+import { StyleSheet, Text, View, TouchableHighlight, Image, FlatList } from 'react-native';
 import { connect } from 'react-redux';
 import { GetData, UpdatePopulatiry } from '../../api/fetchers'
 import { ScrollView } from 'react-native-gesture-handler';
-import { MaterialDialog } from '../DetailedCard'
+import MaterialDialog from '../DetailedCard'
 
 class Card extends Component {
     state ={
         data: [],
         currentSerachWord: "all",
         dataElement: "",
-        visable: false
+        visible: false
     }
 
     componentWillMount(){
@@ -43,7 +43,8 @@ class Card extends Component {
     
 
     openDetailedCard(destinationID, popularity){
-        GetData(destinationID).then((res) => this.setState({dataElement: res.data.data, visible: true}))
+        GetData(destinationID, "").then((res) => this.setState({dataElement: res.data.data}))
+        this.setState({visible: true})
         this.props.showDestination(destinationID);
         newPop = popularity + 1
         UpdatePopulatiry(destinationID, newPop);
@@ -77,10 +78,25 @@ class Card extends Component {
             },
             name: {
                 textTransform: "capitalize"
+            },
+            scrollViewContainer: {
+                paddingTop: 8,
+
+            },
+            row: {
+                flex: 1,
+                flexDirection: 'column',
+                justifyContent: 'flex-start',
+                alignItems: 'center',
+            },
+            text: {
+                paddingTop: 8,
             }
+            
         })
 
         const { data } = this.state
+        const { dataElement } = this.state
         
         return (
             <View>
@@ -99,23 +115,23 @@ class Card extends Component {
                 initialNumToRender = {5}
                 maxToRenderPerBatch = {10}
                 windowSize = {5}
+                keyExtractor={(item, index) => index.toString()}
                 //updateCellsBatchingPeriod = {10}
                 />
-
-                <TouchableHighlight>
-                    <View>
-
-                <MaterialDialog
+                 <MaterialDialog
                     title={dataElement.name}
+                    scrolled
                     visible={this.state.visible}
-                    onOk={() => console.log("OK was pressed")}
-                    onCancel={() => console.log("Cancel was pressed")}>
-                    >
-                        <Text>heiheiehi</Text>
+                    onOk={() => {console.log("OK was pressed"); this.setState({visible: false})}}
+                    onCancel={() => {console.log("Cancel was pressed"); this.setState({visible: false})}}
+                >
+                    <ScrollView contentContainerStyle={styles.scrollViewContainer}>
+                        <View style={styles.row}>
+                            <Image style={styles.Image} source={{uri: dataElement.img}}/>
+                            <Text style={styles.text}>{dataElement.description}</Text>
+                        </View>
+                    </ScrollView>
                 </MaterialDialog>
-            </View>
-        </TouchableHighlight>)}
-        )}
         </View> 
         )} } 
 

frontend/components/DetailedCard.js

@@ -89,14 +89,14 @@ const MaterialDialog = ({
                     <ActionButton
                       testID="dialog-cancel-button"
                       colorAccent={colorAccent}
-                      onPress={onCancel}
-                      label={cancelLabel}
+                      onPress={onOk}
+                      label={okLabel}
                     />
                     <ActionButton
                       testID="dialog-ok-button"
                       colorAccent={colorAccent}
-                      onPress={onOk}
-                      label={okLabel}
+                      onPress={onCancel}
+                      label={cancelLabel}
                     />
                   </View>
                 ) : null}
@@ -201,8 +201,8 @@ MaterialDialog.propTypes = {
 };
 
 MaterialDialog.defaultProps = {
-  okLabel: 'OK',
-  cancelLabel: 'CANCEL',
+  okLabel: 'ADD TO FAVOURITE',
+  cancelLabel: 'CLOSE',
   title: undefined,
   titleColor: colors.androidPrimaryTextColor,
   backgroundColor: colors.background,

frontend/package-lock.json

@@ -6091,8 +6091,8 @@
     },
     "prop-types": {
       "version": "15.7.2",
-      "resolved": "https://artifactory.palantir.build/artifactory/api/npm/all-npm/prop-types/-/prop-types-15.7.2.tgz",
-      "integrity": "sha1-UsQedbjIfnK52TYOAga5ncv/psU=",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
+      "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==",
       "requires": {
         "loose-envify": "^1.4.0",
         "object-assign": "^4.1.1",

frontend/package.json

@@ -16,6 +16,7 @@
     "mongodb": "^3.3.3",
     "mongoose": "^5.7.7",
     "nodemon": "^1.19.4",
+    "prop-types": "^15.7.2",
     "react": "16.8.3",
     "react-dom": "16.8.3",
     "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz",