Commit c87bb441 authored by Florent Chehab's avatar Florent Chehab

fix(notification): notification on fetch failed

* A notification is displayed when fetch data failed through the CustomComponentForApi class
* Notifier Component added for one shot notifications

Fixes #22
parent 0e4c1aef
Pipeline #36632 passed with stages
in 5 minutes and 5 seconds
......@@ -2,6 +2,7 @@ import React, { Component } from "react";
import Loading from "./Loading";
import PropTypes from "prop-types";
import { successActionsWithReads, getLatestRead } from "../../redux/api/utils";
import Notifier from "./Notifier";
/**
* Custom react component to be used when called to the api are required to display data of the component.
......@@ -81,7 +82,14 @@ class CustomComponentForAPI extends Component {
// Override of the default react render behavior to wait for data to arrive.
// You should use `customRender` instead of `render` in your components.
if (this.checkPropsFailed()) {
return <p>Une erreur est survenue lors du téléchargement des données. Merci de recharger la page et si l'erreur persiste, merci de contacter les administrateurs du site.</p>;
return (
<>
<Notifier
message={"Une erreur est survenue sur le serveur. Merci de recharger le page."}
/>
<p>Une erreur est survenue lors du téléchargement des données. Merci de recharger la page et si l'erreur persiste, merci de contacter les administrateurs du site.</p>
</>
);
}
if (!this.allApiDataIsReady()) {
......@@ -335,7 +343,7 @@ class CustomComponentForAPI extends Component {
}
CustomComponentForAPI.propTypes = {
api: PropTypes.object.isRequired // should be given through redux connect of `mapDispatchToProps`
api: PropTypes.objectOf(PropTypes.func).isRequired, // should be given through redux connect of `mapDispatchToProps`
};
export default CustomComponentForAPI;
import React, { Component } from "react";
import { withSnackbar } from "notistack";
import PropTypes from "prop-types";
/**
* Dumb component to display a one shot notification:
* notification will be created as the component is added to the DOM.
*
* @class Notifier
* @extends {Component}
*/
class Notifier extends Component {
constructor(props) {
super(props);
props.enqueueSnackbar(props.message, props.options);
}
render() {
return <></>;
}
}
Notifier.defaultProps = {
options: { variant: "error", autoHideDuration: 5000 }
};
Notifier.propTypes = {
enqueueSnackbar: PropTypes.func.isRequired,
message: PropTypes.string.isRequired,
options: PropTypes.object,
};
export default withSnackbar(Notifier);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment