mirror of
https://github.com/fullstack-cash/fullstack-gatsby-theme-bch-wallet.git
synced 2026-09-22 01:02:06 -07:00
Merge pull request #3 from Permissionless-Software-Foundation/dh-settings-view
feat(settings): Added settings view
This commit is contained in:
Chris Troutner
@@ -12,3 +12,6 @@
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
#import-mnemonic{
|
||||
text-transform: lowercase;
|
||||
}
|
||||
@@ -2,7 +2,7 @@ import React from "react"
|
||||
import Audit from "./audit"
|
||||
import Configure from "./configure"
|
||||
import Icons from "./icons"
|
||||
import Portfolio from "./portfolio"
|
||||
import Settings from "./settings"
|
||||
|
||||
import AdminLTE, { Sidebar } from "adminlte-2-react"
|
||||
|
||||
@@ -21,7 +21,7 @@ class AdminLTEPage extends React.Component {
|
||||
}
|
||||
|
||||
sidebar = [
|
||||
<Item icon="fas-wallet" key="Portfolio" text="Portfolio" to="/Portfolio" />,
|
||||
<Item icon="fas-cogs" key="Portfolio" text="Settings" to="/Settings" />,
|
||||
<Item icon="fas-icons" key="Icons" text="Icons" to="/Icons" />,
|
||||
<Item icon="fas-cog" key="Configure" text="Configure" to="/Configure" />,
|
||||
<Item icon="fa-tablet-alt" key="Audit" text="Audit" to="/Audit" />,
|
||||
@@ -57,7 +57,7 @@ class AdminLTEPage extends React.Component {
|
||||
|
||||
{_this.sidebar}
|
||||
</Sidebar.Core>
|
||||
<Portfolio path="/Portfolio" />
|
||||
<Settings path="/Settings" />
|
||||
<Icons path="/Icons" />
|
||||
<Configure path="/Configure" />
|
||||
<Audit path="/Audit" />
|
||||
|
||||
@@ -1,97 +0,0 @@
|
||||
import React from "react"
|
||||
|
||||
import { Content, Row, Col, Box, Button } from "adminlte-2-react"
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
||||
|
||||
class Portfolio extends React.Component {
|
||||
state = {}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Content >
|
||||
<Row>
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"plus"} />
|
||||
<span>New Wallet</span>
|
||||
</h1>
|
||||
</Col>
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<Button
|
||||
text="Create Wallet"
|
||||
type="primary"
|
||||
className="btn-lg"
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
|
||||
<Row>
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"file-import"} />
|
||||
<span>Import Wallet</span>
|
||||
</h1>
|
||||
</Col>
|
||||
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<Button text="Import" type="primary" className="btn-lg" />
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
|
||||
<Row>
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"exclamation-triangle"} />
|
||||
<span>Webs Wallets</span>
|
||||
</h1>
|
||||
</Col>
|
||||
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<p>
|
||||
Bitcoin.com Mint is an open source, non-custodial web wallet
|
||||
supporting SLP and BCH. Web wallets offer user convenience,
|
||||
but storing large amounts of money on a web wallet is not
|
||||
recommended. Creating your own SLP tokens only costs a few
|
||||
cents worth of BCH.
|
||||
</p>
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
</Content>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Portfolio
|
||||
@@ -0,0 +1,41 @@
|
||||
import React from "react"
|
||||
|
||||
import { Row, Col, Box, Button } from "adminlte-2-react"
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
||||
class NewWallet extends React.Component {
|
||||
state = {}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Row>
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"plus"}
|
||||
/>
|
||||
<span>New Wallet</span>
|
||||
</h1>
|
||||
</Col>
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<Button
|
||||
text="Create Wallet"
|
||||
type="primary"
|
||||
className="btn-lg"
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default NewWallet
|
||||
@@ -0,0 +1,90 @@
|
||||
import React from "react"
|
||||
|
||||
import { Row, Col, Box, Button, Inputs } from "adminlte-2-react"
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
||||
const { Text } = Inputs
|
||||
|
||||
let _this
|
||||
class ImportWallet extends React.Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
|
||||
_this = this
|
||||
|
||||
this.state = {
|
||||
mnemonic: "",
|
||||
privateKey: "",
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Row className="">
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"file-import"}
|
||||
/>
|
||||
<span>Import Wallet</span>
|
||||
</h1>
|
||||
</Col>
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<Row className="flex justify-content-center">
|
||||
<Col sm={8}>
|
||||
<div>
|
||||
<Text
|
||||
id="import-mnemonic"
|
||||
name="mnemonic"
|
||||
placeholder="12 word mnemonic"
|
||||
label="12 word mnemonic"
|
||||
labelPosition="above"
|
||||
maxlength={12}
|
||||
onChange={_this.handleUpdate}
|
||||
/>
|
||||
<Text
|
||||
id="privateKey"
|
||||
name="privateKey"
|
||||
placeholder="Private Key"
|
||||
label="Private Key"
|
||||
labelPosition="above"
|
||||
onChange={_this.handleUpdate}
|
||||
/>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<Button text="Import" type="primary" className="btn-lg" />
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
componentDidMount(){
|
||||
// add max length property to mnemonic input
|
||||
document.getElementById("import-mnemonic").maxLength = "12";
|
||||
|
||||
}
|
||||
handleUpdate(event) {
|
||||
let value = event.target.value
|
||||
if (event.target.name === "mnemonic") {
|
||||
value = value.toLowerCase()
|
||||
}
|
||||
_this.setState({
|
||||
[event.target.name]: value,
|
||||
})
|
||||
//console.log(_this.state)
|
||||
}
|
||||
}
|
||||
|
||||
export default ImportWallet
|
||||
@@ -0,0 +1,24 @@
|
||||
import React from "react"
|
||||
|
||||
import { Content } from "adminlte-2-react"
|
||||
import ImportWallet from "./import"
|
||||
import NewWallet from "./create"
|
||||
import InfoWallets from "./info"
|
||||
|
||||
class Settings extends React.Component {
|
||||
state = {}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<Content>
|
||||
<NewWallet />
|
||||
<ImportWallet />
|
||||
<InfoWallets />
|
||||
</Content>
|
||||
</>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default Settings
|
||||
@@ -0,0 +1,45 @@
|
||||
import React from "react"
|
||||
|
||||
import { Row, Col, Box } from "adminlte-2-react"
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
|
||||
|
||||
class InfoWallets extends React.Component {
|
||||
state = {}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Row>
|
||||
<Col sm={2} />
|
||||
<Col sm={8}>
|
||||
<Box className="hover-shadow border-none mt-2">
|
||||
<Row>
|
||||
<Col sm={12} className="text-center">
|
||||
<h1>
|
||||
<FontAwesomeIcon
|
||||
className="title-icon"
|
||||
size="xs"
|
||||
icon={"exclamation-triangle"}
|
||||
/>
|
||||
<span>Webs Wallets</span>
|
||||
</h1>
|
||||
</Col>
|
||||
|
||||
<Col sm={12} className="text-center mt-2 mb-2">
|
||||
<p>
|
||||
Bitcoin.com Mint is an open source, non-custodial web wallet
|
||||
supporting SLP and BCH. Web wallets offer user convenience,
|
||||
but storing large amounts of money on a web wallet is not
|
||||
recommended. Creating your own SLP tokens only costs a few
|
||||
cents worth of BCH.
|
||||
</p>
|
||||
</Col>
|
||||
</Row>
|
||||
</Box>
|
||||
</Col>
|
||||
<Col sm={2} />
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default InfoWallets
|
||||
Reference in New Issue
Block a user