Redux ?

iut-expo-starter/App.tsx

@@ -4,13 +4,18 @@ import { SafeAreaView, StyleSheet, Text, View } from 'react-native';
 import { useSafeAreaInsets, SafeAreaProvider } from 'react-native-safe-area-context';
 import TabNavigation from './navigation/TabNavigation';
 import CityList from './screens/CityList';
+import store from "./redux/store";
+import { Provider } from 'react-redux';
+
 
 
 export default function App() {
   return (
-    <SafeAreaProvider style={styles.container}>
+    <Provider store={store}>
-      <TabNavigation/>
+      <SafeAreaProvider style={styles.container}>
-    </SafeAreaProvider>
+        <TabNavigation/>
+      </SafeAreaProvider>
+    </Provider>
   );
 }
 

iut-expo-starter/redux/actions/getCityList.ts

@@ -0,0 +1,8 @@
+import { City } from '../../data/stub';
+import {GET_CITIES} from '../constants';
+
+export const getCity = () => {
+  return {
+    type: GET_CITIES,
+  };
+}

iut-expo-starter/redux/actions/getFavoriteCity.ts

@@ -0,0 +1,8 @@
+import { City } from '../../data/stub';
+import {FETCH_FAVORITE_CITY} from '../constants';
+
+export const getCityList = () => {
+  return {
+    type: FETCH_FAVORITE_CITY,
+  };
+}

iut-expo-starter/redux/actions/setCityList.ts

@@ -0,0 +1,9 @@
+import { City } from '../../data/stub';
+import {FETCH_CITIES} from '../constants';
+
+export const setCityList = (cityList: City[]) => {
+  return {
+    type: FETCH_CITIES,
+    payload: cityList,
+  };
+}

iut-expo-starter/redux/actions/setFavoriteCity.ts

@@ -0,0 +1,9 @@
+import { City } from '../../data/stub';
+import {ADD_FAVORITE_CITY} from '../constants';
+
+export const setFavoriteCity = (city: City | null) => {
+  return {
+    type: ADD_FAVORITE_CITY,
+    payload: city,
+  };
+}

iut-expo-starter/redux/constants.ts

@@ -0,0 +1,5 @@
+export const FETCH_CITIES = "FETCH_CITIES"
+export const ADD_FAVORITE_CITY = "ADD_FAVORITE_CITY"
+export const FETCH_FAVORITE_CITY = "FETCH_FAVORITE_CITY"
+export const GET_CITIES = "GET_CITIES"
+

iut-expo-starter/redux/reducers/appReducer.ts

@@ -0,0 +1,26 @@
+import { City } from "../../data/stub";
+import { ADD_FAVORITE_CITY, FETCH_CITY, FETCH_FAVORITE_CITY, GET_CITIES } from "../constants";
+
+const initialState = {
+    city: [],
+    favoriteCity: null,
+}
+
+const appReducer = (state = initialState, action) => {
+    switch (action.type) {
+        case ADD_FAVORITE_CITY:
+            // @ts-ignore
+            return {...state, favoriteCity: state.favoriteCity = action.payload};
+        case FETCH_CITY:
+            // @ts-ignore
+            return {...state, city: action.payload};
+        case FETCH_FAVORITE_CITY:
+            return {...state, favoriteCity: state.favoriteCity}
+        case GET_CITIES:
+            return {...state, city: state.city}
+        default:
+            return state;
+    }
+}
+
+export default appReducer;

iut-expo-starter/redux/store.ts

@@ -0,0 +1,14 @@
+import {configureStore} from '@reduxjs/toolkit'
+import appReducer from './reducers/appReducer';
+
+// Reference here all your application reducers
+const reducer = {
+  appReducer: appReducer,
+}
+
+// @ts-ignore
+const store = configureStore({
+    reducer,
+},);
+
+export default store;

iut-expo-starter/screens/CityList.tsx

@@ -1,18 +1,21 @@
 import { View, Text, StyleSheet, TouchableHighlight } from "react-native"
 import { FlatList } from "react-native-gesture-handler"
 import { CITIES_DATA, City, getCurrentWeather, FAVORITE_CITY_DATA } from "../data/stub"
-import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { VilleCompopo } from "../components/VilleCompopo";
 import { TopBar } from "../components/TopBar";
+import { useSelector } from "react-redux";
 
 
 export default function CityList({navigation}){
 
+    const cityList = useSelector(state => state.appReducer.city);
+
+
     return (
         <View style={{flex: 1, width: "100%", alignItems: "center"}}>
             <TopBar/>
             <FlatList
-            data={CITIES_DATA}
+            data={cityList}
             keyExtractor={item =>item.name}
             renderItem={({item}) => <TouchableHighlight onPress={() => navigation.navigate("CityDetails", {"city": item})}><VilleCompopo city={item} fav={FAVORITE_CITY_DATA}/></TouchableHighlight>}
             style={leStyle.container} 

iut-expo-starter/screens/Home.tsx

@@ -1,16 +1,20 @@
-import { View, Text, StyleSheet } from "react-native"
+import { View, Text, StyleSheet, ImageBackground } from "react-native"
 import { FlatList } from "react-native-gesture-handler"
 import { CITIES_DATA, City, FAVORITE_CITY_DATA } from "../data/stub"
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { VilleCompopo } from "../components/VilleCompopo";
 import { TopBar } from "../components/TopBar";
 import CityDetails from "./CityDetails";
+import { useSelector } from "react-redux";
 
 
 export default function Home(navigation){
+
+    
     const insets = useSafeAreaInsets();
     const statusBarHeight = insets.top;
     const favoriteCity: City | null = FAVORITE_CITY_DATA;
+    const cityList = useSelector(state => state.push());
 
     return (
         <View style={{alignItems: "center"}}>
@@ -27,7 +31,6 @@ export default function Home(navigation){
                   )
               }
             })()}
-
         </View>
     )
 }