Merge pull request #18 from Permissionless-Software-Foundation/ct-menu-order

Changing order of menu items
This commit is contained in:
Chris Troutner
2020-07-01 19:27:00 -07:00
committed by GitHub
+92 -73
View File
@@ -25,8 +25,8 @@ const MENU_HIDE_WIDTH = 770
let _this
const MenuItemComponent = ({ component }) => {
const RenderedComponent = loadable(() => import("./audit"))
return (<RenderedComponent />)
const RenderedComponent = loadable(() => import("./audit"))
return <RenderedComponent />
}
class AdminLTEPage extends React.Component {
@@ -44,85 +44,105 @@ class AdminLTEPage extends React.Component {
}
sidebar = [
<Item icon="fa-wallet" key="Wallet" text="Wallet" activeOn="/" />,
<Item icon="fas-coins" key="Tokens" text="Tokens" />,
<Item icon="fa-qrcode" key="qrReader" text="Qr Scanner" />,
<Item icon="fas-cog" key="Configure" text="Configure" />,
<Item icon="fa-exchange-alt" key="SendReceive" text="Send/Receive" />,
<Item icon="fas-coins" key="Tokens" text="Tokens" />,
<Item icon="fa-wallet" key="Wallet" text="Wallet" activeOn="/" />,
<Item icon="fa-qrcode" key="qrReader" text="Qr Scanner" />,
<Item icon="fas-cog" key="Configure" text="Configure" />
]
render() {
return (
<StaticQuery
query={graphql`
query {
bchWalletPlugins {
menuItems {
title
component
icon
}
}
}`}
render={data =>
<>
<AdminLTE title={["FullStack.cash"]} titleShort={["PSF"]} theme="blue">
<Sidebar.Core>
<Item key="Balance" text="Balance" icon="fab-bitcoin">
<div className="sidebar-balance">
<div>
<h3>BCH Balance </h3>
query {
bchWalletPlugins {
menuItems {
title
component
icon
}
}
}
`}
render={data => (
<>
<AdminLTE
title={["FullStack.cash"]}
titleShort={["PSF"]}
theme="blue"
>
<Sidebar.Core>
<Item key="Balance" text="Balance" icon="fab-bitcoin">
<div className="sidebar-balance">
<div>
<h3>BCH Balance </h3>
<p>{_this.state.bchBalance}</p>
</div>
</div>
</Item>
{_this.sidebar}
{data.bchWalletPlugins.menuItems.map(item => <Item icon={item.icon} key={item.title} text={item.title} />)}
</Sidebar.Core>
<Navbar.Core>
<VersionStatus></VersionStatus>
</Navbar.Core>
<Layout path="/">
<div className="components-container">
{_this.state.section === "Wallet" && (
<Wallet
setWalletInfo={_this.props.setWalletInfo}
walletInfo={_this.props.walletInfo}
updateBalance={_this.props.updateBalance}
setBchWallet={_this.props.setBchWallet}
/>
)}
{_this.state.section === "Tokens" &&
<Tokens
walletInfo={_this.props.walletInfo}
bchWallet={_this.props.bchWallet} />
}
{_this.state.section === "Configure" && (
<Configure
walletInfo={_this.props.walletInfo}
setWalletInfo={_this.props.setWalletInfo}
setBchWallet={_this.props.setBchWallet}
/>
)}
{data.bchWalletPlugins.menuItems.map(item =>
_this.state.section === item.title && <MenuItemComponent component={item.component} />
)}
<p>{_this.state.bchBalance}</p>
</div>
</Layout>
</AdminLTE>
<Router>
<ScannerModal
show={_this.state.showScannerModal}
onHide={_this.toggleScannerModal}
path="/"
/>
</Router>
</>
}/>
</div>
</Item>
{_this.sidebar}
{data.bchWalletPlugins.menuItems.map(item => (
<Item icon={item.icon} key={item.title} text={item.title} />
))}
</Sidebar.Core>
<Navbar.Core>
<VersionStatus></VersionStatus>
</Navbar.Core>
<Layout path="/">
<div className="components-container">
{_this.state.section === "Send/Receive" && (
<SendReceive
setWalletInfo={_this.props.setWalletInfo}
walletInfo={_this.props.walletInfo}
updateBalance={_this.props.updateBalance}
setBchWallet={_this.props.setBchWallet}
bchWallet={_this.props.bchWallet}
/>
)}
{_this.state.section === "Tokens" && (
<Tokens
walletInfo={_this.props.walletInfo}
bchWallet={_this.props.bchWallet}
/>
)}
{_this.state.section === "Wallet" && (
<Wallet
setWalletInfo={_this.props.setWalletInfo}
walletInfo={_this.props.walletInfo}
updateBalance={_this.props.updateBalance}
setBchWallet={_this.props.setBchWallet}
/>
)}
{_this.state.section === "Configure" && (
<Configure
walletInfo={_this.props.walletInfo}
setWalletInfo={_this.props.setWalletInfo}
setBchWallet={_this.props.setBchWallet}
/>
)}
{data.bchWalletPlugins.menuItems.map(
item =>
_this.state.section === item.title && (
<MenuItemComponent component={item.component} />
)
)}
</div>
</Layout>
</AdminLTE>
<Router>
<ScannerModal
show={_this.state.showScannerModal}
onHide={_this.toggleScannerModal}
path="/"
/>
</Router>
</>
)}
/>
)
}
// Get wallet balance
@@ -130,7 +150,6 @@ class AdminLTEPage extends React.Component {
try {
const { mnemonic } = _this.props.walletInfo
if (mnemonic && _this.props.bchWallet) {
const bchWalletLib = _this.props.bchWallet
await bchWalletLib.walletInfoPromise
@@ -273,7 +292,7 @@ AdminLTEPage.propTypes = {
setWalletInfo: PropTypes.func.isRequired, // set wallet info
updateBalance: PropTypes.func.isRequired, // update bch balance
setBchWallet: PropTypes.func.isRequired, // set minimal-slp-wallet instance
bchWallet:PropTypes.object, // get minimal-slp-wallet instance
bchWallet: PropTypes.object, // get minimal-slp-wallet instance
}
export default AdminLTEPage