diff options
Diffstat (limited to 'openecomp-ui/src/nfvo-components/loader')
3 files changed, 82 insertions, 72 deletions
diff --git a/openecomp-ui/src/nfvo-components/loader/Loader.jsx b/openecomp-ui/src/nfvo-components/loader/Loader.jsx index 9ebe52dcfc..076351bf7a 100644 --- a/openecomp-ui/src/nfvo-components/loader/Loader.jsx +++ b/openecomp-ui/src/nfvo-components/loader/Loader.jsx @@ -16,40 +16,39 @@ import React from 'react'; import PropTypes from 'prop-types'; -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; -const mapStateToProps = ({loader}) => { - return { - isLoading: loader.isLoading - }; +const mapStateToProps = ({ loader }) => { + return { + isLoading: loader.isLoading + }; }; class Loader extends React.Component { - - static propTypes = { - isLoading: PropTypes.bool.isRequired - }; - - static defaultProps = { - isLoading: false - }; - - shouldComponentUpdate(nextProps) { - return (nextProps.isLoading !== this.props.isLoading); - } - - render() { - let {isLoading} = this.props; - return ( - <div className='onboarding-loader'> - { - isLoading && <div className='onboarding-loader-backdrop'> - <div className='tlv-loader large'></div> - </div> - } - </div> - ); - } + static propTypes = { + isLoading: PropTypes.bool.isRequired + }; + + static defaultProps = { + isLoading: false + }; + + shouldComponentUpdate(nextProps) { + return nextProps.isLoading !== this.props.isLoading; + } + + render() { + let { isLoading } = this.props; + return ( + <div className="onboarding-loader"> + {isLoading && ( + <div className="onboarding-loader-backdrop"> + <div className="tlv-loader large" /> + </div> + )} + </div> + ); + } } -export default connect(mapStateToProps) (Loader); +export default connect(mapStateToProps)(Loader); diff --git a/openecomp-ui/src/nfvo-components/loader/LoaderConstants.js b/openecomp-ui/src/nfvo-components/loader/LoaderConstants.js index 2b531b08fa..e367a74352 100644 --- a/openecomp-ui/src/nfvo-components/loader/LoaderConstants.js +++ b/openecomp-ui/src/nfvo-components/loader/LoaderConstants.js @@ -16,9 +16,9 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionTypes = keyMirror({ - SHOW: null, - HIDE: null, + SHOW: null, + HIDE: null, - SEND_REQUEST: null, - RECEIVE_RESPONSE: null + SEND_REQUEST: null, + RECEIVE_RESPONSE: null }); diff --git a/openecomp-ui/src/nfvo-components/loader/LoaderReducer.js b/openecomp-ui/src/nfvo-components/loader/LoaderReducer.js index 3afdad0573..1d0f6790e1 100644 --- a/openecomp-ui/src/nfvo-components/loader/LoaderReducer.js +++ b/openecomp-ui/src/nfvo-components/loader/LoaderReducer.js @@ -13,43 +13,54 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import {actionTypes} from './LoaderConstants.js'; +import { actionTypes } from './LoaderConstants.js'; -export default (state = {fetchingRequests : 0, currentlyFetching : [], isLoading : false}, action) => { - let fetchingRequests = state.fetchingRequests; - let newArray; - switch (action.type) { - case actionTypes.SEND_REQUEST: - fetchingRequests++; - newArray = state.currentlyFetching.slice(); - newArray.splice(0, 0, action.url); - if (DEBUG) { - console.log('Loader SEND REQUEST url: ' + action.url); - console.log('Loader SEND REQUEST number of fetching requests: ' + fetchingRequests); - } - return { - fetchingRequests: fetchingRequests, - currentlyFetching : newArray, - isLoading: true - }; - case actionTypes.RECEIVE_RESPONSE: - fetchingRequests--; +export default ( + state = { fetchingRequests: 0, currentlyFetching: [], isLoading: false }, + action +) => { + let fetchingRequests = state.fetchingRequests; + let newArray; + switch (action.type) { + case actionTypes.SEND_REQUEST: + fetchingRequests++; + newArray = state.currentlyFetching.slice(); + newArray.splice(0, 0, action.url); + if (DEBUG) { + console.log('Loader SEND REQUEST url: ' + action.url); + console.log( + 'Loader SEND REQUEST number of fetching requests: ' + + fetchingRequests + ); + } + return { + fetchingRequests: fetchingRequests, + currentlyFetching: newArray, + isLoading: true + }; + case actionTypes.RECEIVE_RESPONSE: + fetchingRequests--; - newArray = state.currentlyFetching.filter((item) => {return item !== action.url;}); - if (DEBUG) { - console.log('Loader RECEIVE_RESPONSE url: ' + action.url); - console.log('Loader RECEIVE_RESPONSE: number of fetching requests: ' + fetchingRequests); - } - return { - currentlyFetching : newArray, - fetchingRequests: fetchingRequests, - isLoading: (fetchingRequests !== 0) - }; - case actionTypes.SHOW: - return {isLoading: true}; - case actionTypes.HIDE: - return {isLoading: false}; - default: - return state; - } + newArray = state.currentlyFetching.filter(item => { + return item !== action.url; + }); + if (DEBUG) { + console.log('Loader RECEIVE_RESPONSE url: ' + action.url); + console.log( + 'Loader RECEIVE_RESPONSE: number of fetching requests: ' + + fetchingRequests + ); + } + return { + currentlyFetching: newArray, + fetchingRequests: fetchingRequests, + isLoading: fetchingRequests !== 0 + }; + case actionTypes.SHOW: + return { isLoading: true }; + case actionTypes.HIDE: + return { isLoading: false }; + default: + return state; + } }; |