Update table view

kahnclusions · Aug 4, 2024 · 10f421b · 10f421b
1 parent 90f7bc7
commit 10f421b
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 8 deletions.
diff --git a/app/src/components/torrents.rs b/app/src/components/torrents.rs
@@ -1,11 +1,9 @@
 use human_bytes::human_bytes;
 use rust_decimal::prelude::*;
-use std::collections::HashMap;
 use tailwind_fuse::tw_merge;
 
 use fnord_ui::components::{Text, View};
 use leptos::prelude::*;
-use qbittorrent_rs_proto::torrents::TorrentInfo;
 use qbittorrent_rs_sse::signals::Torrent;
 
 static CELL_CLASS: &'static str = "shadow-border p-2 whitespace-nowrap text-left font-normal";
@@ -18,11 +16,9 @@ pub fn TorrentList(torrents: Signal<Vec<Torrent>>) -> impl IntoView {
                 <thead class="">
                     <tr>
                         <th class=tw_merge!("sticky left-0 bg-background z-10 overflow-hidden text-ellipsis whitespace-nowrap max-w-[40vw] shadow-border p-1 text-left font-normal", CELL_CLASS)>"Name"</th>
-                        <th class=CELL_CLASS>"%"</th>
+                        <th class=CELL_CLASS>"Progress"</th>
                         <th class=CELL_CLASS>"DL/s"</th>
                         <th class=CELL_CLASS>"UP/s"</th>
-                        <th class=CELL_CLASS>"DL"</th>
-                        <th class=CELL_CLASS>"UP"</th>
                         <th class=CELL_CLASS>"SD"</th>
                         <th class=CELL_CLASS>"LE"</th>
                     </tr>
@@ -59,13 +55,42 @@ pub fn TorrentSummary(torrent: Torrent) -> impl IntoView {
     view! {
         <tr class="gap-0">
             <th class=tw_merge!("sticky left-0 bg-background z-10 overflow-hidden text-ellipsis whitespace-nowrap max-w-[40vw] shadow-border p-1 text-left font-normal", CELL_CLASS)>{move || name()}</th>
-            <td class=CELL_CLASS>{move || progress()}</td>
+            <td class=CELL_CLASS><Progress progress={torrent.progress} downloaded={torrent.downloaded} size={torrent.size} total_size={torrent.total_size} /></td>
             <td class=CELL_CLASS>{move || dlspeed()}</td>
             <td class=CELL_CLASS>{move || upspeed()}</td>
-            <td class=CELL_CLASS>{move || downloaded()}</td>
-            <td class=CELL_CLASS>{move || uploaded()}</td>
             <td class=CELL_CLASS>{move || torrent.num_seeds.get()}</td>
             <td class=CELL_CLASS>{move || torrent.num_leechs.get()}</td>
         </tr>
     }
 }
+
+#[component]
+fn Progress(
+    downloaded: RwSignal<f64>,
+    progress: RwSignal<f64>,
+    size: RwSignal<f64>,
+    total_size: RwSignal<f64>,
+) -> impl IntoView {
+    let percent_selected = move || size.get() / total_size.get();
+    let inner_bar_w = move || (percent_selected() * 150.0).ceil();
+    let percent_complete =
+        move || (progress.get().min(1.0) * percent_selected().min(1.0) * 150.0) - 8.0;
+
+    Effect::new(move |_| {
+        tracing::info!("percent = {:?}", progress.get());
+    });
+
+    view! {
+        <div class="flex flex-col w-[150px] gap-[2px]">
+            <div class="rounded bg-background_dark h-2">
+                <div class="rounded bg-background_highlight h-2" style:width=move || { format!("{}px", inner_bar_w()) }>
+                    <div class="border-t-[2px] border-t-green1 relative top-[3px] left-[4px]" style:width=move || { format!("{}%", (progress.get().min(1.0) * 100.0).ceil()) }>""</div>
+                </div>
+            </div>
+            <div class="flex flex-row justify-between text-2xs">
+                <div class="text-[11px]">{move || human_bytes(downloaded.get())}</div>
+                <div class="text-[11px]">{move || human_bytes(total_size.get())}</div>
+            </div>
+        </div>
+    }
+}
diff --git a/qbittorrent_rs_sse/src/signals.rs b/qbittorrent_rs_sse/src/signals.rs
@@ -36,6 +36,8 @@ pub struct Torrent {
     pub upspeed: RwSignal<f64>,
     pub num_seeds: RwSignal<f64>,
     pub num_leechs: RwSignal<f64>,
+    pub size: RwSignal<f64>,
+    pub total_size: RwSignal<f64>,
 }
 
 impl From<TorrentInfo> for Torrent {
@@ -50,6 +52,8 @@ impl From<TorrentInfo> for Torrent {
             upspeed: RwSignal::new(value.upspeed),
             num_seeds: RwSignal::new(value.num_seeds),
             num_leechs: RwSignal::new(value.num_leechs),
+            size: RwSignal::new(value.size),
+            total_size: RwSignal::new(value.total_size),
         }
     }
 }
@@ -79,6 +83,12 @@ impl Torrent {
         if let Some(new_value) = partial.num_leechs {
             self.num_leechs.set(new_value);
         }
+        if let Some(new_value) = partial.size {
+            self.size.set(new_value);
+        }
+        if let Some(new_value) = partial.total_size {
+            self.total_size.set(new_value);
+        }
     }
 }