From 3d44abdf7c0fde54c4045c63e4876f8fc2242862 Mon Sep 17 00:00:00 2001 From: Thomas Chazot Date: Wed, 15 Mar 2023 10:28:01 +0100 Subject: [PATCH] Redux ? --- iut-expo-starter/App.tsx | 11 +++++--- iut-expo-starter/redux/actions/getCityList.ts | 8 ++++++ .../redux/actions/getFavoriteCity.ts | 8 ++++++ iut-expo-starter/redux/actions/setCityList.ts | 9 +++++++ .../redux/actions/setFavoriteCity.ts | 9 +++++++ iut-expo-starter/redux/constants.ts | 5 ++++ iut-expo-starter/redux/reducers/appReducer.ts | 26 +++++++++++++++++++ iut-expo-starter/redux/store.ts | 14 ++++++++++ iut-expo-starter/screens/CityList.tsx | 7 +++-- iut-expo-starter/screens/Home.tsx | 7 +++-- 10 files changed, 97 insertions(+), 7 deletions(-) create mode 100644 iut-expo-starter/redux/actions/getCityList.ts create mode 100644 iut-expo-starter/redux/actions/getFavoriteCity.ts create mode 100644 iut-expo-starter/redux/actions/setCityList.ts create mode 100644 iut-expo-starter/redux/actions/setFavoriteCity.ts create mode 100644 iut-expo-starter/redux/constants.ts create mode 100644 iut-expo-starter/redux/reducers/appReducer.ts create mode 100644 iut-expo-starter/redux/store.ts diff --git a/iut-expo-starter/App.tsx b/iut-expo-starter/App.tsx index 2a4b5caa..97824817 100644 --- a/iut-expo-starter/App.tsx +++ b/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 ( - - - + + + + + ); } diff --git a/iut-expo-starter/redux/actions/getCityList.ts b/iut-expo-starter/redux/actions/getCityList.ts new file mode 100644 index 00000000..c266579e --- /dev/null +++ b/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, + }; +} \ No newline at end of file diff --git a/iut-expo-starter/redux/actions/getFavoriteCity.ts b/iut-expo-starter/redux/actions/getFavoriteCity.ts new file mode 100644 index 00000000..265aba37 --- /dev/null +++ b/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, + }; +} \ No newline at end of file diff --git a/iut-expo-starter/redux/actions/setCityList.ts b/iut-expo-starter/redux/actions/setCityList.ts new file mode 100644 index 00000000..df9dbd48 --- /dev/null +++ b/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, + }; +} \ No newline at end of file diff --git a/iut-expo-starter/redux/actions/setFavoriteCity.ts b/iut-expo-starter/redux/actions/setFavoriteCity.ts new file mode 100644 index 00000000..f1dd1c87 --- /dev/null +++ b/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, + }; +} \ No newline at end of file diff --git a/iut-expo-starter/redux/constants.ts b/iut-expo-starter/redux/constants.ts new file mode 100644 index 00000000..27ec6f2a --- /dev/null +++ b/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" + diff --git a/iut-expo-starter/redux/reducers/appReducer.ts b/iut-expo-starter/redux/reducers/appReducer.ts new file mode 100644 index 00000000..3c3caa15 --- /dev/null +++ b/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; \ No newline at end of file diff --git a/iut-expo-starter/redux/store.ts b/iut-expo-starter/redux/store.ts new file mode 100644 index 00000000..c4d15b08 --- /dev/null +++ b/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; \ No newline at end of file diff --git a/iut-expo-starter/screens/CityList.tsx b/iut-expo-starter/screens/CityList.tsx index b80dab94..3c17b892 100644 --- a/iut-expo-starter/screens/CityList.tsx +++ b/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 ( item.name} renderItem={({item}) => navigation.navigate("CityDetails", {"city": item})}>} style={leStyle.container} diff --git a/iut-expo-starter/screens/Home.tsx b/iut-expo-starter/screens/Home.tsx index 559e2799..a5bca7ca 100644 --- a/iut-expo-starter/screens/Home.tsx +++ b/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 ( @@ -27,7 +31,6 @@ export default function Home(navigation){ ) } })()} - ) }