merge conflict solve

frontend/App.js

@@ -15,6 +15,7 @@ import MarkerInfoWindow from './src/pages/map/map'
 
 import { Text, View } from 'react-native';
 
+import mapHome from '../frontend/src/pages/map/MapHome'
 
 
 const Tab = createBottomTabNavigator()
@@ -48,7 +49,7 @@ function App() {
       <Tab.Navigator>
         <Tab.Screen name="Home" component={HomeScreen} />
         <Tab.Screen name="Settings" component={SettingsScreen} />
-        <Tab.Screen name="maps" component={MarkerInfoWindow} />
+        <Tab.Screen name="maps" component={mapHome} />
       </Tab.Navigator>
     </NavigationContainer>
   );

frontend/src/pages/map/DummyTest.js

+import React from "react";
+import { View, Text, StyleSheet, Button } from "react-native";
+
+export default function Detail ({navigation}) {
+  const goTo = () => navigation.navigate("stackMap");
+
+  return (
+    <View style={styles.container}>
+      <Text>Home screen</Text>
+      <Button onPress={goTo} title={`Go to maps`} />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "azure",
+    alignItems: "center",
+    justifyContent: "center",
+  },
+});

frontend/src/pages/map/MapHome.js

+import React from 'react'
+import { createNativeStackNavigator } from '@react-navigation/native-stack'
+import MarkerInfoWindow from './map'
+import Detail from './DummyTest'
+
+const Stack = createNativeStackNavigator()
+
+export default function MapHome ({ navigation }) {
+  return(
+    <Stack.Navigator
+      initialRouteName='vuDetails'
+      screenOptions={{ headerShown: false }}>
+      <Stack.Screen name='stackMap'>
+        {() => <MarkerInfoWindow navigation = {navigation} />}
+      </Stack.Screen>
+      <Stack.Screen name='vuDetails'>
+        {() => <Detail navigation = {navigation}/>}
+      </Stack.Screen>
+    </Stack.Navigator>
+  )
+}

frontend/src/pages/map/map.js

-import { TouchableOpacity } from 'react-native';
+import { Button, TouchableOpacity } from 'react-native';
 
 
 import {API_KEY} from '@env'
@@ -23,7 +23,7 @@ const InfoWindow = (props) => {
   const { ref, isComponentVisible } = useComponentVisible(true);
 
 
-
+  const goTo = () => navigation.navigate("vuDetails");
   const infoWindowStyle = {
     position: 'relative',
     bottom: 150,
@@ -65,6 +65,7 @@ const InfoWindow = (props) => {
               <div style={{ fontSize: 14, color: 'green' }}>
                 {place.loue.loue ? 'disponible' : 'occupé'}
               </div>
+              <Button onPress={goTo} title={`voir`} />
             </div>
     </TouchableOpacity>
       )}
@@ -93,43 +94,33 @@ const Marker = ({ show, place }) => {
   );
 };
 
-class MarkerInfoWindow extends Component {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      places: [],
-    };
-  }
-  componentDidMount() {
-        jsonFile.results.forEach((result) => {
-          result.show = false; // eslint-disable-line no-param-reassign
-        });
-        this.setState({ places: jsonFile.results });
-  }
+function MarkerInfoWindow ({ navigation }){
+  const [places,setPlaces]  = useState([])
+  
+  useEffect(() => {
+    jsonFile.results.forEach((result) => {
+      result.show = false; // eslint-disable-line no-param-reassign
+    })
+    setPlaces(jsonFile.results)
+  }, [])
 
   // onChildClick callback can take two arguments: key and childProps
-  onChildClickCallback = (key) => {
-    this.setState((state) => {
-      const index = state.places.findIndex((e) => e.id === key);
-      state.places[index].show = !state.places[index].show; // eslint-disable-line no-param-reassign
-      return { places: state.places };
-    });
-  };
+  const updateState = (key) => {
 
-  render() {
-    const { places } = this.state;
+      const index = places.findIndex((e) => e.id === key);
+      places[index].show = !places[index].show; // eslint-disable-line no-param-reassign
+      setPlaces([...places])
+  };
 
     return (
-      <>
-        {/* {!isEmpty(places) && ( */}
           <GoogleMap
             defaultZoom={10}
             defaultCenter={[49.41273, 2.81853]}
             bootstrapURLKeys={{ key: MY_API_KEY }}
-            onChildClick={this.onChildClickCallback}
+            onChildClick={updateState}
           >
-            {places.map((place) => (
+            {places.map((place) => {
+              return(
               <Marker
                 key={place.id}
                 lat={place.geometry.location.lat}
@@ -137,12 +128,10 @@ class MarkerInfoWindow extends Component {
                 show={place.show}
                 place={place}
               />
-            ))}
+            )})}
           </GoogleMap>
-        {/* )} */}
-      </>
     );
-  }
+
 }
 
 InfoWindow.propTypes = {