Merge branch 'feature/loading_fixes' of Neca/HRCenter into FE_dev

src/__tests__/UITests/candidateDetailsPageUI.test.js

@@ -88,7 +88,7 @@ describe("CandidateDetailsPage render tests", () => {
   it("Should represent one year of experience for the candidate", () => {
     render(cont);
     expect(screen.getByTestId("candidate-experience").textContent).toBe(
-      "Experience:1"
+      "candidates.experience:1"
     );
   });
 
@@ -101,7 +101,7 @@ describe("CandidateDetailsPage render tests", () => {
 
   it("It should show Muski inside paragraph for gender because value of gender property of our candidate is M", () => {
     render(cont);
-    expect(screen.getByTestId("candidate-gender").textContent).toBe("Muski");
+    expect(screen.getByTestId("candidate-gender").textContent).toBe("common.male");
   });
 
   it("Should render dialog after clicking button for deleting candidate", () => {

src/__tests__/UITests/statsAdComponentUI.test.js

@@ -52,6 +52,6 @@ describe("StatsAd render tests", () => {
       container
         .getElementsByClassName("archive-ad-experience")[0]
         .getElementsByTagName("p")[0].textContent
-    ).toBe("1+ years of experience");
+    ).toBe("1+ common.experience");
   });
 });

src/assets/styles/components/_icon-button.scss

@@ -5,21 +5,23 @@
   user-select: none;
   cursor: pointer;
 }
-.td-btn{
+.td-btn {
   width: 34px !important;
   height: 34px !important;
   min-width: none !important;
 }
-.td-btn.inactive{
-  background: #FFEAEE !important;
-    color: #D72228 !important;
-    border-color: #D72228 !important;
+.td-btn.inactive {
+  background: #ffeaee !important;
+  color: #d72228 !important;
+  border-color: #d72228 !important;
 }
 
-.userPageBtn.activeEnable{
-  background-color: rgba(100,255,100,0.75) !important;
+.userPageBtn.activeEnable {
+  // background-color: rgba(100,255,100,0.75) !important;
 }
 
-.userPageBtn.deactiveEnable{
-  background-color: rgba(255,100,100,0.75) !important;;
-}
+.userPageBtn.deactiveEnable {
+  background: #ffeaee !important;
+  color: #d72228 !important;
+  border-color: #d72228 !important;
+}

src/assets/styles/components/_loader.scss

@@ -70,3 +70,7 @@
     }
   }
 }
+
+.loader-container{
+  @include flex-center;
+}

src/i18n/resources/en.js

@@ -275,7 +275,7 @@ export default {
     patternsMade:"Patterns made",
     noPatterns:"There are currently no patterns added",
     addPattern:"Add pattern",
-    editing2:"Editin mode"
+    editing2:"Editing mode"
   },
   stats:{
     statistic:"Statistic",

src/i18n/resources/rs.js

@@ -10,7 +10,7 @@ export default {
   common: {
     //   close: 'Close',
     //   trademark: 'TM',
-    search: "Pretrazi",
+    search: "Pretraži",
     //   error: 'Error',
     //   continue: 'Continue',
     labelUsername: "Korisničko ime",
@@ -27,8 +27,8 @@ export default {
     //   done: 'Done',
     confirm: "Potvrdi",
     //   printDownload: 'Print/Download',
-    cancel: "Otkazi",
-    delete: "Obrisi",
+    cancel: "Otkaži",
+    delete: "Obriši",
     change: "Promeni",
     //   remove: 'Remove',
     //   invite: 'Invite',
@@ -48,11 +48,11 @@ export default {
     firstName: "Ime",
     lastName: "Prezime",
     gender: "Pol",
-    male: "Muski",
-    female: "Zenski",
-    dateOfBirth: "Datum rodjenja",
+    male: "Muški",
+    female: "ženski",
+    dateOfBirth: "Datum rođenja",
     phoneNumber: "Broj telefona",
-    socialNetwork: "Drustvene mreze",
+    socialNetwork: "Društvene mreže",
     address: "adresa",
     specialist: "Specijalista",
     title: "Naslov",
@@ -96,11 +96,11 @@ export default {
     signInWithGoogle: "Prijava putem Google-a",
     invalidEmail: "Format adrese nije validan",
     specialCharacterRequired:
-      "Lozinka mora da sadrzi najmanje jedan poseban znak",
-    numberRequired: "Lozinka mora da sadrzi najmanje jedan broj",
-    lowercaseRequired: "Lozinka mora da sadrzi najmanje jedno malo slovo",
-    uppercaseRequired: "Lozinka mora da sadrzi najmanje jedno veliko slovo",
-    numberOfCharactersRequired: "Lozinka mora da sadrzi najmanje 8 karaktera",
+      "Lozinka mora da sadrži najmanje jedan poseban znak",
+    numberRequired: "Lozinka mora da sadrži najmanje jedan broj",
+    lowercaseRequired: "Lozinka mora da sadrži najmanje jedno malo slovo",
+    uppercaseRequired: "Lozinka mora da sadrži najmanje jedno veliko slovo",
+    numberOfCharactersRequired: "Lozinka mora da sadrži najmanje 8 karaktera",
     retypePassword: "Molimo ponovo unesite lozinku.",
     matchPasswords: "Lozinke se ne poklapaju",
     passwordConfirmation: "Potvrda lozinke",
@@ -211,18 +211,18 @@ export default {
     socials: "Društvene mreže",
     resetPassword: "Resetuj lozinku",
     resetLink:
-      "Da li ste sigurni da zelite da posaljete link za resetovanje lozinke?",
-    disableUser: "Onemoguci korisnika",
+      "Da li ste sigurni da želite da pošaljete link za resetovanje lozinke?",
+    disableUser: "Onemogući korisnika",
     questionDisableUser:
-      "Da li ste sigurni da zelite da onemogucite korisnika?",
-    deleteUser: "Obrisite korisnika",
-    questionDeleteUser: "Da li ste sigurni da zelite ukloniti korisnika?",
+      "Da li ste sigurni da želite da onemogućite korisnika?",
+    deleteUser: "Obrišite korisnika",
+    questionDeleteUser: "Da li ste sigurni da želite ukloniti korisnika?",
     block: "Blokiraj",
     unblock: "Odblokiraj",
     profile: "Uredi profil",
-    positionNotDeclared: "Pozicija nije jos uvek odredjena.",
+    positionNotDeclared: "Pozicija nije još uvek određena.",
     backToUsers: "Nazad na listu korisnika",
-    noSocialMedia: "Korisnik nije deo nijedne drustvene mreze.",
+    noSocialMedia: "Korisnik nije deo nijedne društvene mreže.",
     noPhoneNumber: "Korisnik nema sacuvan broj telefona.",
   },
   filter: {
@@ -232,7 +232,7 @@ export default {
     done: {
       HR: "HR intervjua",
       ST: "Screening testova",
-      TI: "Tehnickih intervjua",
+      TI: "Tehničkih intervjua",
       FD: "Primljenih kandidata",
     },
   },
@@ -243,19 +243,19 @@ export default {
     link: "Registracioni link",
     register: "Registruj se",
     twoSteps: "Dva koraka do HR Centra.",
-    mistake: "Doslo je do greske...",
+    mistake: "Došlo je do greške...",
   },
   filters: {
     filters: "Filteri",
     experience: "Godine iskustva",
     technologies: "Tehnologije",
     employmentType: "Tip zaposlenja",
-    internship: "Strucna praksa",
+    internship: "Stručna praksa",
     work: "Posao",
     workHour: "Radno vreme",
-    partTime: "Skraceno vreme",
+    partTime: "Skraćeno vreme",
     fullTime: "Puno vreme",
-    search: "Pretrazi",
+    search: "Pretraži",
     dateOfApplication: "Datum prijave",
     category: "Kategorija",
     creationDate: "Datum kreiranja",
@@ -270,11 +270,11 @@ export default {
     comment: "Komentar",
     allApplications: "Sve prijave",
     backToCandidates: "Nazad na sve kandidate",
-    tableView: "Tablicni prikaz",
+    tableView: "Tablični prikaz",
     search: "Pretraga",
     position: "Pozicija",
     deleteCandidate:"Brisanje kandidata",
-    deleteCandidateQuestion:"Da li ste sigurni da zelite da obrisete kandidata?"
+    deleteCandidateQuestion:"Da li ste sigurni da želite da obrišete kandidata?"
   },
   dialogs: {
     candidateName: "Ime kandidata",
@@ -288,7 +288,7 @@ export default {
     planner: "Planer aktivnosti",
   },
   selection: {
-    report: "Detaljni izvestaj",
+    report: "Detaljni izveštaj",
     link: "Link do Google Meet-a",
     noCandidates: "Nema kandidata u selekciji",
     interviewer: "Intervjuer",

src/pages/AdsPage/AdsPage.js

@@ -29,6 +29,8 @@ import { setTechnologiesReq } from "../../store/actions/technologies/technologie
 import { selectTechnologies } from "../../store/selectors/technologiesSelectors";
 import { useLocation } from "react-router-dom";
 import Fade from "@mui/material/Fade";
+import { FETCH_ADS_LOADING } from "../../store/actions/ads/adsActionConstants";
+import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
 
 const AdsPage = ({ history }) => {
   const theme = useTheme();
@@ -213,8 +215,17 @@ const AdsPage = ({ history }) => {
       />
     </div>
   );
+  const isLoading = useSelector(selectIsLoadingByActionType(FETCH_ADS_LOADING));
 
-  return (
+  return isLoading ? (
+    <div>
+      <div className="l-t-rectangle"></div>
+      <div className="r-b-rectangle"></div>
+      <div className="loader-container h-withHeader">
+        <span>Loading</span>
+      </div>
+    </div>
+  ) : (
     <div data-testid="ads-page">
       <div className="l-t-rectangle"></div>
       <div className="r-b-rectangle"></div>

src/pages/AdsPage/CreateAdSecondStep.js

@@ -6,7 +6,7 @@ import { changeIsCheckedAddAdValue } from "../../store/actions/addAdTechnologies
 import { useTranslation } from "react-i18next";
 
 const CreateAdSecondStep = ({ technologies, experience, setExperience }) => {
-  const { t } = useTranslation;
+  const { t } = useTranslation();
   const dispatch = useDispatch();
 
   const handleCheckboxes = (technologyId) => {

src/pages/SelectionProcessPage/SelectionProcessPage.js

@@ -23,6 +23,11 @@ import { setUsersReq } from "../../store/actions/users/usersActions";
 import StatusDialog from "../../components/MUI/StatusDialog";
 import InterviewerDialog from "../../components/MUI/InterviewerDialog";
 import CommentProcessDialog from "../../components/MUI/CommentProcessDialog";
+import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
+import {
+  FETCH_FILTERED_PROCESSES_LOADING,
+  FETCH_PROCESSES_LOADING,
+} from "../../store/actions/processes/processesActionConstants";
 
 const SelectionProcessPage = ({ history }) => {
   const [toggleFiltersDrawer, setToggleFiltersDrawer] = useState(false);
@@ -85,7 +90,23 @@ const SelectionProcessPage = ({ history }) => {
     );
   });
 
-  return (
+  const isLoading = useSelector(
+    selectIsLoadingByActionType(FETCH_PROCESSES_LOADING)
+  );
+
+  const isLoadingFiltered = useSelector(
+    selectIsLoadingByActionType(FETCH_FILTERED_PROCESSES_LOADING)
+  );
+
+  return isLoading || isLoadingFiltered ? (
+    <div>
+      <div className="l-t-rectangle"></div>
+      <div className="r-b-rectangle"></div>
+      <div className="loader-container h-withHeader">
+        <span>Loading</span>
+      </div>
+    </div>
+  ) : (
     <LocalizationProvider dateAdapter={AdapterDateFns}>
       <div data-testid="selections-page">
         <div className="l-t-rectangle"></div>

src/pages/StatsPage/StatsPage.js

@@ -5,7 +5,6 @@ import { useRef } from "react";
 import arrow_left from "../../assets/images/arrow_left.png";
 import arrow_right from "../../assets/images/arrow_right.png";
 import Slider from "react-slick";
-// import Ad from "../../components/Ads/Ad";
 import { AD_DETAILS_PAGE } from "../../constants/pages";
 import StatsAd from "../../components/Ads/StatsAd";
 import { useDispatch } from "react-redux";
@@ -14,8 +13,8 @@ import { useEffect } from "react";
 import { getStatsReq } from "../../store/actions/stats/statsActions";
 import { useTranslation } from "react-i18next";
 import { returni18nLevel } from "../../util/helpers/stringHelpers";
-// import ArchiveAd from "../../components/Ads/ArchiveAd";
-// import { AD_DETAILS_PAGE } from "../../constants/pages";
+import { FETCH_STATS_LOADING } from "../../store/actions/stats/statsActionConstants";
+import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
 
 const StatsPage = ({ history }) => {
   const dispatch = useDispatch();
@@ -72,7 +71,19 @@ const StatsPage = ({ history }) => {
     sliderRef.current.slickNext();
   };
 
-  return (
+  const isLoading = useSelector(
+    selectIsLoadingByActionType(FETCH_STATS_LOADING)
+  );
+
+  return isLoading ? (
+    <div>
+      <div className="l-t-rectangle"></div>
+      <div className="r-b-rectangle"></div>
+      <div className="loader-container h-withHeader">
+        <span>Loading</span>
+      </div>
+    </div>
+  ) : (
     <div>
       <div className="l-t-rectangle"></div>
       <div className="r-b-rectangle"></div>

src/pages/UsersPage/UserDetails.js

@@ -2,7 +2,9 @@ import React, { useState } from "react";
 import PropTypes from "prop-types";
 import avatar from "../../assets/images/Avatar.png";
 import filters from "../../assets/images/filters.png";
+import delete2 from "../../assets/images/delete.png";
 import lock from "../../assets/images/lock.png";
+2;
 import forbiden from "../../assets/images/forbiden.png";
 import IconButton from "../../components/IconButton/IconButton";
 import { Link, useParams } from "react-router-dom";
@@ -19,6 +21,8 @@ import { useTheme } from "@emotion/react";
 import { useMediaQuery } from "@mui/material";
 import ConfirmDialog from "../../components/MUI/ConfirmDialog";
 import { useTranslation } from "react-i18next";
+import { USER_DETAILS_LOADING } from "../../store/actions/users/usersActionConstants";
+import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
 
 const UserDetails = ({ history }) => {
   const theme = useTheme();
@@ -80,7 +84,19 @@ const UserDetails = ({ history }) => {
     dispatch(userDetailsReq({ id }));
   }, [dispatch]);
 
-  return (
+  const isLoading = useSelector(
+    selectIsLoadingByActionType(USER_DETAILS_LOADING)
+  );
+
+  return isLoading ? (
+    <div>
+      <div className="l-t-rectangle"></div>
+      <div className="r-b-rectangle"></div>
+      <div className="loader-container h-withHeader">
+        <span>Loading</span>
+      </div>
+    </div>
+  ) : (
     <div>
       <div className="l-t-rectangle"></div>
       <div className="r-b-rectangle"></div>
@@ -116,7 +132,7 @@ const UserDetails = ({ history }) => {
         open={showDelete}
         title={t("users.deleteUser")}
         subtitle={user?.firstName + " " + user?.lastName}
-        imgSrc={filters}
+        imgSrc={delete2}
         content={t("users.questionDeleteUser")}
         onClose={() => {
           setDelete(false);
@@ -202,7 +218,7 @@ const UserDetails = ({ history }) => {
                         top: -0.25,
                         paddingLeft: "10px",
                       }}
-                      src={filters}
+                      src={delete2}
                     />
                   </IconButton>
                 )}

src/pages/UsersPage/UsersPage.js

@@ -3,30 +3,26 @@ import IconButton from "../../components/IconButton/IconButton";
 import planeVector from "../../assets/images/planeVector.png";
 import lock from "../../assets/images/lock.png";
 import PropTypes from "prop-types";
-// import filters from "../../assets/images/filters.png";
 import forbiden from "../../assets/images/forbiden.png";
 import searchImage from "../../assets/images/search.png";
 import x from "../../assets/images/x.png";
 import edit from "../../assets/images/edit.png";
 import { useEffect } from "react";
 import addUser from "../../assets/images/addUser.png";
-// import { getAllUsers } from "../../request/usersRequest";
-// import { getUsers } from "../../store/saga/usersSaga";
 import { useDispatch, useSelector } from "react-redux";
 import {
-  // deleteUserReq,
   setEnableUsersReq,
   setUsersReq,
 } from "../../store/actions/users/usersActions";
 import { useTheme } from "@mui/system";
 import { Fade, useMediaQuery } from "@mui/material";
-// import DialogComponent from "../../components/MUI/DialogComponent";
 import InviteDialog from "../../components/MUI/InviteDialog";
-// import { Link } from "react-router-dom";
 import { forgetPassword } from "../../store/actions/login/loginActions";
 import { useTranslation } from "react-i18next";
 import ConfirmDialog from "../../components/MUI/ConfirmDialog";
 import EditButton from "../../components/Button/EditButton";
+import { selectIsLoadingByActionType } from "../../store/selectors/loadingSelectors";
+import { FETCH_USERS_LOADING } from "../../store/actions/users/usersActionConstants";
 
 const UsersPage = (props) => {
   const theme = useTheme();
@@ -129,7 +125,19 @@ const UsersPage = (props) => {
     </div>
   );
 
-  return (
+  const isLoading = useSelector(
+    selectIsLoadingByActionType(FETCH_USERS_LOADING)
+  );
+
+  return isLoading ? (
+    <div>
+      <div className="l-t-rectangle"></div>
+      <div className="r-b-rectangle"></div>
+      <div className="loader-container h-withHeader">
+        <span>Loading</span>
+      </div>
+    </div>
+  ) : (
     <div data-testid="users">
       <div className="l-t-rectangle"></div>
       <div className="r-b-rectangle"></div>

src/store/actions/ads/adsActionConstants.js

@@ -2,6 +2,7 @@ import {
   createFetchType,
   createSuccessType,
   createErrorType,
+  createLoadingType,
 } from "../actionHelpers";
 
 const CREATE_AD_SCOPE = "FETCH_ADS";
@@ -9,6 +10,7 @@ const CREATE_AD_SCOPE = "FETCH_ADS";
 export const FETCH_ADS_REQ = createFetchType(CREATE_AD_SCOPE);
 export const FETCH_ADS_ERR = createErrorType(CREATE_AD_SCOPE);
 export const FETCH_ADS_SUCCESS = createSuccessType(CREATE_AD_SCOPE);
+export const FETCH_ADS_LOADING = createLoadingType(CREATE_AD_SCOPE);
 
 export const FETCH_FILTERED_ADS_REQ = "FETCH_FILTERED_ADS_REQ";
 export const FETCH_FILTERED_ADS_ERR = "FETCH_FILTERED_ADS_ERR";

src/store/actions/processes/processesActionConstants.js

@@ -1,38 +1,48 @@
 import {
-    createClearType,
-    createErrorType,
-    createFetchType,
-    createLoadingType,
-    createSuccessType,
-  } from '../actionHelpers';
+  createClearType,
+  createErrorType,
+  createFetchType,
+  createLoadingType,
+  createSuccessType,
+} from "../actionHelpers";
 
-export const FETCH_PROCESSES_REQ = 'FETCH_PROCESSES_REQ';
-export const FETCH_PROCESSES_ERR = 'FETCH_PROCESSES_ERR';
-export const FETCH_PROCESSES_SUCCESS = 'FETCH_PROCESSES_SUCCESS';
-export const FETCH_FILTERED_PROCESSES_REQ = 'FETCH_FILTERED_PROCESSES_REQ';
+const FETCH_PROCESSES_SCOPE = "FETCH_PROCESSES";
+export const FETCH_PROCESSES_REQ = createFetchType(FETCH_PROCESSES_SCOPE);
+export const FETCH_PROCESSES_ERR = createErrorType(FETCH_PROCESSES_SCOPE);
+export const FETCH_PROCESSES_SUCCESS = createSuccessType(FETCH_PROCESSES_SCOPE);
+export const FETCH_PROCESSES_LOADING = createLoadingType(FETCH_PROCESSES_SCOPE);
 
-const PUT_PROCESS_SCOPE = 'PUT_PROCESS';
+export const FETCH_FILTERED_PROCESSES_REQ = createFetchType(
+  FETCH_PROCESSES_SCOPE
+);
+export const FETCH_FILTERED_PROCESSES_LOADING = createLoadingType(
+  FETCH_PROCESSES_SCOPE
+);
+
+const PUT_PROCESS_SCOPE = "PUT_PROCESS";
 export const PUT_PROCESS_REQ = createFetchType(PUT_PROCESS_SCOPE);
 export const PUT_PROCESS_SUCCESS = createSuccessType(PUT_PROCESS_SCOPE);
 export const PUT_PROCESS_ERR = createErrorType(PUT_PROCESS_SCOPE);
 export const CLEAR_PUT_PROCESS_ERR = createClearType(
-  `${PUT_PROCESS_SCOPE}_ERR`,
+  `${PUT_PROCESS_SCOPE}_ERR`
 );
 export const PUT_PROCESS_LOADING = createLoadingType(PUT_PROCESS_SCOPE);
 
-export const FETCH_APPLICANT_PROCESSES_REQ = 'FETCH_APPLICANT_PROCESSES_REQ';
-export const FETCH_APPLICANT_PROCESSES_ERR = 'FETCH_APPLICANT_PROCESSES_ERR';
-export const FETCH_APPLICANT_PROCESSES_SUCCESS = 'FETCH_APPLICANT_PROCESSES_SUCCESS';
+export const FETCH_APPLICANT_PROCESSES_REQ = "FETCH_APPLICANT_PROCESSES_REQ";
+export const FETCH_APPLICANT_PROCESSES_ERR = "FETCH_APPLICANT_PROCESSES_ERR";
+export const FETCH_APPLICANT_PROCESSES_SUCCESS =
+  "FETCH_APPLICANT_PROCESSES_SUCCESS";
 
-export const FETCH_STATUSES_REQ = 'FETCH_STATUSES_REQ';
-export const FETCH_STATUSES_ERR = 'FETCH_STATUSES_ERR';
-export const FETCH_STATUSES_SUCCESS = 'FETCH_STATUSES_SUCCESS';
-export const CHANGE_STATUS_ISCHECKED_VALUE = 'CHANGE_STATUS_ISCHECKED_VALUE';
+export const FETCH_STATUSES_REQ = "FETCH_STATUSES_REQ";
+export const FETCH_STATUSES_ERR = "FETCH_STATUSES_ERR";
+export const FETCH_STATUSES_SUCCESS = "FETCH_STATUSES_SUCCESS";
+export const CHANGE_STATUS_ISCHECKED_VALUE = "CHANGE_STATUS_ISCHECKED_VALUE";
 
-export const FETCH_STATUS_CHANGE_REQ = 'FETCH_STATUS_CHANGE_REQ';
-export const FETCH_STATUS_CHANGE_ERR = 'FETCH_STATUS_CHANGE_ERR';
-export const FETCH_STATUS_CHANGE_SUCCESS = 'FETCH_STATUS_CHANGE_SUCCESS';
+export const FETCH_STATUS_CHANGE_REQ = "FETCH_STATUS_CHANGE_REQ";
+export const FETCH_STATUS_CHANGE_ERR = "FETCH_STATUS_CHANGE_ERR";
+export const FETCH_STATUS_CHANGE_SUCCESS = "FETCH_STATUS_CHANGE_SUCCESS";
 
-export const FETCH_INTERVIEWER_CHANGE_REQ = 'FETCH_INTERVIEWER_CHANGE_REQ';
-export const FETCH_INTERVIEWER_CHANGE_ERR = 'FETCH_INTERVIEWER_CHANGE_ERR';
-export const FETCH_INTERVIEWER_CHANGE_SUCCESS = 'FETCH_INTERVIEWER_CHANGE_SUCCESS';
+export const FETCH_INTERVIEWER_CHANGE_REQ = "FETCH_INTERVIEWER_CHANGE_REQ";
+export const FETCH_INTERVIEWER_CHANGE_ERR = "FETCH_INTERVIEWER_CHANGE_ERR";
+export const FETCH_INTERVIEWER_CHANGE_SUCCESS =
+  "FETCH_INTERVIEWER_CHANGE_SUCCESS";

src/store/actions/stats/statsActionConstants.js

@@ -1,3 +1,12 @@
-export const FETCH_STATS_REQ = 'FETCH_STATS_REQ';
-export const FETCH_STATS_ERR = 'FETCH_STATS_ERR';
-export const FETCH_STATS_SUCCESS = 'FETCH_STATS_SUCCESS';
+import {
+  createErrorType,
+  createFetchType,
+  createLoadingType,
+  createSuccessType,
+} from "../actionHelpers";
+
+const FETCH_STATS_SCOPE = "FETCH_STATS";
+export const FETCH_STATS_REQ = createFetchType(FETCH_STATS_SCOPE);
+export const FETCH_STATS_ERR = createErrorType(FETCH_STATS_SCOPE);
+export const FETCH_STATS_SUCCESS = createSuccessType(FETCH_STATS_SCOPE);
+export const FETCH_STATS_LOADING = createLoadingType(FETCH_STATS_SCOPE);

src/store/actions/users/usersActionConstants.js

@@ -1,20 +1,31 @@
-export const FETCH_USERS_REQ = 'FETCH_USERS_REQ';
-export const FETCH_USERS_ERR = 'FETCH_USERS_ERR';
-export const FETCH_USERS_SUCCESS = 'FETCH_USERS_SUCCESS';
+import {
+  createErrorType,
+  createFetchType,
+  createLoadingType,
+  createSuccessType,
+} from "../actionHelpers";
 
-export const TOGGLE_USER_ENABLE_REQ = 'TOGGLE_USER_ENABLE_REQ';
-export const TOGGLE_USER_ENABLE_ERR = 'TOGGLE_USER_ENABLE_ERR';
-export const TOGGLE_USER_ENABLE_SUCCESS = 'TOGGLE_USER_ENABLE_SUCCESS';
+const FETCH_USERS_SCOPE = "FETCH_USERS";
+export const FETCH_USERS_REQ = createFetchType(FETCH_USERS_SCOPE);
+export const FETCH_USERS_ERR = createErrorType(FETCH_USERS_SCOPE);
+export const FETCH_USERS_SUCCESS = createSuccessType(FETCH_USERS_SCOPE);
+export const FETCH_USERS_LOADING = createLoadingType(FETCH_USERS_SCOPE);
 
-export const DELETE_USER_REQ = 'DELETE_USER_REQ';
-export const DELETE_USER_ERR = 'DELETE_USER_ERR';
-export const DELETE_USER_SUCCESS = 'DELETE_USER_SUCCESS';
+export const TOGGLE_USER_ENABLE_REQ = "TOGGLE_USER_ENABLE_REQ";
+export const TOGGLE_USER_ENABLE_ERR = "TOGGLE_USER_ENABLE_ERR";
+export const TOGGLE_USER_ENABLE_SUCCESS = "TOGGLE_USER_ENABLE_SUCCESS";
 
-export const USER_DETAILS_REQ = 'USER_DETAILS_REQ';
-export const USER_DETAILS_ERR = 'USER_DETAILS_ERR';
-export const USER_DETAILS_SUCCESS = 'USER_DETAILS_SUCCESS';
-export const USER_DETAILS_TOGGLE = 'USER_DETAILS_TOGGLE';
+export const DELETE_USER_REQ = "DELETE_USER_REQ";
+export const DELETE_USER_ERR = "DELETE_USER_ERR";
+export const DELETE_USER_SUCCESS = "DELETE_USER_SUCCESS";
 
-export const USER_INVITE_REQ = 'USER_INVITE_REQ';
-export const USER_INVITE_ERR = 'USER_INVITE_ERR';
-export const USER_INVITE_SUCCESS = 'USER_INVITE_SUCCESS';
+const USER_DETAILS = "USER_DETAILS";
+export const USER_DETAILS_REQ = createFetchType(USER_DETAILS);
+export const USER_DETAILS_ERR = createErrorType(USER_DETAILS);
+export const USER_DETAILS_SUCCESS = createSuccessType(USER_DETAILS);
+export const USER_DETAILS_LOADING = createLoadingType(USER_DETAILS);
+export const USER_DETAILS_TOGGLE = "USER_DETAILS_TOGGLE";
+
+export const USER_INVITE_REQ = "USER_INVITE_REQ";
+export const USER_INVITE_ERR = "USER_INVITE_ERR";
+export const USER_INVITE_SUCCESS = "USER_INVITE_SUCCESS";