e2e test passing

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",

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",

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;

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;

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)
+        });
+    });
+});

src/store/restaurants/actions.js

@@ -1 +1,11 @@
-export const loadRestaurants = () => () => {};
+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
+});

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({