All Projects → guilouro → redux-global-loader

guilouro / redux-global-loader

Licence: other
A Redux middleware for global loader

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to redux-global-loader

Vue Loaders
Vue + loaders.css
Stars: ✭ 127 (+876.92%)
Mutual labels:  loader, loading
Is Loading
Simple library to show visual feedback when loading data or any action that would take time
Stars: ✭ 232 (+1684.62%)
Mutual labels:  loader, loading
React Content Loader
⚪ SVG-Powered component to easily create skeleton loadings.
Stars: ✭ 11,830 (+90900%)
Mutual labels:  loader, loading
Fiftyshadesof
An elegant context-care loading placeholder for Android
Stars: ✭ 1,110 (+8438.46%)
Mutual labels:  loader, loading
SSSwiftUISpinnerButton
SSSwiftUISpinnerButton is a collection of various spinning animations for buttons in SwiftUI.
Stars: ✭ 37 (+184.62%)
Mutual labels:  loader, loading
Mkloader
Beautiful and smooth custom loading views
Stars: ✭ 1,377 (+10492.31%)
Mutual labels:  loader, loading
Vue Wait
Complex Loader and Progress Management for Vue/Vuex and Nuxt Applications
Stars: ✭ 1,869 (+14276.92%)
Mutual labels:  loader, loading
Create Content Loader
✏️ Tool to create your own react-content-loader easily.
Stars: ✭ 937 (+7107.69%)
Mutual labels:  loader, loading
spinners-angular
Lightweight SVG/CSS spinners for Angular
Stars: ✭ 21 (+61.54%)
Mutual labels:  loader, loading
Spinners React
Lightweight SVG/CSS spinners for React
Stars: ✭ 254 (+1853.85%)
Mutual labels:  loader, loading
Css Spinner
small, elegant pure css spinner for ajax or loading animation
Stars: ✭ 1,013 (+7692.31%)
Mutual labels:  loader, loading
ngx-loader-indicator
Awesome loader for angular applications. No wrappers only you elements
Stars: ✭ 44 (+238.46%)
Mutual labels:  loader, loading
Loading
loading...正在加载中的动画效果
Stars: ✭ 36 (+176.92%)
Mutual labels:  loader, loading
Eclipseloading
🌞 日食加载动画
Stars: ✭ 114 (+776.92%)
Mutual labels:  loader, loading
Awloader
AWLoader is a UI Component that allows you to integrate loader that fits your needs within your app.
Stars: ✭ 11 (-15.38%)
Mutual labels:  loader, loading
Ng Block Ui
Block UI Loader/Spinner for Angular
Stars: ✭ 135 (+938.46%)
Mutual labels:  loader, loading
Vue Loading Overlay
Vue.js component for full screen loading indicator 🌀
Stars: ✭ 784 (+5930.77%)
Mutual labels:  loader, loading
Statefullayout
Android layout to show template for loading, empty, error etc. states
Stars: ✭ 813 (+6153.85%)
Mutual labels:  loader, loading
Vue Element Loading
⏳ Loading inside a container or full screen for Vue.js
Stars: ✭ 234 (+1700%)
Mutual labels:  loader, loading
vue-loading
Loading bar for Vue.js apps using axios
Stars: ✭ 19 (+46.15%)
Mutual labels:  loader, loading

Redux Global Loader

Build Status Coverage Status

Obs: Redux Promise Middleware is required

A redux middleware with redux-promise-middleware's integration that shows the Loading while there is one or more than one pending promises in the current page. The loading state will be hidden as soon as all Promises gets completed.

Installation

Install with npm

$ npm install --save redux-global-loader

Import the middleware and include it after promiseMiddleware() in your applyMiddleware

import { globalLoaderMiddleware }  from 'redux-global-loader';

composeStoreWithMiddleware = applyMiddleware(
    ...
    promiseMiddleware(),
    globalLoaderMiddleware,
    ...
)(createStore);

Import the reducer loadingAll and include it in the combineReducers

import { combineReducers } from 'redux';
import { loadingAll } from 'redux-global-loader';

...
combineReducers({
    ...
    loadingAll,
    ...
});
...

Usage

import { Loading }  from 'redux-global-loader';

...
render() {
    return (
        <Loading>
            ...
            // Your loading component here
            ...
        </Loading>
    );
}
...

Contributing

If you want to contribute with this component: Contributing Documentation.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].