|
1 |
| -import React, {useEffect, useState} from 'react'; |
| 1 | +import React, {useEffect, useRef, useState} from 'react'; |
2 | 2 | import PropTypes from 'prop-types';
|
3 | 3 | import {omit} from 'ramda';
|
4 | 4 | import {Spinner as RSSpinner} from 'reactstrap';
|
@@ -26,13 +26,17 @@ const Spinner = props => {
|
26 | 26 | } = props;
|
27 | 27 |
|
28 | 28 | const [showSpinner, setShowSpinner] = useState(false);
|
| 29 | + const timer = useRef(); |
29 | 30 |
|
30 | 31 | useEffect(() => {
|
31 | 32 | if (loading_state) {
|
| 33 | + if (timer.current) { |
| 34 | + clearTimeout(timer.current); |
| 35 | + } |
32 | 36 | if (loading_state.is_loading && !showSpinner) {
|
33 | 37 | setShowSpinner(true);
|
34 | 38 | } else if (!loading_state.is_loading && showSpinner) {
|
35 |
| - setTimeout(() => setShowSpinner(false), debounce); |
| 39 | + timer.current = setTimeout(() => setShowSpinner(false), debounce); |
36 | 40 | }
|
37 | 41 | }
|
38 | 42 | }, [loading_state]);
|
@@ -180,8 +184,8 @@ Spinner.propTypes = {
|
180 | 184 | fullscreen: PropTypes.bool,
|
181 | 185 |
|
182 | 186 | /**
|
183 |
| - * When using the spinner as a loading spinner, add a time delay to the |
184 |
| - * spinner being removed to prevent flickering. |
| 187 | + * When using the spinner as a loading spinner, add a time delay (in ms) to |
| 188 | + * the spinner being removed to prevent flickering. |
185 | 189 | */
|
186 | 190 | debounce: PropTypes.number
|
187 | 191 | };
|
|
0 commit comments