diff --git a/package-lock.json b/package-lock.json index d3b113e..e0e7e08 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", + "axios": "^0.27.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", @@ -5724,6 +5725,28 @@ "node": ">=4" } }, + "node_modules/axios": { + "version": "0.27.2", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.27.2.tgz", + "integrity": "sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==", + "dependencies": { + "follow-redirects": "^1.14.9", + "form-data": "^4.0.0" + } + }, + "node_modules/axios/node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/axobject-query": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.2.1.tgz", diff --git a/package.json b/package.json index 1e4c712..3ea379f 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "dependencies": { "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", + "axios": "^0.27.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", diff --git a/src/api.js b/src/api.js new file mode 100644 index 0000000..e3965fd --- /dev/null +++ b/src/api.js @@ -0,0 +1,13 @@ +import axios from 'axios'; + +const client = axios.create({ + baseURL: 'https://api.outsidein.dev/Sy0NsAyaS8uuURS1zyCDp3Fzxcpg25iw', +}); +const api = { + async loadRestaurants(){ + const response = await client.get('/restaurants'); + return response.data; + }, +}; + +export default api; \ No newline at end of file diff --git a/src/store/index.js b/src/store/index.js index 49d547c..28fef01 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,7 +1,13 @@ import { createStore, applyMiddleware } from 'redux'; import thunk from 'redux-thunk'; import rootReducer from './reducers'; +import api from '../api'; -const store = createStore(rootReducer, applyMiddleware(thunk)); +const store = createStore( + rootReducer, + applyMiddleware( + thunk.withExtraArgument(api), + ), +); export default store; \ No newline at end of file diff --git a/src/store/restaurants.spec.js b/src/store/restaurants.spec.js new file mode 100644 index 0000000..47135f3 --- /dev/null +++ b/src/store/restaurants.spec.js @@ -0,0 +1,32 @@ +import { createStore, applyMiddleware } from "redux"; +import thunk from 'redux-thunk'; +import restaurantReducer from './restaurants/reducers'; +import { loadRestaurants } from "./restaurants/actions"; + +describe('restaurants', () => { + describe('loadRestaurants action', () => { + it('stores the restaurants', async () => { + const records = [ + {id: 1, name: 'Sushi Place'}, + {id: 2, name: 'Pizza Place'} + ]; + + const api = { + loadRestaurants: () => Promise.resolve(records), + }; + const initialState = { + records: [], + }; + const store = createStore( + restaurantReducer, + initialState, + applyMiddleware( + thunk.withExtraArgument(api), + ), + ); + await store.dispatch(loadRestaurants()); + + expect(store.getState().records).toEqual(records) + }); + }); +}); \ No newline at end of file diff --git a/src/store/restaurants/actions.js b/src/store/restaurants/actions.js index b0e7a50..9da3494 100644 --- a/src/store/restaurants/actions.js +++ b/src/store/restaurants/actions.js @@ -1 +1,11 @@ -export const loadRestaurants = () => () => {}; \ No newline at end of file +export const STORE_RESTAURANTS = 'STORE_RESTAURANTS'; + +export const loadRestaurants = () => async (dispatch, getState, api) => { + const records = await api.loadRestaurants(); + dispatch(storeRestaurants(records)); +}; + +const storeRestaurants = records => ({ + type: STORE_RESTAURANTS, + records +}); \ No newline at end of file diff --git a/src/store/restaurants/reducers.js b/src/store/restaurants/reducers.js index ed8b84e..db8ea93 100644 --- a/src/store/restaurants/reducers.js +++ b/src/store/restaurants/reducers.js @@ -1,7 +1,13 @@ import { combineReducers } from 'redux'; +import { STORE_RESTAURANTS } from './actions'; -function records() { - return[]; +function records(state = [], action) { + switch(action.type) { + case STORE_RESTAURANTS: + return action.records; + default: + return state; + } } export default combineReducers({