summary refs log tree commit diff stats
path: root/src/pages/inventory.rs
blob: e5ff6ae1c09454b803073af866c285fbf880732b (plain) (blame)
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
use leptos::{
    IntoView, component,
    prelude::{ClassAttribute, ElementChild},
    view,
};
use rocie_client::models::{Product, ProductAmount, Unit};

use crate::{
    api::{get_full_product_by_id, get_products},
    components::{async_fetch::AsyncFetch, site_header::SiteHeader},
};

#[component]
pub fn Inventory() -> impl IntoView {
    view! {
        <SiteHeader logo=icondata_io::IoArrowBack back_location="/" name="Inventory" />

        <ul class="flex flex-col p-2 m-2">
            {
                AsyncFetch! {
                    @map_error_in_producer
                    fetcher = get_products(),
                    producer = render_products,
                }
            }
        </ul>
    }
}

fn render_products(products: Vec<Product>) -> impl IntoView {
    products
        .into_iter()
        .map(|product| {
            AsyncFetch! {
                @map_error_in_producer
                fetcher = get_full_product_by_id(product.id),
                producer = format_full_product,
            }
        })
        .collect::<Vec<_>>()
}

fn format_full_product((product, amount, unit): (Product, ProductAmount, Unit)) -> impl IntoView {
    view! {
        <ul class="my-3">
            <li class="m-2">{product.name}</li>
            <li class="m-2">
                <span class="bg-gray-200 p-1 px-2 rounded-lg">
                    {format!("{} {}", amount.amount.value, unit.short_name)}
                </span>
            </li>
        </ul>
    }
}