diff --git a/packages/strapi-admin/admin/src/translations/en.json b/packages/strapi-admin/admin/src/translations/en.json index a8b948af6b..d797736785 100644 --- a/packages/strapi-admin/admin/src/translations/en.json +++ b/packages/strapi-admin/admin/src/translations/en.json @@ -121,7 +121,9 @@ "components.Input.error.validation.required": "This value is required.", "components.ListRow.empty": "There is no data to be shown.", "components.OverlayBlocker.description": "You're using a feature that needs the server to restart. Please wait until the server is up.", + "components.OverlayBlocker.description.serverError": "The server should have restarted, please check your logs in the terminal.", "components.OverlayBlocker.title": "Waiting for restart...", + "components.OverlayBlocker.title.serverError": "The restart takes longer than expected", "components.PageFooter.select": "entries per page", "components.ProductionBlocker.description": "For safety purposes we have to disable this plugin in other environments.", "components.ProductionBlocker.header": "This plugin is only available in development.", diff --git a/packages/strapi-admin/admin/src/translations/fr.json b/packages/strapi-admin/admin/src/translations/fr.json index 111f504adb..da9a869f29 100644 --- a/packages/strapi-admin/admin/src/translations/fr.json +++ b/packages/strapi-admin/admin/src/translations/fr.json @@ -122,7 +122,9 @@ "components.Input.error.validation.required": "Ce champ est obligatoire.", "components.ListRow.empty": "Il n'y a pas de données à afficher.", "components.OverlayBlocker.description": "Vous utilisez une fonctionnalité qui nécessite le redémarrage du server. Merci d'attendre que celui-ci ait redémarré.", + "components.OverlayBlocker.description.serverError": "Le serveur aurait déjà du redémarrer, vous devriez regarder les messages dans le terminal.", "components.OverlayBlocker.title": "Le serveur est en train de redémarrer", + "components.OverlayBlocker.title.serverError": "Le serveur aurait déjà du redémarrer", "components.PageFooter.select": "entrées par page", "components.ProductionBlocker.description": "Pour des raisons de sécurité il est désactivé dans les autres environnements.", "components.ProductionBlocker.header": "Ce plugin est disponible uniquement en développement.", diff --git a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/index.js b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/index.js index 36623534aa..913ebbc47b 100644 --- a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/index.js +++ b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/index.js @@ -12,27 +12,78 @@ import cn from 'classnames'; import styles from './styles.scss'; +const DELAY = 1000; + class OverlayBlocker extends React.Component { constructor(props) { super(props); + this.state = { elapsed: 0, start: 0 }; this.overlayContainer = document.createElement('div'); document.body.appendChild(this.overlayContainer); } + componentDidUpdate(prevProps) { + const { isOpen } = this.props; + + if (prevProps.isOpen !== this.props.isOpen && isOpen) { + this.startTimer(); + } + + if (prevProps.isOpen !== isOpen && !isOpen) { + this.stopTimer(); + } + } + componentWillUnmount() { document.body.removeChild(this.overlayContainer); } + tick = () => { + const { elapsed } = this.state; + + if (elapsed > 15) { + clearInterval(this.timer); + + return; + } + + this.setState(prevState => ({ elapsed: (Math.round(Date.now() - prevState.start) / 1000) })); + } + + startTimer = () => { + this.setState({ start: Date.now() }); + this.timer = setInterval(this.tick, DELAY); + } + + stopTimer = () => { + this.setState({ elapsed: 0 }); + clearInterval(this.timer); + } + render() { - const { title, description, icon } = this.props; + let { title, description, icon } = this.props; + const { elapsed } = this.state; + + let button = ( +
+ Read the documentation +
+ ); + + if (elapsed > 15) { + button = null; + icon = 'fa fa-clock-o'; + description = 'components.OverlayBlocker.description.serverError'; + title = 'components.OverlayBlocker.title.serverError'; + } const content = this.props.children ? ( this.props.children ) : (
-
+
@@ -42,9 +93,7 @@ class OverlayBlocker extends React.Component {

-
- Read the documentation -
+ {button}
); @@ -65,7 +114,7 @@ class OverlayBlocker extends React.Component { } OverlayBlocker.defaultProps = { - children: '', + children: null, description: 'components.OverlayBlocker.description', icon: 'fa fa-refresh', isOpen: false, diff --git a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/styles.scss b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/styles.scss index e365f100cf..5cbda16d99 100644 --- a/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/styles.scss +++ b/packages/strapi-helper-plugin/lib/src/components/OverlayBlocker/styles.scss @@ -23,6 +23,9 @@ color: #323740; margin-right: 20px; line-height: 9.3rem; +} + +.spin { > i { -webkit-animation:spin 4s linear infinite; -moz-animation:spin 4s linear infinite;