This commit is contained in:
Chris Troutner
2022-07-03 11:35:47 -07:00
parent 30df1bf59a
commit 30281b9108
5 changed files with 35 additions and 36 deletions
+2 -3
View File
@@ -14,7 +14,6 @@ import WaitingModal from './components/waiting-modal'
import AsyncLoad from './services/async-load' import AsyncLoad from './services/async-load'
import ServerSelect from './components/servers' import ServerSelect from './components/servers'
import Footer from './components/footer' import Footer from './components/footer'
import GetBalance from './components/balance'
import NavMenu from './components/nav-menu' import NavMenu from './components/nav-menu'
import AppBody from './components/app-body' import AppBody from './components/app-body'
@@ -81,7 +80,7 @@ class App extends React.Component {
<> <>
<GetRestUrl /> <GetRestUrl />
<LoadScripts /> <LoadScripts />
<NavMenu menuHandler={this.handleMenuClick}/> <NavMenu menuHandler={this.onMenuClick} />
{this.state.walletInitialized ? <InitializedView wallet={this.state.wallet} menuState={this.state.menuState} /> : <UninitializedView modalBody={this.state.modalBody} hideSpinner={this.state.hideSpinner} />} {this.state.walletInitialized ? <InitializedView wallet={this.state.wallet} menuState={this.state.menuState} /> : <UninitializedView modalBody={this.state.modalBody} hideSpinner={this.state.hideSpinner} />}
<ServerSelect /> <ServerSelect />
<Footer /> <Footer />
@@ -101,7 +100,7 @@ class App extends React.Component {
// This handler is passed into the child menu component. When an item in the // This handler is passed into the child menu component. When an item in the
// nav menu is clicked, this handler will update the state. The state is // nav menu is clicked, this handler will update the state. The state is
// used by the AppBody component to determine which View component to display. // used by the AppBody component to determine which View component to display.
handleMenuClick(menuState) { onMenuClick (menuState) {
// console.log('menuState: ', menuState) // console.log('menuState: ', menuState)
_this.setState({ _this.setState({
-2
View File
@@ -44,10 +44,8 @@ class AppBody extends React.Component {
switch (menuState) { switch (menuState) {
case 0: case 0:
return (<GetBalance wallet={_this.state.wallet} />) return (<GetBalance wallet={_this.state.wallet} />)
break
case 1: case 1:
return (<TakePicture />) return (<TakePicture />)
break
default: default:
return (<GetBalance wallet={_this.state.wallet} />) return (<GetBalance wallet={_this.state.wallet} />)
} }
+2 -2
View File
@@ -34,7 +34,7 @@ class GetBalance extends React.Component {
<Form.Control type='text' placeholder='bitcoincash:qqlrzp23w08434twmvr4fxw672whkjy0py26r63g3d' onChange={e => this.setState({ textInput: e.target.value })} /> <Form.Control type='text' placeholder='bitcoincash:qqlrzp23w08434twmvr4fxw672whkjy0py26r63g3d' onChange={e => this.setState({ textInput: e.target.value })} />
</Form.Group> </Form.Group>
<Button variant='primary' onClick={this.getBalance}> <Button variant='primary' onClick={this.handleGetBalance}>
Check Balance Check Balance
</Button> </Button>
</Form> </Form>
@@ -51,7 +51,7 @@ class GetBalance extends React.Component {
) )
} }
async getBalance(event) { async handleGetBalance (event) {
try { try {
const textInput = _this.state.textInput const textInput = _this.state.textInput
+10 -10
View File
@@ -7,7 +7,7 @@
// Global npm libraries // Global npm libraries
import React from 'react' import React from 'react'
import { Nav, Navbar, Image } from "react-bootstrap" import { Nav, Navbar, Image } from 'react-bootstrap'
import Logo from './psf-logo.png' import Logo from './psf-logo.png'
class NavMenu extends React.Component { class NavMenu extends React.Component {
@@ -28,18 +28,18 @@ class NavMenu extends React.Component {
return ( return (
<> <>
<Navbar collapseOnSelect expand="xxxl" bg="dark" variant="dark" style={{paddingRight: '20px'}} > <Navbar collapseOnSelect expand='xxxl' bg='dark' variant='dark' style={{ paddingRight: '20px' }}>
<Navbar.Brand href="#home" style={{paddingLeft: '20px'}}> <Navbar.Brand href='#home' style={{ paddingLeft: '20px' }}>
<Image src={Logo} thumbnail width="50" />{' '} <Image src={Logo} thumbnail width='50' />{' '}
PSF Web3 Demo PSF Web3 Demo
</Navbar.Brand> </Navbar.Brand>
<Navbar.Toggle aria-controls="responsive-navbar-nav" /> <Navbar.Toggle aria-controls='responsive-navbar-nav' />
<Navbar.Collapse id="responsive-navbar-nav"> <Navbar.Collapse id='responsive-navbar-nav'>
<Nav className="mr-auto"> <Nav className='mr-auto'>
<Nav.Link href="#" onClick={() => this.handleClickEvent(0)}>Check Balance</Nav.Link> <Nav.Link href='#' onClick={() => this.handleClickEvent(0)}>Check Balance</Nav.Link>
<Nav.Link href="#" onClick={() => this.handleClickEvent(1)}>Take Picture</Nav.Link> <Nav.Link href='#' onClick={() => this.handleClickEvent(1)}>Take Picture</Nav.Link>
<Nav.Link href="#">Placeholder 3</Nav.Link> <Nav.Link href='#'>Placeholder 3</Nav.Link>
</Nav> </Nav>
</Navbar.Collapse> </Navbar.Collapse>
</Navbar> </Navbar>
+2
View File
@@ -10,6 +10,8 @@ class TakePicture extends React.Component {
constructor (props) { constructor (props) {
super(props) super(props)
console.log('Take Picture component loaded')
// this.state = { // this.state = {
// activeView: 0, // activeView: 0,
// menuState: props.menuState // menuState: props.menuState