dropped(redux)

frontend/src/components/recommendation/SelectListSubPage.jsx

@@ -17,12 +17,11 @@ import APP_ROUTES from "../../config/appRoutes";
 import SimplePopupMenu from "../common/SimplePopupMenu";
 import LinkToUser from "../common/LinkToUser";
 import { CURRENT_USER_ID } from "../../config/user";
-import useCreateOne from "../../hooks/useCreateOne";
-import useDeleteOne from "../../hooks/useDeleteOne";
-import useInvalidateAll from "../../hooks/useInvalidateAll";
 import NavigationService from "../../services/NavigationService";
 import withNetworkWrapper, { NetWrapParam } from "../../hoc/withNetworkWrapper";
 
+import { useApiCreate, useApiDelete } from "../../hooks/wrappers/api";
+
 const emptyList = {
   title: "Une nouvelle liste",
   is_public: false,
@@ -52,13 +51,12 @@ function SelectListSubPage({ lists }) {
   const [display, setDisplay] = useState("owned");
   const classes = useStyles();
 
-  const createList = useCreateOne("recommendationLists");
-  const deleteList = useDeleteOne("recommendationLists");
-  const invalidateData = useInvalidateAll("recommendationLists");
+  const createList = useApiCreate("recommendationLists");
+  const deleteList = useApiDelete("recommendationLists");
 
   const goToList = useCallback(listId => {
     NavigationService.goToRoute(APP_ROUTES.forList(listId));
-  });
+  }, []);
 
   const ownedLists = lists.filter(list => list.is_user_owner);
   const followedLists = lists.filter(list => !list.is_user_owner);
@@ -88,7 +86,6 @@ function SelectListSubPage({ lists }) {
         onClick={() =>
           createList(emptyList, data => {
             goToList(data.id);
-            invalidateData();
           })
         }
         className={classes.button}
@@ -130,10 +127,7 @@ function SelectListSubPage({ lists }) {
                           {
                             disabled: false,
                             label: "Confirmer",
-                            onClick: () =>
-                              deleteList(list.id, () => {
-                                invalidateData();
-                              })
+                            onClick: () => deleteList(list.id)
                           }
                         ]}
                         renderHolder={({ onClick }) => (

frontend/src/components/recommendation/ViewListSubPage.jsx

@@ -3,7 +3,7 @@ import PropTypes from "prop-types";
 import { compose } from "recompose";
 import Button from "@material-ui/core/Button";
 import ArrowBackIcon from "@material-ui/icons/ArrowBack";
-import RequestParams from "../../redux/api/RequestParams";
+import RequestParams from "../../utils/api/RequestParams";
 import List from "./view/View";
 import withNetworkWrapper, {
   getApiPropTypes,

frontend/src/components/recommendation/view/View.jsx

@@ -6,13 +6,11 @@
  *
  * Some hacks to optimize performances and keep performances on the top
  */
-import React, { useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from "react";
 import PropTypes from "prop-types";
 
 import Button from "@material-ui/core/Button";
 import AddIcon from "@material-ui/icons/Add";
-import { compose } from "recompose";
-import { connect } from "react-redux";
 import { Typography } from "@material-ui/core";
 import IconButton from "@material-ui/core/IconButton";
 import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
@@ -33,12 +31,16 @@ import CopyToClipboard from "../../common/CopyToClipboard";
 import SimplePopupMenu from "../../common/SimplePopupMenu";
 import { appBarHeight } from "../../../config/sharedStyles";
 import SaveButton from "../../common/SaveButton";
-import RequestParams from "../../../redux/api/RequestParams";
-import getActions from "../../../redux/api/getActions";
 import UnivBlock from "./UnivBlock";
 import TextBlock from "./TextBlock";
 import LinkToUser from "../../common/LinkToUser";
 import LicenseNotice from "../../common/LicenseNotice";
+import {
+  useApiDelete,
+  useApiInvalidateAll,
+  useApiInvalidateOne,
+  useApiUpdate
+} from "../../../hooks/wrappers/api";
 
 const FORGET_SAVE_MESSAGE = "Des changements n'ont pas été enregistré !";
 
@@ -674,40 +676,35 @@ const styles = theme => ({
   }
 });
 
-const mapDispatchToProps = dispatch => ({
-  updateListOnServer: (data, onSuccess) => {
-    const params = RequestParams.Builder.withOnSuccessCallback(onSuccess)
-      .withId(data.id)
-      .withData(data)
-      .build();
-    return dispatch(getActions("recommendationLists").update(params));
-  },
-  followList: (listId, onSuccess) => {
-    const params = RequestParams.Builder.withOnSuccessCallback(onSuccess)
-      .withId(listId)
-      .build();
-    return dispatch(
-      getActions("recommendationListChangeFollower").update(params)
-    );
-  },
-  unFollowList: (listId, onSuccess) => {
-    const params = RequestParams.Builder.withOnSuccessCallback(onSuccess)
-      .withId(listId)
-      .build();
-    return dispatch(
-      getActions("recommendationListChangeFollower").delete(params)
-    );
-  },
-  invalidateList: () =>
-    dispatch(getActions("recommendationLists").invalidateOne()),
-  invalidateListsSummary: () =>
-    dispatch(getActions("recommendationLists").invalidateAll())
-});
+const StyledView = withStyles(styles)(View);
 
-export default compose(
-  withStyles(styles),
-  connect(
-    () => ({}),
-    mapDispatchToProps
-  )
-)(View);
+// eslint-disable-next-line react/prop-types
+export default ({ list }) => {
+  const invalidateList = useApiInvalidateOne("recommendationLists");
+  const invalidateListsSummary = useApiInvalidateAll("recommendationLists");
+
+  const updateListOnServerInt = useApiUpdate("recommendationLists");
+  const updateListOnServer = useCallback(
+    (data, onSuccess) => updateListOnServerInt(data.id, data, onSuccess),
+    []
+  );
+
+  const followListInt = useApiUpdate("recommendationListChangeFollower");
+  const followList = useCallback(
+    (listId, onSuccess) => followListInt(listId, {}, onSuccess),
+    []
+  );
+
+  const unFollowList = useApiDelete("recommendationListChangeFollower");
+
+  return (
+    <StyledView
+      list={list}
+      invalidateList={invalidateList}
+      invalidateListsSummary={invalidateListsSummary}
+      updateListOnServer={updateListOnServer}
+      followList={followList}
+      unFollowList={unFollowList}
+    />
+  );
+};

frontend/src/components/search/Search.jsx

 import React, { useCallback, useMemo, useState } from "react";
 
 import TextField from "@material-ui/core/TextField";
-
-import { useSelector } from "react-redux";
 import fuzzysort from "fuzzysort";
 import Typography from "@material-ui/core/Typography";
 import { makeStyles } from "@material-ui/styles";
 import UnivList from "./UnivList";
 import UniversityService from "../../services/data/UniversityService";
+import { useSelectedUniversities } from "../../hooks/wrappers/useSelectedUniversities";
 
 const useStyles = makeStyles({
   inputCentered: {
@@ -26,9 +25,7 @@ function Search() {
     setInputValue(e.target.value);
   }, []);
 
-  const selectedUniversities = useSelector(
-    state => state.app.selectedUniversities
-  );
+  const [selectedUniversities] = useSelectedUniversities();
 
   const suggestions = useMemo(() => {
     const universities = UniversityService.getUniversities();

frontend/src/components/settings/theme/ColorTools.jsx

 /* eslint-disable react/sort-comp */
 // Inspired by from https://github.com/mui-org/material-ui/blob/master/docs/src/pages/style/color/ColorTool.js
 
-import React from "react";
+import React, { useCallback } from "react";
 import PropTypes from "prop-types";
-import { connect } from "react-redux";
 import withStyles from "@material-ui/core/styles/withStyles";
 import Grid from "@material-ui/core/Grid";
 import Typography from "@material-ui/core/Typography";
@@ -22,11 +21,10 @@ import isEqual from "lodash/isEqual";
 import Divider from "@material-ui/core/Divider";
 import defaultSiteTheme from "../../../config/defaultTheme.json";
 import SaveButton from "../../common/SaveButton";
-import getActions from "../../../redux/api/getActions";
 import ColorDemo from "./ColorDemo";
 import TextLink from "../../common/TextLink";
 import deepCopy from "../../../utils/deepCopy";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import { getTheme } from "../../common/theme/utils";
 import { CURRENT_USER_ID } from "../../../config/user";
 import LicenseNotice from "../../common/LicenseNotice";
@@ -34,6 +32,8 @@ import withNetworkWrapper, {
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
 
+import { useApiUpdate } from "../../../hooks/wrappers/api";
+
 const isRgb = string => /#?([0-9a-f]{6})/i.test(string);
 
 /**
@@ -313,20 +313,6 @@ ColorTool.propTypes = {
   userData: PropTypes.object.isRequired
 };
 
-// eslint-disable-next-line no-unused-vars
-const mapStateToProps = state => ({});
-
-const mapDispatchToProps = dispatch => ({
-  saveUserDataToServer: data =>
-    dispatch(
-      getActions("userData").update(
-        RequestParams.Builder.withId(CURRENT_USER_ID)
-          .withData(data)
-          .build()
-      )
-    )
-});
-
 const styles = theme => ({
   colorBar: {
     marginTop: theme.spacing(2)
@@ -346,11 +332,7 @@ const styles = theme => ({
   }
 });
 
-export default compose(
-  connect(
-    mapStateToProps,
-    mapDispatchToProps
-  ),
+const ConnectedComp = compose(
   withNetworkWrapper([
     new NetWrapParam(
       "userData",
@@ -361,3 +343,13 @@ export default compose(
   ]),
   withStyles(styles, { withTheme: true })
 )(ColorTool);
+
+export default () => {
+  const saveUserDataToServerInt = useApiUpdate("userData");
+  const saveUserDataToServer = useCallback(
+    data => saveUserDataToServerInt(CURRENT_USER_ID, data),
+    []
+  );
+
+  return <ConnectedComp saveUserDataToServer={saveUserDataToServer} />;
+};

frontend/src/components/university/modules/CountryDri.jsx

@@ -9,12 +9,11 @@ import ModuleGroupWrapper from "./common/ModuleGroupWrapper";
 
 import CountryDriForm from "../forms/CountryDriForm";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
-import useInvalidateAll from "../../../hooks/useInvalidateAll";
 
 function CoreComponent({ rawModelData }) {
   const { comment } = rawModelData;
@@ -39,8 +38,6 @@ function CountryDri({ countryId, countryDriItems, api }) {
     api.countryDriItems.setParams(buildParams(countryId));
   }, [countryId]);
 
-  const invalidateData = useInvalidateAll("countryDri");
-
   const defaultModelData = useMemo(
     () => ({
       countries: [countryId],
@@ -52,7 +49,7 @@ function CountryDri({ countryId, countryDriItems, api }) {
     <ModuleGroupWrapper
       groupTitle="Informations émanant de la DRI liées au pays"
       formInfo={CountryDriForm}
-      invalidateGroup={invalidateData}
+      invalidateGroup={() => {}}
       defaultModelData={defaultModelData}
     >
       {countryDriItems.map((rawModelData, idx) => (
@@ -63,7 +60,6 @@ function CountryDri({ countryId, countryDriItems, api }) {
           rawModelData={rawModelData}
           formInfo={CountryDriForm}
           CoreComponent={CoreComponent}
-          onSave={invalidateData}
         />
       ))}
     </ModuleGroupWrapper>

frontend/src/components/university/modules/CountryScholarships.jsx

@@ -11,12 +11,11 @@ import Scholarship from "./common/Scholarship";
 
 import CountryScholarshipForm from "../forms/CountryScholarshipForm";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
-import useInvalidateAll from "../../../hooks/useInvalidateAll";
 
 const useStyles = makeStyles(theme => ({
   item: {
@@ -53,7 +52,7 @@ CoreComponent.propTypes = {
   rawModelData: PropTypes.shape({
     comment: PropTypes.string,
     frequency: PropTypes.string,
-    currency: PropTypes.number,
+    currency: PropTypes.string,
     short_description: PropTypes.string,
     amount_min: PropTypes.number,
     amount_max: PropTypes.number,
@@ -86,13 +85,11 @@ function CountryScholarships({
     [countryId]
   );
 
-  const invalidateData = useInvalidateAll("countryScholarships");
-
   return (
     <ModuleGroupWrapper
       formInfo={CountryScholarshipForm}
       groupTitle={`Bourses liées au pays (${country.name})`}
-      invalidateGroup={invalidateData}
+      invalidateGroup={() => {}}
       defaultModelData={defaultModelData}
     >
       {countryScholarshipsItems.map(rawModelData => (
@@ -102,7 +99,6 @@ function CountryScholarships({
             buildTitle={modelData => modelData.title}
             rawModelData={rawModelData}
             CoreComponent={CoreComponent}
-            onSave={invalidateData}
           />
         </div>
       ))}

frontend/src/components/university/modules/SharedUnivFeedback.jsx

@@ -4,13 +4,12 @@ import compose from "recompose/compose";
 import ModuleWrapper from "./common/ModuleWrapper";
 import SharedUnivFeedbackForm from "../forms/SharedUnivFeedbackForm";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import TruncatedMarkdown from "../../common/markdown/TruncatedMarkdown";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
-import useInvalidateAll from "../../../hooks/useInvalidateAll";
 
 function CoreComponent({ rawModelData }) {
   const { comment } = rawModelData;
@@ -31,8 +30,6 @@ function SharedUnivFeedback({ univId, api, feedback }) {
     api.feedback.setParams(buildParams(univId));
   }, [univId]);
 
-  const invalidateData = useInvalidateAll("sharedUnivFeedbacks");
-
   return (
     <ModuleWrapper
       buildTitle={() =>
@@ -41,7 +38,6 @@ function SharedUnivFeedback({ univId, api, feedback }) {
       rawModelData={feedback[0]}
       formInfo={SharedUnivFeedbackForm}
       CoreComponent={CoreComponent}
-      onSave={invalidateData}
     />
   );
 }

frontend/src/components/university/modules/UniversityDri.jsx

@@ -8,13 +8,12 @@ import ModuleWrapper from "./common/ModuleWrapper";
 import ModuleGroupWrapper from "./common/ModuleGroupWrapper";
 
 import UniversityDriForm from "../forms/UniversityDriForm";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import useInvalidateAll from "../../../hooks/useInvalidateAll";
 
 function CoreComponent({ rawModelData }) {
   const { comment } = rawModelData;
@@ -36,8 +35,6 @@ function UniversityDri({ univId, univDriItems, api }) {
     api.univDriItems.setParams(buildParams(univId));
   }, [univId]);
 
-  const invalidateData = useInvalidateAll("universityDri");
-
   const defaultModelData = useMemo(
     () => ({
       universities: [univId],
@@ -50,7 +47,7 @@ function UniversityDri({ univId, univDriItems, api }) {
     <ModuleGroupWrapper
       groupTitle={"Informations émanant de la DRI liées à l'université"}
       formInfo={UniversityDriForm}
-      invalidateGroup={invalidateData}
+      invalidateGroup={() => {}}
       defaultModelData={defaultModelData}
     >
       {univDriItems.map(rawModelData => (
@@ -60,7 +57,6 @@ function UniversityDri({ univId, univDriItems, api }) {
           rawModelData={rawModelData}
           formInfo={UniversityDriForm}
           CoreComponent={CoreComponent}
-          onSave={invalidateData}
         />
       ))}
     </ModuleGroupWrapper>

frontend/src/components/university/modules/UniversityGeneral.jsx

@@ -12,7 +12,7 @@ import ModuleWrapper from "./common/ModuleWrapper";
 
 import UniversityGeneralForm from "../forms/UniversityGeneralForm";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam

frontend/src/components/university/modules/UniversityOffers.jsx

@@ -9,7 +9,7 @@ import { makeStyles } from "@material-ui/styles";
 import Typography from "@material-ui/core/Typography";
 import Chip from "@material-ui/core/Chip";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import PaginatedData from "../../common/PaginatedData";
 import withNetworkWrapper, {
   getApiPropTypes,
@@ -146,7 +146,7 @@ function renderEl(dataEl) {
 const buildParams = (univId, page) =>
   RequestParams.Builder.withQueryParam("university", univId)
     .withQueryParam("page", page)
-    .withQueryParam("page_size", 1)
+    .withQueryParam("page_size", 3)
     .build();
 
 function UniversityOffers({ offers, api, univId, page, goToPage }) {

frontend/src/components/university/modules/UniversityScholarships.jsx

@@ -8,13 +8,12 @@ import ModuleGroupWrapper from "./common/ModuleGroupWrapper";
 import Scholarship from "./common/Scholarship";
 
 import UniversityScholarshipForm from "../forms/UniversityScholarshipForm";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withUnivInfo from "../../../hoc/withUnivInfo";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../hoc/withNetworkWrapper";
-import useInvalidateAll from "../../../hooks/useInvalidateAll";
 
 const useStyles = makeStyles(theme => ({
   item: {
@@ -49,7 +48,7 @@ CoreComponent.propTypes = {
   rawModelData: PropTypes.shape({
     comment: PropTypes.string,
     frequency: PropTypes.string,
-    currency: PropTypes.number,
+    currency: PropTypes.string,
     short_description: PropTypes.string,
     amount_min: PropTypes.number,
     amount_max: PropTypes.number,
@@ -68,8 +67,6 @@ function UniversityScholarships({ univId, api, univScholarshipsItems }) {
     api.univScholarshipsItems.setParams(buildParams(univId));
   }, [univId]);
 
-  const invalidateData = useInvalidateAll("universityDri");
-
   const defaultModelData = useMemo(
     () => ({
       universities: [univId],
@@ -84,7 +81,7 @@ function UniversityScholarships({ univId, api, univScholarshipsItems }) {
     <ModuleGroupWrapper
       groupTitle={"Bourses liées à l'université"}
       formInfo={UniversityScholarshipForm}
-      invalidateGroup={invalidateData}
+      invalidateGroup={() => {}} // todo set as optionnal
       defaultModelData={defaultModelData}
     >
       {univScholarshipsItems.map(rawModelData => (
@@ -94,7 +91,6 @@ function UniversityScholarships({ univId, api, univScholarshipsItems }) {
             rawModelData={rawModelData}
             formInfo={UniversityScholarshipForm}
             CoreComponent={CoreComponent}
-            onSave={invalidateData}
           />
         </div>
       ))}

frontend/src/components/university/modules/UniversitySemestersDates.jsx

@@ -18,7 +18,7 @@ import dateStrToStr from "../../../utils/dateStrToStr";
 
 import UniversitySemestersDatesForm from "../forms/UniversitySemestersDatesForm";
 import withUnivInfo from "../../../hoc/withUnivInfo";
-import RequestParams from "../../../redux/api/RequestParams";
+import RequestParams from "../../../utils/api/RequestParams";
 import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam

frontend/src/components/university/modules/common/ModuleGroupWrapper.jsx

@@ -9,9 +9,9 @@ import Divider from "@material-ui/core/Divider";
 import AddIcon from "@material-ui/icons/Add";
 import green from "@material-ui/core/colors/green";
 import makeStyles from "@material-ui/core/styles/makeStyles";
-import { getLatestReadDataFromStore } from "../../../../redux/api/utils";
 import useEditor from "../../../../hooks/useEditor";
 import FormInfo from "../../../../utils/editionRelated/FormInfo";
+import { getLatestApiReadData } from "../../../../hooks/usePersistentState";
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -48,8 +48,7 @@ function ModuleGroupWrapper({
     if (somethingWasSaved) invalidateGroup();
   });
 
-  const userCanPostTo = getLatestReadDataFromStore("userDataOne")
-    .owner_can_post_to;
+  const userCanPostTo = getLatestApiReadData("userData-one").owner_can_post_to;
   const disabled = userCanPostTo.indexOf(formInfo.route) < 0;
 
   return (

frontend/src/components/university/modules/common/Scholarship.jsx

@@ -4,8 +4,7 @@ import withStyles from "@material-ui/core/styles/withStyles";
 
 import Typography from "@material-ui/core/Typography";
 import Markdown from "../../../common/markdown/Markdown";
-import moneyConversion from "../../../../utils/convertAmountToEur";
-import getCurrencySymbol from "../../../../utils/getCurrencySymbol";
+import CurrencyService from "../../../../services/data/CurrencyService";
 
 const styles = theme => ({
   content: {
@@ -48,7 +47,7 @@ class Scholarship extends React.Component {
   }
 
   getSymbol() {
-    return getCurrencySymbol(this.props.currency);
+    return CurrencyService.getCurrencySymbol(this.props.currency);
   }
 
   getAmounts() {
@@ -83,7 +82,7 @@ class Scholarship extends React.Component {
 
   convertAmountToEur(amount) {
     const { currency } = this.props;
-    return moneyConversion(amount, currency);
+    return CurrencyService.convertAmountToEur(amount, currency);
   }
 
   renderFinancialAdvantage() {

frontend/src/components/university/modules/previousExchangeFeedback/edit/EditModuleCoursesFeedback.jsx

@@ -3,7 +3,7 @@ import PropTypes from "prop-types";
 import compose from "recompose/compose";
 import Typography from "@material-ui/core/Typography";
 import { makeStyles } from "@material-ui/styles";
-import RequestParams from "../../../../../redux/api/RequestParams";
+import RequestParams from "../../../../../utils/api/RequestParams";
 import CourseFeedbackForm from "./CourseFeedbackForm";
 import ModuleWrapper from "../../common/ModuleWrapper";
 import { CourseFeedbackCore } from "../CourseFeedback";
@@ -13,7 +13,8 @@ import withNetworkWrapper, {
   getApiPropTypes,
   NetWrapParam
 } from "../../../../../hoc/withNetworkWrapper";
-import useInvalidateAll from "../../../../../hooks/useInvalidateAll";
+
+import { useApiInvalidateAll } from "../../../../../hooks/wrappers/api";
 
 function CoreComponent({ rawModelData }) {
   const p = rawModelData;
@@ -64,10 +65,7 @@ function EditModuleCoursesFeedback({ courseFeedbacks, exchangeId, api }) {
   }, [exchangeId]);
 
   // also invalidate all to make sure all the site pages are consistent
-  const invalidateAll = useInvalidateAll(
-    "courseFeedbacks</