Initial rebuild of position size calculator #37
@ -13,6 +13,7 @@ pub mod blog {
|
|||||||
|
|
||||||
pub mod display {
|
pub mod display {
|
||||||
pub mod bar_chart;
|
pub mod bar_chart;
|
||||||
|
pub mod client_only;
|
||||||
pub mod clipboard;
|
pub mod clipboard;
|
||||||
pub mod tooltip;
|
pub mod tooltip;
|
||||||
}
|
}
|
||||||
|
29
src/components/display/client_only.rs
Normal file
29
src/components/display/client_only.rs
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
use yew::{function_component, html, use_state, Children, Html, Properties};
|
||||||
|
use yew_hooks::use_effect_once;
|
||||||
|
|
||||||
|
#[derive(Properties, PartialEq)]
|
||||||
|
pub struct ClientOnlyProps {
|
||||||
|
#[prop_or_default]
|
||||||
|
pub children: Children,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[function_component(ClientOnly)]
|
||||||
|
pub fn client_only(props: &ClientOnlyProps) -> Html {
|
||||||
|
let loaded = use_state(|| false);
|
||||||
|
|
||||||
|
{
|
||||||
|
let loaded = loaded.clone();
|
||||||
|
use_effect_once(move || {
|
||||||
|
loaded.set(true);
|
||||||
|
|| {}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if !*loaded {
|
||||||
|
html! {}
|
||||||
|
} else {
|
||||||
|
html! {
|
||||||
|
<>{props.children.clone()}</>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
@ -7,7 +7,10 @@ use yew_hooks::{use_async, UseAsyncHandle};
|
|||||||
|
|
||||||
use crate::{
|
use crate::{
|
||||||
components::{
|
components::{
|
||||||
display::tooltip::{Tooltip, TooltipPosition},
|
display::{
|
||||||
|
client_only::ClientOnly,
|
||||||
|
tooltip::{Tooltip, TooltipPosition},
|
||||||
|
},
|
||||||
fields::{
|
fields::{
|
||||||
currency::CurrencySelect,
|
currency::CurrencySelect,
|
||||||
label::Label,
|
label::Label,
|
||||||
@ -1340,18 +1343,20 @@ pub fn page() -> Html {
|
|||||||
html! {
|
html! {
|
||||||
<AccountProvider>
|
<AccountProvider>
|
||||||
<PositionProvider>
|
<PositionProvider>
|
||||||
<div class="container mx-auto my-8">
|
<ClientOnly>
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
<div class="container mx-auto my-8">
|
||||||
<AccountInfo />
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||||
<PositionInfo />
|
<AccountInfo />
|
||||||
|
<PositionInfo />
|
||||||
|
</div>
|
||||||
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 mt-8">
|
||||||
|
<ReportPositionSize />
|
||||||
|
<ReportStopLoss />
|
||||||
|
<ReportTakeProfit />
|
||||||
|
<ReportPlannedStopLoss />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 mt-8">
|
</ClientOnly>
|
||||||
<ReportPositionSize />
|
|
||||||
<ReportStopLoss />
|
|
||||||
<ReportTakeProfit />
|
|
||||||
<ReportPlannedStopLoss />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</PositionProvider>
|
</PositionProvider>
|
||||||
</AccountProvider>
|
</AccountProvider>
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user