apalis-board-web 1.0.0-rc.8

Frontend components for managing Apalis task queues.
Documentation 
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

use std::str::FromStr;

use apalis_core::task::status::Status;
use leptos::prelude::*;
use leptos_meta::Title;
use leptos_router::hooks::use_params_map;
use leptos_struct_table::{DisplayStrategy, PaginationController, SortingMode, TableContent};

use crate::{
    components::{pagination::Paginator, sidebar::queues_icon},
    pages::{queues::index::QueueNav, tasks::provider::TaskProvider},
};

#[component]
pub fn StatusPage() -> impl IntoView {
    let params = use_params_map();
    let queue = move || params.with(|p| p.get("queue").unwrap().clone());
    let queue_name = move || queue();
    let status = move || {
        params.with(|p| {
            p.get("status")
                .map(|s| Status::from_str(&s).unwrap())
                .unwrap_or_default()
        })
    };
    let rows = move || TaskProvider::new_with_status(queue(), status());
    let pagination_controller = PaginationController::default();
    view! {
        <Title text=move || format!("{} - {}", status(), queue_name()) />
        <div class="flex flex-col h-full w-full overflow-y-auto">
            <div class="w-full bg-background-bright border-b border-gray-700 flex items-center h-[2.75rem]">
                <span class="ml-2 mr-1 rounded p-1 bg-charcoal-700 text-text-bright p-2">
                    {queues_icon()}
                </span>
                <h3 class="text-lg font-bold m-2">{queue_name}</h3>
            </div>
            <div class="flex items-center gap-1 p-2 border-b border-gray-700">
                <QueueNav />
            </div>
            <div class="flex-1 overflow-hidden overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-charcoal-600 hover:scrollbar-thumb-charcoal-500 w-full">
                <table class="whitespace-nowrap transition-all duration-200 w-full">
                    {move || {
                        view! {
                            <TableContent
                                rows=rows()
                                scroll_container="html"
                                sorting_mode=SortingMode::SingleColumn
                                display_strategy=DisplayStrategy::Pagination {
                                    controller: pagination_controller,
                                    row_count: 20,
                                }
                            />
                        }
                    }}
                </table>
            </div>
            <Paginator pagination_controller />
        </div>
    }
}