nasif did this work

aka4rKO · May 11, 2019 · 9a34493 · 9a34493
1 parent 1885e66
commit 9a34493
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 14 deletions.
diff --git a/Nasif/goeve_final/src/Route.js b/Nasif/goeve_final/src/Route.js
@@ -17,6 +17,7 @@ import { LoginButton } from 'react-native-fbsdk';
 
 import Home from './components/Home';
 import Interets from './components/Interets'
+import InterestsCards from './components/InterestsCards'
 import Login from './components/Login';
 
 const { width: widthDim } = Dimensions.get('window');
@@ -108,7 +109,7 @@ const HomeStack = createStackNavigator({
 
 const InterestsStack = createStackNavigator({
     Interets: {
-        screen: Interets,
+        screen: InterestsCards,
         navigationOptions: ({ navigation }) => ({
             headerStyle: { backgroundColor: '#FB6600' },
             headerTitleStyle: {

diff --git a/Nasif/goeve_final/src/components/InterestsCards.js b/Nasif/goeve_final/src/components/InterestsCards.js
@@ -27,18 +27,24 @@ export default class App extends Component {
         this.handleChange = this.handleChange.bind(this);
       }
 
+      componentDidMount() {
+        fetch(`http://35.186.155.252:4000/categories/`)
+          .then(res => res.json())
+          .then(json => this.setState({ data: json.categories }));
+      }
+
       handleChange = (key,checked) => {
             console.log("Key "+key+" Checked "+checked)
           const newArray = [...this.state.data];
           newArray[key].status = checked;
           this.setState({data:newArray})
           console.log("Length "+this.state.data.length)
-          this.state.data.map((item,key)=>{console.log(item.name+" "+item.status)})
+          this.state.data.map((item,key)=>{console.log(item.category+" "+item.status)})
       }
 
-      componentWillMount (){
+      /* componentWillMount (){
           this.setState({data:this.props.data})
-      }
+      } */
     renderItem = ({ item, index }) => {
         if (item.empty === true) {
             return (
@@ -48,10 +54,10 @@ export default class App extends Component {
                     cornerRadius={0}
                     style={styles.itemInvisible}
                 >
-                    <ImageBackground source={item.url} style={styles.containerImg} resizeMode={'cover'}>
+                    <ImageBackground source={{uri:item.imageURL}} style={styles.containerImg} resizeMode={'cover'}>
                         <View style={styles.check}>
                         </View>
-                        <Text style={styles.text}>{item.name}</Text>
+                        <Text style={styles.text}>{item.category}</Text>
                     </ImageBackground>
                 </CardView>);
         }
@@ -62,7 +68,7 @@ export default class App extends Component {
                 cornerRadius={8}
                 style={styles.card}
             >
-                <ImageBackground source={item.url} style={styles.containerImg} resizeMode={'cover'}>
+                <ImageBackground source={{uri:item.imageURL}} style={styles.containerImg} resizeMode={'cover'}>
                     <View style={styles.check}>
                         <CircleCheckBox
                             checked={item.status}
@@ -75,7 +81,7 @@ export default class App extends Component {
                             filterSize={30}
                         />
                     </View>
-                    <Text style={styles.text}>{item.name}</Text>
+                    <Text style={styles.text}>{item.category}</Text>
                 </ImageBackground>
             </CardView>
         );
@@ -148,7 +154,7 @@ const styles = StyleSheet.create({
         height: 110
     },
     text: {
-        color: "#000",
+        color: "#fff",
         textAlign: 'center',
         textAlignVertical: "center",
         marginTop: 17,

diff --git a/Nasif/goeve_final/src/components/Interets.js b/Nasif/goeve_final/src/components/Interets.js
@@ -9,15 +9,35 @@ export default class Interests extends Component {
     super();
     this.state = { data: [] };
   }
-  componentDidMount() {
+
+  /* componentWillMount() {
+    this.fetchData();
+  }
+
+  fetchData = async () => {
+    const res = await fetch(`http://35.186.155.252:4000/categories/`);
+    const json = await res.json();
+    this.setState({ data: json.categories });
+  }  */
+
+  /* componentDidMount() {
     fetch(`http://35.186.155.252:4000/categories/`)
       .then(res => res.json())
-      .then(json => this.setState({ data: json }));
-  }
+      .then(json => this.setState({ data: json.categories }));
+  } */
 
   render() {
+    console.log(this.state.data);
 
-
+    /* let events = [];
+    const eventType = this.state.datacomponentDidMount() {
+    fetch(`http://35.186.155.252:4000/categories/`)
+      .then(res => res.json())
+      .then(json => this.setState({ data: json.categories }));
+  }.categories;
+    eventType.forEach(element => {
+      events.push(element);
+    }); */
     const eventType = [
       {
         key: 1,
@@ -55,7 +75,7 @@ export default class Interests extends Component {
     ]
 
     return (
-        <InterestsCards data={this.state.data} />
+        <InterestsCards data={/* this.state.data */eventType} />
     );
   }
 }