1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
|
use std::sync::Arc;
use leptos::{
IntoView, component,
error::ErrorBoundary,
prelude::{
ClassAttribute, CollectView, ElementChild, Get, Read, ReadSignal, Set, With, signal,
},
reactive::spawn_local,
server::{LocalResource, Resource},
view,
};
use rocie_client::apis::{
api_get_product_api::{ProductsError, products},
configuration::Configuration,
};
#[component]
pub fn Home(config: Arc<Configuration>) -> impl IntoView {
let (read_status, write_status) = signal("Loading..".to_owned());
{
let local_config = Arc::clone(&config);
spawn_local(async move {
let products = products(&local_config).await;
write_status.set(
products
.as_ref()
.map(move |products| {
let products_num = products.len();
let plural_s = if products_num == 1 { "" } else { "s" };
let products_value = 2;
let products_currency = "EUR";
format!(
"You have {products_num} product{plural_s} \
in stock with a value \
of {products_value} {products_currency}.",
)
})
.unwrap(),
);
});
}
view! {
<ErrorBoundary fallback=|errors| {
view! {
<h1>"Uh oh! Something went wrong!"</h1>
<p>"Errors: "</p>
// Render a list of errors as strings - good for development purposes
<ul>
{move || {
errors
.get()
.into_iter()
.map(|(_, e)| view! { <li>{e.to_string()}</li> })
.collect_view()
}}
</ul>
}
}>
<nav>
<div class="nav">
<img
src="https://raw.githubusercontent.com/leptos-rs/leptos/main/docs/logos/Leptos_logo_RGB.svg"
alt="Rocie Logo"
height="200"
width="400"
/>
<h1>Rocie</h1>
</div>
</nav>
<div class="container">
<div class="container">
<h1>"Inventory"</h1>
<p>{read_status}</p>
</div>
<div class="container">
<h1>"Recipies"</h1>
</div>
<div class="container">
<h1>"Shopping list"</h1>
</div>
</div>
</ErrorBoundary>
}
}
|
