Changed import methods in tests, for shorter test files. Deleted actions for loading favorite, it was more than needed.

Author: urlDev

.eslintcache

@@ -17,7 +17,6 @@ import {
 
 import AddSrc from "assets/bookmarkEmpty.svg";
 import AddedSrc from "assets/bookmark.svg";
-import SpinnerSrc from "assets/spinner.svg";
 
 import ErrorFallback from "components/error-fallback/ErrorFallback";
 import DetailsTable from "components/details-table/DetailsTable";
@@ -32,7 +31,7 @@ import { MarketDetailsContainer } from "./MarketDetails.styles";
 
 const MarketDetails = () => {
   const { marketDetail, chartTimeFrame } = useSelector((state) => state.chart);
-  const { favorites, loadingFavorite } = useSelector((state) => state.favorite);
+  const { favorites } = useSelector((state) => state.favorite);
   const { user } = useSelector((state) => state.user);
 
   const timeFrames = ["5min", "15min", "30min", "1hour"];
@@ -50,13 +49,7 @@ const MarketDetails = () => {
   }, [user.name, dispatch, favorites.length]);
 
   const add = <img src={AddSrc} alt="empty bookmark" />;
-  const added = (
-    <img
-      src={loadingFavorite ? SpinnerSrc : AddedSrc}
-      alt="added favorite, filled bookmark"
-    />
-  );
-  // const spinner = <img src={SpinnerSrc} alt="spinner for loading favorite" />;
+  const added = <img src={AddedSrc} alt="added favorite, filled bookmark" />;
 
   const handleClick = () => {
     // First, checking the length
@@ -91,10 +84,7 @@ const MarketDetails = () => {
               {add}
             </Link>
           ) : (
-            <FavoriteButton
-              onClick={() => handleClick()}
-              favorite={loadingFavorite}
-            >
+            <FavoriteButton onClick={() => handleClick()}>
               {favorites.some(
                 (favorite) => favorite.symbol[0].symbol === marketDetail.symbol
               )

src/components/market-details/MarketDetails.jsx

@@ -11,8 +11,6 @@ export const ADD_FAVORITE = "ADD_FAVORITE";
 export const DELETE_FAVORITE = "DELETE_FAVORITE";
 export const FETCH_FAVORITE_ERROR = "FETCH_FAVORITE_ERROR";
 export const CLEAN_FAVORITE_STATE = "CLEAN_FAVORITE_STATE";
-export const LOADING_FAVORITE = "LOADING_FAVORITE";
-export const LOADING_FAVORITE_END = "LOADING_FAVORITE_END";
 
 export const getFavorite = (stock) => ({
   type: GET_FAVORITE,
@@ -38,14 +36,6 @@ export const cleanFavoriteState = () => ({
   type: CLEAN_FAVORITE_STATE,
 });
 
-export const setLoadingFavorite = () => ({
-  type: LOADING_FAVORITE,
-});
-
-export const setLoadingFavoriteEnd = () => ({
-  type: LOADING_FAVORITE_END,
-});
-
 export const fetchGetFavorites = () => async (dispatch) => {
   const token = JSON.parse(localStorage.getItem("token"));
 
@@ -72,14 +62,11 @@ export const fetchAddFavorites = (stock) => async (dispatch) => {
     headers: { Authorization: `Bearer ${token}` },
   };
 
-  dispatch(setLoadingFavorite());
-
   try {
     const response = await axios.post(`${url}/`, favoriteStock, config);
     const data = await response.data;
     return [
       dispatch(addFavorite(data.symbol[0])),
-      // dispatch(setLoadingFavoriteEnd()),
       toaster.notify(
         () => (
           <NotificationComponent

src/redux/actions/favorite.js

@@ -3,7 +3,6 @@ import * as FavoriteActions from "redux/actions/favorite";
 const initialState = {
   errorFavorite: null,
   favorites: [],
-  loadingFavorite: false,
 };
 
 const favoriteReducer = (state = initialState, action) => {
@@ -35,16 +34,6 @@ const favoriteReducer = (state = initialState, action) => {
         ...state,
         favorites: [],
       };
-    case FavoriteActions.LOADING_FAVORITE:
-      return {
-        ...state,
-        loadingFavorite: true,
-      };
-    case FavoriteActions.LOADING_FAVORITE_END:
-      return {
-        ...state,
-        loadingFavorite: false,
-      };
     default:
       return state;
   }

src/redux/reducers/favorite.js

@@ -1,96 +1,77 @@
 import moxios from "moxios";
 
-import {
-  FETCH_POPULAR_SUCCESS,
-  FETCH_STORY_SUCCESS,
-  FETCH_NEWS_ERROR,
-  CHANGE_HEADER,
-  CLEAR_ERROR,
-  SET_WIDTH,
-  OPEN_RESPONSIVE_MENU,
-  CLOSE_RESPONSIVE_MENU,
-  fetchPopularSuccess,
-  fetchStorySuccess,
-  changeHeader,
-  fetchNewsError,
-  clearError,
-  setWidth,
-  openResponsiveMenu,
-  closeResponsiveMenu,
-  fetchTopStories,
-  fetchMostPopular,
-} from "../../../redux/actions/news";
+import * as NewsActions from "redux/actions/news";
 
 import { story, popular, errorNews, width } from "../../fixtures/news";
 
 import { store } from "../../store";
 
 test("Should get the top stories correctly", () => {
-  const action = fetchStorySuccess(story);
+  const action = NewsActions.fetchStorySuccess(story);
 
   expect(action).toEqual({
-    type: FETCH_STORY_SUCCESS,
+    type: NewsActions.FETCH_STORY_SUCCESS,
     payload: story,
   });
 });
 
 test("Should get the most popular stories correctly", () => {
-  const action = fetchPopularSuccess(popular);
+  const action = NewsActions.fetchPopularSuccess(popular);
 
   expect(action).toEqual({
-    type: FETCH_POPULAR_SUCCESS,
+    type: NewsActions.FETCH_POPULAR_SUCCESS,
     payload: popular,
   });
 });
 
 test("Should show error if there is any", () => {
-  const action = fetchNewsError(errorNews);
+  const action = NewsActions.fetchNewsError(errorNews);
 
   expect(action).toEqual({
-    type: FETCH_NEWS_ERROR,
+    type: NewsActions.FETCH_NEWS_ERROR,
     payload: errorNews,
   });
 });
 
 test("Should change the header", () => {
-  const action = changeHeader("arts");
+  const action = NewsActions.changeHeader("arts");
 
   expect(action).toEqual({
-    type: CHANGE_HEADER,
+    type: NewsActions.CHANGE_HEADER,
     payload: "arts",
   });
 });
 
 test("Should clear the error", () => {
-  const action = clearError();
+  const action = NewsActions.clearError();
 
   expect(action).toEqual({
-    type: CLEAR_ERROR,
+    type: NewsActions.CLEAR_ERROR,
   });
 });
 
 test("Should set the width of the window", () => {
-  const action = setWidth(width);
+  const action = NewsActions.setWidth(width);
 
   expect(action).toEqual({
-    type: SET_WIDTH,
+    type: NewsActions.SET_WIDTH,
     payload: width,
   });
 });
 
 test("Should open the responsive menu", () => {
-  const action = openResponsiveMenu();
+  const action = NewsActions.openResponsiveMenu();
 
   expect(action).toEqual({
-    type: OPEN_RESPONSIVE_MENU,
+    type: NewsActions.OPEN_RESPONSIVE_MENU,
   });
 });
 
 test("Should close the responsive menu", () => {
-  const action = closeResponsiveMenu();
+  const action = NewsActions.closeResponsiveMenu();
 
   expect(action).toEqual({
-    type: CLOSE_RESPONSIVE_MENU,
+    type: NewsActions.CLOSE_RESPONSIVE_MENU,
   });
 });
 
@@ -115,11 +96,11 @@ describe("Testing redux-thunk, fetching news", () => {
       });
 
       const expectedActions = {
-        type: FETCH_STORY_SUCCESS,
+        type: NewsActions.FETCH_STORY_SUCCESS,
         payload: story.results,
       };
 
-      return store.dispatch(fetchTopStories("home")).then(() => {
+      return store.dispatch(NewsActions.fetchTopStories("home")).then(() => {
         const actionsGetCalled = store.getActions();
 
         expect(actionsGetCalled[0]).toEqual(expectedActions);
@@ -133,11 +114,11 @@ describe("Testing redux-thunk, fetching news", () => {
       });
 
       const expectedActions = {
-        type: FETCH_NEWS_ERROR,
+        type: NewsActions.FETCH_NEWS_ERROR,
         payload: errorNews,
       };
 
-      return store.dispatch(fetchTopStories("home")).then(() => {
+      return store.dispatch(NewsActions.fetchTopStories("home")).then(() => {
         const actionsGetCalled = store.getActions();
 
         expect(actionsGetCalled[0]).toEqual(expectedActions);
@@ -156,11 +137,11 @@ describe("Testing redux-thunk, fetching news", () => {
       });
 
       const expectedActions = {
-        type: FETCH_POPULAR_SUCCESS,
+        type: NewsActions.FETCH_POPULAR_SUCCESS,
         payload: popular.results,
       };
 
-      return store.dispatch(fetchMostPopular()).then(() => {
+      return store.dispatch(NewsActions.fetchMostPopular()).then(() => {
         const actionsGetCalled = store.getActions();
 
         expect(actionsGetCalled[0]).toEqual(expectedActions);
@@ -174,11 +155,11 @@ describe("Testing redux-thunk, fetching news", () => {
       });
 
       const expectedActions = {
-        type: FETCH_NEWS_ERROR,
+        type: NewsActions.FETCH_NEWS_ERROR,
         payload: errorNews,
       };
 
-      return store.dispatch(fetchMostPopular()).then(() => {
+      return store.dispatch(NewsActions.fetchMostPopular()).then(() => {
         const actionsGetCalled = store.getActions();
 
         expect(actionsGetCalled[0]).toEqual(expectedActions);