more information on the list page

6 files changed, 112 insertions, 57 deletions

diff --git a/teleterm-web/src/lib.rs b/teleterm-web/src/lib.rs
index 2ff1514..7e0f460 100644
--- a/teleterm-web/src/lib.rs
+++ b/teleterm-web/src/lib.rs
@@ -9,7 +9,7 @@ use crate::prelude::*;
 #[allow(clippy::large_enum_variant)]
 #[derive(Clone)]
 enum Msg {
-    List(seed::fetch::ResponseDataResult<Vec<crate::model::Session>>),
+    List(seed::fetch::ResponseDataResult<Vec<crate::protocol::Session>>),
     Refresh,
     StartWatching(String),
     Watch(String, ws::WebSocketEvent),
diff --git a/teleterm-web/src/model.rs b/teleterm-web/src/model.rs
index dfaccc8..fa0cb63 100644
--- a/teleterm-web/src/model.rs
+++ b/teleterm-web/src/model.rs
@@ -14,15 +14,9 @@ impl Drop for WatchConn {
     }
 }
 
-#[derive(Clone, Debug, serde::Deserialize)]
-pub struct Session {
-    pub id: String,
-    pub username: String,
-}
-
 #[derive(Default)]
 pub struct Model {
-    sessions: Vec<Session>,
+    sessions: Vec<crate::protocol::Session>,
     watch_conn: Option<WatchConn>,
 }
 
@@ -48,11 +42,14 @@ impl Model {
         self.watch_conn = Some(WatchConn { ws, term })
     }
 
-    pub fn sessions(&self) -> &[Session] {
+    pub fn sessions(&self) -> &[crate::protocol::Session] {
         &self.sessions
     }
 
-    pub fn update_sessions(&mut self, sessions: Vec<Session>) {
+    pub fn update_sessions(
+        &mut self,
+        sessions: Vec<crate::protocol::Session>,
+    ) {
         self.sessions = sessions;
     }
 
diff --git a/teleterm-web/src/protocol.rs b/teleterm-web/src/protocol.rs
index af40891..60047e0 100644
--- a/teleterm-web/src/protocol.rs
+++ b/teleterm-web/src/protocol.rs
@@ -6,3 +6,20 @@ pub enum Message {
     TerminalOutput { data: Vec<u8> },
     Disconnected,
 }
+
+#[derive(Clone, Debug, serde::Deserialize)]
+pub struct Session {
+    pub id: String,
+    pub username: String,
+    pub term_type: String,
+    pub size: Size,
+    pub idle_time: u32,
+    pub title: String,
+    pub watchers: u32,
+}
+
+#[derive(Clone, Debug, serde::Deserialize)]
+pub struct Size {
+    pub rows: u16,
+    pub cols: u16,
+}
diff --git a/teleterm-web/src/views/list.rs b/teleterm-web/src/views/list.rs
index 75fddf2..6d4ccd5 100644
--- a/teleterm-web/src/views/list.rs
+++ b/teleterm-web/src/views/list.rs
@@ -1,18 +1,58 @@
 use crate::prelude::*;
 
 pub(crate) fn render(model: &crate::model::Model) -> Vec<Node<crate::Msg>> {
-    let mut list = vec![];
-    for session in model.sessions() {
-        list.push(seed::li![seed::button![
+    let rows: Vec<_> = model.sessions().iter().map(row).collect();
+    vec![
+        seed::table![
+            seed::tr![
+                seed::th!["username"],
+                seed::th!["size"],
+                seed::th!["idle"],
+                seed::th!["watchers"],
+                seed::th!["title"],
+            ],
+            rows
+        ],
+        seed::button![simple_ev(Ev::Click, crate::Msg::Refresh), "refresh"],
+    ]
+}
+
+fn row(session: &crate::protocol::Session) -> Node<crate::Msg> {
+    seed::tr![
+        seed::td![seed::a![
             simple_ev(
                 Ev::Click,
                 crate::Msg::StartWatching(session.id.clone())
             ),
-            format!("{}: {}", session.username, session.id),
-        ]]);
-    }
-    vec![
-        seed::ul![list],
-        seed::button![simple_ev(Ev::Click, crate::Msg::Refresh), "refresh"],
+            session.username,
+        ]],
+        seed::td![format!("{}x{}", session.size.cols, session.size.rows)],
+        seed::td![format_time(session.idle_time)],
+        seed::td![format!("{}", session.watchers)],
+        seed::td![session.title],
     ]
 }
+
+// XXX copied from teleterm
+fn format_time(dur: u32) -> String {
+    let secs = dur % 60;
+    let dur = dur / 60;
+    if dur == 0 {
+        return format!("{}s", secs);
+    }
+
+    let mins = dur % 60;
+    let dur = dur / 60;
+    if dur == 0 {
+        return format!("{}m{:02}s", mins, secs);
+    }
+
+    let hours = dur % 24;
+    let dur = dur / 24;
+    if dur == 0 {
+        return format!("{}h{:02}m{:02}s", hours, mins, secs);
+    }
+
+    let days = dur;
+    format!("{}d{:02}h{:02}m{:02}s", days, hours, mins, secs)
+}
diff --git a/teleterm/static/teleterm_web.js b/teleterm/static/teleterm_web.js
index c8d3f28..4b6e536 100644
--- a/teleterm/static/teleterm_web.js
+++ b/teleterm/static/teleterm_web.js
@@ -1,6 +1,10 @@
 
 let wasm;
 
+function __wbg_elem_binding0(arg0, arg1) {
+    wasm.__wbg_function_table.get(222)(arg0, arg1);
+}
+
 const heap = new Array(32);
 
 heap.fill(undefined);
@@ -17,32 +21,29 @@ function addHeapObject(obj) {
     heap[idx] = obj;
     return idx;
 }
-function __wbg_elem_binding0(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(56)(arg0, arg1, addHeapObject(arg2));
-}
-function __wbg_elem_binding1(arg0, arg1) {
-    wasm.__wbg_function_table.get(221)(arg0, arg1);
+function __wbg_elem_binding1(arg0, arg1, arg2) {
+    wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2));
 }
 function __wbg_elem_binding2(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(291)(arg0, arg1, addHeapObject(arg2));
+    wasm.__wbg_function_table.get(292)(arg0, arg1, addHeapObject(arg2));
 }
 function __wbg_elem_binding3(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(60)(arg0, arg1, arg2);
+    wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2));
 }
 function __wbg_elem_binding4(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(56)(arg0, arg1, addHeapObject(arg2));
+    wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2));
 }
 function __wbg_elem_binding5(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(56)(arg0, arg1, addHeapObject(arg2));
+    wasm.__wbg_function_table.get(55)(arg0, arg1, addHeapObject(arg2));
 }
 function __wbg_elem_binding6(arg0, arg1, arg2) {
-    wasm.__wbg_function_table.get(56)(arg0, arg1, addHeapObject(arg2));
+    wasm.__wbg_function_table.get(59)(arg0, arg1, arg2);
 }
 function __wbg_elem_binding7(arg0, arg1, arg2, arg3, arg4) {
-    wasm.__wbg_function_table.get(318)(arg0, arg1, addHeapObject(arg2), arg3, addHeapObject(arg4));
+    wasm.__wbg_function_table.get(319)(arg0, arg1, addHeapObject(arg2), arg3, addHeapObject(arg4));
 }
 function __wbg_elem_binding8(arg0, arg1, arg2, arg3) {
-    wasm.__wbg_function_table.get(322)(arg0, arg1, addHeapObject(arg2), addHeapObject(arg3));
+    wasm.__wbg_function_table.get(323)(arg0, arg1, addHeapObject(arg2), addHeapObject(arg3));
 }
 /**
 */
@@ -228,13 +229,16 @@ function init(module) {
     imports.wbg.__wbindgen_object_drop_ref = function(arg0) {
         takeObject(arg0);
     };
+    imports.wbg.__wbindgen_string_new = function(arg0, arg1) {
+        const ret = getStringFromWasm(arg0, arg1);
+        return addHeapObject(ret);
+    };
     imports.wbg.__wbindgen_object_clone_ref = function(arg0) {
         const ret = getObject(arg0);
         return addHeapObject(ret);
     };
-    imports.wbg.__wbindgen_string_new = function(arg0, arg1) {
-        const ret = getStringFromWasm(arg0, arg1);
-        return addHeapObject(ret);
+    imports.wbg.__wbindgen_cb_forget = function(arg0) {
+        takeObject(arg0);
     };
     imports.wbg.__wbindgen_cb_drop = function(arg0) {
         const obj = takeObject(arg0).original;
@@ -245,9 +249,6 @@ function init(module) {
         const ret = false;
         return ret;
     };
-    imports.wbg.__wbindgen_cb_forget = function(arg0) {
-        takeObject(arg0);
-    };
     imports.wbg.__wbindgen_json_parse = function(arg0, arg1) {
         const ret = JSON.parse(getStringFromWasm(arg0, arg1));
         return addHeapObject(ret);
@@ -884,16 +885,16 @@ function init(module) {
     imports.wbg.__wbindgen_throw = function(arg0, arg1) {
         throw new Error(getStringFromWasm(arg0, arg1));
     };
-    imports.wbg.__wbindgen_closure_wrapper618 = function(arg0, arg1, arg2) {
+    imports.wbg.__wbindgen_closure_wrapper249 = function(arg0, arg1, arg2) {
         const state = { a: arg0, b: arg1, cnt: 1 };
-        const real = () => {
+        const real = (arg0) => {
             state.cnt++;
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding1(a, state.b, );
+                return __wbg_elem_binding1(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(222)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b);
                 else state.a = a;
             }
         }
@@ -902,16 +903,16 @@ function init(module) {
         const ret = real;
         return addHeapObject(ret);
     };
-    imports.wbg.__wbindgen_closure_wrapper241 = function(arg0, arg1, arg2) {
+    imports.wbg.__wbindgen_closure_wrapper243 = function(arg0, arg1, arg2) {
         const state = { a: arg0, b: arg1, cnt: 1 };
         const real = (arg0) => {
             state.cnt++;
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding3(a, state.b, arg0);
+                return __wbg_elem_binding6(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(57)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b);
                 else state.a = a;
             }
         }
@@ -920,16 +921,16 @@ function init(module) {
         const ret = real;
         return addHeapObject(ret);
     };
-    imports.wbg.__wbindgen_closure_wrapper243 = function(arg0, arg1, arg2) {
+    imports.wbg.__wbindgen_closure_wrapper241 = function(arg0, arg1, arg2) {
         const state = { a: arg0, b: arg1, cnt: 1 };
         const real = (arg0) => {
             state.cnt++;
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding4(a, state.b, arg0);
+                return __wbg_elem_binding5(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(57)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b);
                 else state.a = a;
             }
         }
@@ -938,16 +939,16 @@ function init(module) {
         const ret = real;
         return addHeapObject(ret);
     };
-    imports.wbg.__wbindgen_closure_wrapper239 = function(arg0, arg1, arg2) {
+    imports.wbg.__wbindgen_closure_wrapper631 = function(arg0, arg1, arg2) {
         const state = { a: arg0, b: arg1, cnt: 1 };
-        const real = (arg0) => {
+        const real = () => {
             state.cnt++;
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding0(a, state.b, arg0);
+                return __wbg_elem_binding0(a, state.b, );
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(57)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(223)(a, state.b);
                 else state.a = a;
             }
         }
@@ -956,7 +957,7 @@ function init(module) {
         const ret = real;
         return addHeapObject(ret);
     };
-    imports.wbg.__wbindgen_closure_wrapper1029 = function(arg0, arg1, arg2) {
+    imports.wbg.__wbindgen_closure_wrapper1042 = function(arg0, arg1, arg2) {
         const state = { a: arg0, b: arg1, cnt: 1 };
         const real = (arg0) => {
             state.cnt++;
@@ -965,7 +966,7 @@ function init(module) {
             try {
                 return __wbg_elem_binding2(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(292)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(293)(a, state.b);
                 else state.a = a;
             }
         }
@@ -981,9 +982,9 @@ function init(module) {
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding5(a, state.b, arg0);
+                return __wbg_elem_binding3(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(57)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b);
                 else state.a = a;
             }
         }
@@ -999,9 +1000,9 @@ function init(module) {
             const a = state.a;
             state.a = 0;
             try {
-                return __wbg_elem_binding6(a, state.b, arg0);
+                return __wbg_elem_binding4(a, state.b, arg0);
             } finally {
-                if (--state.cnt === 0) wasm.__wbg_function_table.get(57)(a, state.b);
+                if (--state.cnt === 0) wasm.__wbg_function_table.get(56)(a, state.b);
                 else state.a = a;
             }
         }
diff --git a/teleterm/static/teleterm_web_bg.wasm b/teleterm/static/teleterm_web_bg.wasm
index 3f66d8e..812e8bd 100644
--- a/teleterm/static/teleterm_web_bg.wasm
+++ b/teleterm/static/teleterm_web_bg.wasm