122 lines
3.3 KiB
TypeScript
122 lines
3.3 KiB
TypeScript
import React, { Component } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import {
|
|
changeLanguage as dChangeLanguage,
|
|
changeNodeIntent as dChangeNodeIntent,
|
|
addCustomNode as dAddCustomNode,
|
|
removeCustomNode as dRemoveCustomNode,
|
|
addCustomNetwork as dAddCustomNetwork,
|
|
TChangeLanguage,
|
|
TChangeNodeIntent,
|
|
TAddCustomNode,
|
|
TRemoveCustomNode,
|
|
TAddCustomNetwork
|
|
} from 'actions/config';
|
|
import { TSetGasPriceField, setGasPriceField as dSetGasPriceField } from 'actions/transaction';
|
|
import { AlphaAgreement, Footer, Header } from 'components';
|
|
import { AppState } from 'reducers';
|
|
import Notifications from './Notifications';
|
|
import OfflineTab from './OfflineTab';
|
|
|
|
interface ReduxProps {
|
|
languageSelection: AppState['config']['languageSelection'];
|
|
node: AppState['config']['node'];
|
|
nodeSelection: AppState['config']['nodeSelection'];
|
|
isChangingNode: AppState['config']['isChangingNode'];
|
|
isOffline: AppState['config']['offline'];
|
|
customNodes: AppState['config']['customNodes'];
|
|
customNetworks: AppState['config']['customNetworks'];
|
|
latestBlock: AppState['config']['latestBlock'];
|
|
}
|
|
|
|
interface ActionProps {
|
|
changeLanguage: TChangeLanguage;
|
|
changeNodeIntent: TChangeNodeIntent;
|
|
addCustomNode: TAddCustomNode;
|
|
removeCustomNode: TRemoveCustomNode;
|
|
addCustomNetwork: TAddCustomNetwork;
|
|
setGasPriceField: TSetGasPriceField;
|
|
}
|
|
|
|
type Props = {
|
|
isUnavailableOffline?: boolean;
|
|
children: string | React.ReactElement<string> | React.ReactElement<string>[];
|
|
} & ReduxProps &
|
|
ActionProps;
|
|
|
|
class TabSection extends Component<Props, {}> {
|
|
public render() {
|
|
const {
|
|
isUnavailableOffline,
|
|
children,
|
|
// APP
|
|
node,
|
|
nodeSelection,
|
|
isChangingNode,
|
|
isOffline,
|
|
languageSelection,
|
|
customNodes,
|
|
customNetworks,
|
|
latestBlock,
|
|
setGasPriceField,
|
|
changeLanguage,
|
|
changeNodeIntent,
|
|
addCustomNode,
|
|
removeCustomNode,
|
|
addCustomNetwork
|
|
} = this.props;
|
|
|
|
const headerProps = {
|
|
languageSelection,
|
|
node,
|
|
nodeSelection,
|
|
isChangingNode,
|
|
isOffline,
|
|
customNodes,
|
|
customNetworks,
|
|
changeLanguage,
|
|
changeNodeIntent,
|
|
setGasPriceField,
|
|
addCustomNode,
|
|
removeCustomNode,
|
|
addCustomNetwork
|
|
};
|
|
|
|
return (
|
|
<div className="page-layout">
|
|
<main>
|
|
<Header {...headerProps} />
|
|
<div className="Tab container">
|
|
{isUnavailableOffline && isOffline ? <OfflineTab /> : children}
|
|
</div>
|
|
<Footer latestBlock={latestBlock} />
|
|
</main>
|
|
<Notifications />
|
|
<AlphaAgreement />
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
function mapStateToProps(state: AppState): ReduxProps {
|
|
return {
|
|
node: state.config.node,
|
|
nodeSelection: state.config.nodeSelection,
|
|
isChangingNode: state.config.isChangingNode,
|
|
isOffline: state.config.offline,
|
|
languageSelection: state.config.languageSelection,
|
|
customNodes: state.config.customNodes,
|
|
customNetworks: state.config.customNetworks,
|
|
latestBlock: state.config.latestBlock
|
|
};
|
|
}
|
|
|
|
export default connect(mapStateToProps, {
|
|
setGasPriceField: dSetGasPriceField,
|
|
changeLanguage: dChangeLanguage,
|
|
changeNodeIntent: dChangeNodeIntent,
|
|
addCustomNode: dAddCustomNode,
|
|
removeCustomNode: dRemoveCustomNode,
|
|
addCustomNetwork: dAddCustomNetwork
|
|
})(TabSection);
|