@react-ee/layout v0.2.10

@react-ee/layout

Provides Context which allows to show messages and loading indicator.

Installation

yarn add @react-ee/layout @material-ui/core @material-ui/icons react react-dom

Usage example

Wrap your app with Layout:

import { Layout } from '@react-ee/layout';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

ReactDOM.render(
  <Layout>
    <App />
  </Layout>,
  document.getElementById('root')
);

useLayout somewhere inside your app:

import useLayout from '@react-ee/layout';
import React, { useEffect } from 'react';

export default () => {
  const { incrementLoading, showSnackbar } = useLayout();
  useEffect(() => {
    incrementLoading();
    showSnackbar('WOW', 'success');
  }, [incrementLoading, showSnackbar]);
  return <>foo</>;
};

Common pitfalls

When invoking function acquired from useLayout takes no effect, you forgotten to wrap your app with <Layout />.

Treat <Layout /> as React Context and useLayout as useContext(Layout)