react-native-context-api

react-native-context-api

Controla o context-api do react

Installation

npm install react-native-context-api

Usage

import ContextAPI, { combineReducers } from 'react-native-context-api';
import { Store } from './interfaces';
import { systemProvider } from './stores/system';

const reducers = combineReducers({
    system: systemProvider
});
export const contextApi = new ContextAPI(reducers);

/**
 * Como Criar um uso de contexto com ContextAPI
 */
const useContextApi = (): Store => contextApi.useContext();
/**
 * Como criar um Provider ou Consumer que englobe toda a aplicação
 */
const Provider = contextApi.Provider;
const Consumer = contextApi.Consumer;

export { Provider, Consumer, useContextApi };

Store

import ContextAPI, { ActionProvider } from 'react-native-context-api';

const systemStore = {
    loading: true
};

export const systemProvider = (state = systemStore, action?: ActionProvider) => {
    return ContextAPI.providerResult(state, action);
};
export default systemStore;

Interface

import systemStore from './stores/system';
export interface DispatchParams {
    field: string;
    reducer: string;
    payload: any;
}
export interface Store {
    dispatch: (data: DispatchParams) => void;
    store: {
        system: typeof systemStore;
    };
}
export interface ContextDispatchAction<T> {
    reducer: T;
    field: string;
    payload: any;
}
export type StoresKeys = 'system';

Provider

function App(): JSX.Element {
    return (
        <NavigationContainer ref={navigationRef}>
            <Provider value={contextApi.providerValues}>
                {/*YOUR COMPONENT HERE*/}
            </Provider>
        </NavigationContainer>
    );
}
export default App;

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT