feat(error-modal): hookup ErrorModal in app layout
This commit is contained in:
parent
eaa0ca3f6a
commit
ead5a87858
|
@ -1,7 +1,9 @@
|
||||||
// @flow
|
// @flow
|
||||||
import React from 'react';
|
import React, { type Element } from 'react';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
|
|
||||||
|
import { ErrorModalComponent } from './error-modal';
|
||||||
|
|
||||||
const Layout = styled.div`
|
const Layout = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
@ -14,12 +16,25 @@ const Layout = styled.div`
|
||||||
`;
|
`;
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
chidren: any, // eslint-disable-line
|
children: Element<*>,
|
||||||
|
closeErrorModal: () => void,
|
||||||
|
isErrorModalVisible: boolean,
|
||||||
|
error: string,
|
||||||
};
|
};
|
||||||
|
|
||||||
export const LayoutComponent = (props: Props) => {
|
export const LayoutComponent = (props: Props) => {
|
||||||
// $FlowFixMe
|
const {
|
||||||
const { children } = props; // eslint-disable-line
|
children, error, isErrorModalVisible, closeErrorModal,
|
||||||
|
} = props;
|
||||||
|
|
||||||
return <Layout id='layout'>{children}</Layout>;
|
return (
|
||||||
|
<Layout id='layout'>
|
||||||
|
{children}
|
||||||
|
<ErrorModalComponent
|
||||||
|
message={error}
|
||||||
|
isVisible={isErrorModalVisible}
|
||||||
|
onRequestClose={closeErrorModal}
|
||||||
|
/>
|
||||||
|
</Layout>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -7,6 +7,7 @@ import thunk from 'redux-thunk';
|
||||||
import type { RouterHistory } from 'react-router-dom';
|
import type { RouterHistory } from 'react-router-dom';
|
||||||
|
|
||||||
import { createRootReducer } from './modules/reducer';
|
import { createRootReducer } from './modules/reducer';
|
||||||
|
import { errorHandler } from './errorHandler';
|
||||||
|
|
||||||
export const history: RouterHistory = createHashHistory();
|
export const history: RouterHistory = createHashHistory();
|
||||||
|
|
||||||
|
@ -14,7 +15,8 @@ const shouldEnableDevTools = (process.env.NODE_ENV !== 'production' || process.e
|
||||||
&& window.devToolsExtension;
|
&& window.devToolsExtension;
|
||||||
|
|
||||||
export const configureStore = (initialState: Object) => {
|
export const configureStore = (initialState: Object) => {
|
||||||
const middleware = applyMiddleware(thunk, routerMiddleware(history));
|
// $FlowFixMe
|
||||||
|
const middleware = applyMiddleware(thunk, routerMiddleware(history), errorHandler);
|
||||||
|
|
||||||
const enhancer = compose(
|
const enhancer = compose(
|
||||||
middleware,
|
middleware,
|
||||||
|
|
|
@ -15,7 +15,7 @@ import { ReceiveContainer } from '../containers/receive';
|
||||||
import { SettingsContainer } from '../containers/settings';
|
import { SettingsContainer } from '../containers/settings';
|
||||||
import { NotFoundView } from '../views/not-found';
|
import { NotFoundView } from '../views/not-found';
|
||||||
import { ConsoleView } from '../views/console';
|
import { ConsoleView } from '../views/console';
|
||||||
import { LayoutComponent } from '../components/layout';
|
import { AppContainer as LayoutComponent } from '../containers/app';
|
||||||
import { HeaderComponent } from '../components/header';
|
import { HeaderComponent } from '../components/header';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
|
|
Loading…
Reference in New Issue