include new dashboard elements
This commit is contained in:
parent
cd31780e96
commit
eb129a3426
@ -4,10 +4,8 @@ import {CurrencyPair, FirstConnectMessage, NewEventMessage, NewTickMessage, Posi
|
|||||||
import {socket} from "../index";
|
import {socket} from "../index";
|
||||||
import {symbolToPair} from "../utils";
|
import {symbolToPair} from "../utils";
|
||||||
import {Helmet} from "react-helmet";
|
import {Helmet} from "react-helmet";
|
||||||
import {Navbar} from "./Navbars";
|
import {Navbar, Sidebar} from "./Navbars";
|
||||||
import {SidebarCard} from "./HCard";
|
import {Statusbar} from "./Statusbar";
|
||||||
import {ClockIcon, DollarIcon} from "./Icons";
|
|
||||||
import RPlot from "./RPlot";
|
|
||||||
|
|
||||||
type AppState = {
|
type AppState = {
|
||||||
current_price: number,
|
current_price: number,
|
||||||
@ -68,9 +66,9 @@ class App extends Component<{}, AppState> {
|
|||||||
|
|
||||||
this.event_id += 1
|
this.event_id += 1
|
||||||
|
|
||||||
this.setState({
|
this.setState((state) => ({
|
||||||
events: [...this.state.events, new_event]
|
events: [...state.events, new_event]
|
||||||
})
|
}))
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -83,29 +81,29 @@ class App extends Component<{}, AppState> {
|
|||||||
- {String(this.state.active_pair.base) + "/" + String(this.state.active_pair.quote)} {String(this.state.current_price)} </title>
|
- {String(this.state.active_pair.base) + "/" + String(this.state.active_pair.quote)} {String(this.state.current_price)} </title>
|
||||||
</Helmet>
|
</Helmet>
|
||||||
<div className="bg-gray-800">
|
<div className="bg-gray-800">
|
||||||
<div className="h-screen max-w-screen-2xl flex mx-auto">
|
<div className="h-screen max-w-screen flex mx-auto">
|
||||||
<Navbar/>
|
<Navbar/>
|
||||||
<main
|
<main
|
||||||
className="my-1 pt-2 pb-2 px-10 flex-1 bg-gray-200 dark:bg-black rounded-l-lg*
|
className="my-1 py-2 px-10 flex-1 bg-gray-200 dark:bg-black rounded-l-lg*
|
||||||
transition duration-500 ease-in-out overflow-y-auto flex flex-col">
|
transition duration-500 ease-in-out overflow-y-auto flex flex-col">
|
||||||
<div className="flex justify-center text-2xl my-4">
|
<div className="flex justify-center text-2xl my-4">
|
||||||
<SidebarCard logo={<DollarIcon width={10} height={10}/>} title={""}
|
<Statusbar positions={this.state.positions} price={this.state.current_price}
|
||||||
content={"$" + this.state.current_price.toFixed(2).toString()}/>
|
tick={this.state.current_tick}/>
|
||||||
<SidebarCard logo={<ClockIcon width={10} height={10}/>} title={""}
|
|
||||||
content={this.state.current_tick.toString()}/>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex flex-col flex-grow mx-3 my-8 shadow-md hover:shadow-lg">
|
<div className="flex flex-col flex-grow my-8 shadow-md hover:shadow-lg">
|
||||||
<div
|
<div
|
||||||
className="py-2 flex-grow bg-white dark:bg-gray-600 rounded-lg">
|
className="py-2 flex-grow bg-white dark:bg-gray-600 rounded-lg">
|
||||||
<RPlot/>
|
{/*<RPlot/>*/}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer className="flex rounded-lg justify-center bg-gray-600 mt-4 border-t text-gray-300">
|
|
||||||
<span className="my-1 mx-1">Made with ❤️ by the Peperone in a scantinato</span>
|
{/*<footer className="flex rounded-lg justify-center bg-gray-600 mt-4 border-t text-gray-300">*/}
|
||||||
</footer>
|
{/* <span className="my-1 mx-1">Made with ❤️ by the Peperone in a scantinato</span>*/}
|
||||||
|
{/*</footer>*/}
|
||||||
</main>
|
</main>
|
||||||
|
<Sidebar tick={1} price={1} positions={[]}/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
Loading…
Reference in New Issue
Block a user