WIP

This is on the path to make the UI more simple and move email parsing to
server side.

Cargo.toml

@@ -1,4 +1,5 @@
 [workspace]
+resolver = "2"
 members = [
   "web",
   "server",

dev.sh

@@ -1,3 +1,4 @@
+cd -- "$( dirname -- "${BASH_SOURCE[0]}" )"
 tmux new-session -d -s letterbox-dev
 tmux rename-window web
 tmux send-keys "cd web; trunk serve --release --address 0.0.0.0 --port 6758 --proxy-backend http://localhost:9345/ --proxy-rewrite=/api/ -w ../shared -w ../notmuch -w ./" C-m

notmuch/src/lib.rs

@@ -608,7 +608,7 @@ mod tests {
     fn search() -> Result<(), NotmuchError> {
         let nm = Notmuch::with_config("testdata/notmuch.config");
         nm.new()?;
-        let res = nm.search("goof")?;
+        let res = nm.search("goof", 0, 100)?;
         assert_eq!(res.0.len(), 1);
         Ok(())
     }

procmail2notmuch/src/main.rs

@@ -5,6 +5,7 @@ enum MatchType {
     From,
     Sender,
     To,
+    Cc,
     Subject,
     List,
     DeliveredTo,
@@ -81,6 +82,11 @@ impl FromStr for Match {
                     match_type: MatchType::From,
                     needle: cleanup_match(FROM, needle),
                 });
+            } else if needle.starts_with(CC) {
+                return Ok(Match {
+                    match_type: MatchType::Cc,
+                    needle: cleanup_match(CC, needle),
+                });
             } else if needle.starts_with(TOCC) {
                 return Ok(Match {
                     match_type: MatchType::To,
@@ -88,7 +94,7 @@ impl FromStr for Match {
                 });
             } else if needle.starts_with(SENDER) {
                 return Ok(Match {
-                    match_type: MatchType::From,
+                    match_type: MatchType::Sender,
                     needle: cleanup_match(SENDER, needle),
                 });
             } else if needle.starts_with(SUBJECT) {
@@ -140,7 +146,6 @@ impl FromStr for Match {
                 needle: cleanup_match("", &needle),
             });
         }
-        Ok(Match::default())
     }
 }
 
@@ -155,29 +160,35 @@ fn notmuch_from_rules<W: Write>(mut w: W, rules: &[Rule]) -> anyhow::Result<()>
                     eprintln!("rule has unknown match {:?}", r);
                     continue;
                 }
+
+                let rule = match m.match_type {
+                    MatchType::From => "from:",
+                    // TODO(wathiede): something more specific?
+                    MatchType::Sender => "from:",
+                    MatchType::To => "to:",
+                    MatchType::Cc => "to:",
+                    MatchType::Subject => "subject:",
+                    MatchType::List => "List-ID:",
+                    MatchType::Body => "",
+                    // TODO(wathiede): these will probably require adding fields to notmuch
+                    // index. Handle them later.
+                    MatchType::DeliveredTo
+                    | MatchType::XForwardedTo
+                    | MatchType::ReplyTo
+                    | MatchType::XOriginalTo
+                    | MatchType::XSpam => continue,
+                    MatchType::Unknown => unreachable!(),
+                };
+                // Preserve unread status if run with --remove-all
+                lines.push(format!(
+                    r#"-unprocessed +{} +unread -- is:unread tag:unprocessed {}"{}""#,
+                    t, rule, m.needle
+                ));
                 lines.push(format!(
                     // TODO(wathiede): this assumes `notmuch new` is configured to add
                     // `tag:unprocessed` to all new mail.
-                    "-unprocessed +{} -- tag:unprocessed {}{}",
-                    t,
-                    match m.match_type {
-                        MatchType::From => "from:",
-                        // TODO(wathiede): something more specific?
-                        MatchType::Sender => "from:",
-                        MatchType::To => "to:",
-                        MatchType::Subject => "subject:",
-                        MatchType::List => "List-ID:",
-                        MatchType::Body => "",
-                        // TODO(wathiede): these will probably require adding fields to notmuch
-                        // index. Handle them later.
-                        MatchType::DeliveredTo
-                        | MatchType::XForwardedTo
-                        | MatchType::ReplyTo
-                        | MatchType::XOriginalTo
-                        | MatchType::XSpam => continue,
-                        MatchType::Unknown => unreachable!(),
-                    },
-                    m.needle
+                    r#"-unprocessed +{} -- tag:unprocessed {}"{}""#,
+                    t, rule, m.needle
                 ));
             }
         }

server/Cargo.toml

@@ -15,6 +15,7 @@ thiserror = "1.0.37"
 serde = { version = "1.0.147", features = ["derive"] }
 log = "0.4.17"
 tokio = "1.26.0"
+glog = "0.1.0"
 
 [dependencies.rocket_contrib]
 version = "0.4.11"

server/src/main.rs

@@ -1,9 +1,12 @@
 #[macro_use]
 extern crate rocket;
+mod error;
+mod nm;
 
 use std::{error::Error, io::Cursor, str::FromStr};
 
-use notmuch::{Notmuch, NotmuchError, SearchSummary, ThreadSet};
+use glog::Flags;
+use notmuch::{Notmuch, NotmuchError};
 use rocket::{
     http::{ContentType, Header},
     request::Request,
@@ -13,6 +16,8 @@ use rocket::{
 };
 use rocket_cors::{AllowedHeaders, AllowedOrigins};
 
+use crate::error::ServerError;
+
 #[get("/")]
 fn hello() -> &'static str {
     "Hello, world!"
@@ -39,6 +44,7 @@ async fn search(
 ) -> Result<Json<shared::SearchResult>, Debug<NotmuchError>> {
     let page = page.unwrap_or(0);
     let results_per_page = results_per_page.unwrap_or(10);
+    info!(" search '{query}'");
     let res = shared::SearchResult {
         summary: nm.search(query, page * results_per_page, results_per_page)?,
         query: query.to_string(),
@@ -49,18 +55,12 @@ async fn search(
     Ok(Json(res))
 }
 
-#[get("/show/<query>/pretty")]
-async fn show_pretty(
+#[get("/show/<query>")]
+async fn show(
     nm: &State<Notmuch>,
     query: &str,
-) -> Result<Json<ThreadSet>, Debug<NotmuchError>> {
-    let res = nm.show(query)?;
-    Ok(Json(res))
-}
-
-#[get("/show/<query>")]
-async fn show(nm: &State<Notmuch>, query: &str) -> Result<Json<ThreadSet>, Debug<NotmuchError>> {
-    let res = nm.show(query)?;
+) -> Result<Json<Vec<shared::Message>>, Debug<ServerError>> {
+    let res = nm::threadset_to_messages(nm.show(query).map_err(|e| -> ServerError { e.into() })?)?;
     Ok(Json(res))
 }
 
@@ -120,6 +120,14 @@ async fn original(
 
 #[rocket::main]
 async fn main() -> Result<(), Box<dyn Error>> {
+    glog::new()
+        .init(Flags {
+            colorlogtostderr: true,
+            //alsologtostderr: true, // use logtostderr to only write to stderr and not to files
+            logtostderr: true,
+            ..Default::default()
+        })
+        .unwrap();
     let allowed_origins = AllowedOrigins::all();
     let cors = rocket_cors::CorsOptions {
         allowed_origins,
@@ -143,7 +151,6 @@ async fn main() -> Result<(), Box<dyn Error>> {
                 refresh,
                 search_all,
                 search,
-                show_pretty,
                 show
             ],
         )

shared/src/lib.rs

@@ -9,3 +9,27 @@ pub struct SearchResult {
     pub results_per_page: usize,
     pub total: usize,
 }
+
+#[derive(Serialize, Deserialize, Debug)]
+pub struct ShowResult {
+    messages: Vec<Message>,
+}
+
+pub type AttachementId = String;
+
+/// # Number of seconds since the Epoch
+pub type UnixTime = isize;
+
+#[derive(Serialize, Deserialize, Debug, Default)]
+pub struct Message {
+    pub from: String,
+    pub to: Option<String>,
+    pub cc: Option<String>,
+    pub timestamp: UnixTime,   // date header as unix time
+    pub date_relative: String, // user-friendly timestamp
+    pub tags: Vec<String>,
+
+    // HTML formatted body
+    pub body: String,
+    pub attachment: Vec<AttachementId>,
+}

web/src/api.rs

@@ -0,0 +1,16 @@
+use seed::Url;
+
+const BASE_URL: &str = "/api";
+pub fn refresh() -> String {
+    format!("{BASE_URL}/refresh")
+}
+pub fn search(query: &str, page: usize, results_per_page: usize) -> String {
+    let query = Url::encode_uri_component(query);
+    format!("{BASE_URL}/search/{query}?page={page}&results_per_page={results_per_page}")
+}
+pub fn show(tid: &str) -> String {
+    format!("{BASE_URL}/show/{tid}")
+}
+pub fn original(message_id: &str) -> String {
+    format!("{BASE_URL}/original/{message_id}")
+}

web/src/lib.rs

@@ -1,64 +1,99 @@
-// (Lines like the one below ignore selected Clippy rules
-//  - it's useful when you want to check your code with `cargo make verify`
-// but some rules are too "annoying" or are not applicable for your case.)
-#![allow(clippy::wildcard_imports)]
+mod api;
+mod nm;
+
 use std::{
     collections::hash_map::DefaultHasher,
     hash::{Hash, Hasher},
 };
 
 use itertools::Itertools;
-use log::{debug, error, info, warn, Level};
-use notmuch::{Content, Part, Thread, ThreadNode, ThreadSet};
+use log::{debug, error, info, Level};
+use notmuch::ThreadSet;
 use seed::{prelude::*, *};
-use serde::de::Deserialize;
+use serde::Deserialize;
 use wasm_timer::Instant;
 
+const SEARCH_RESULTS_PER_PAGE: usize = 20;
+
 // ------ ------
 //     Init
 // ------ ------
 
 // `init` describes what should happen when your app started.
 fn init(url: Url, orders: &mut impl Orders<Msg>) -> Model {
-    warn!("init called");
-    log!(url);
-    let mut url = url.clone();
-    let mut query = "".to_string();
-    let hpp = url.next_hash_path_part();
-    log!(hpp);
-    match hpp {
-        Some("t") => {
-            let tid = url.next_hash_path_part().unwrap_or("").to_string();
-            orders.send_msg(Msg::ShowPrettyRequest(tid));
-        }
-        Some("s") => {
-            query = url.next_hash_path_part().unwrap_or("").to_string();
-            orders.send_msg(Msg::SearchRequest(query.clone()));
-        }
-        p => {
-            log!(p);
-            orders.send_msg(Msg::SearchRequest("".to_string()));
-        }
-    };
-    orders.subscribe(|uc: subs::UrlChanged| {
-        info!("uc {}", uc.0);
-    });
+    orders
+        .subscribe(on_url_changed)
+        .notify(subs::UrlChanged(url.clone()));
 
-    info!("init query '{}'", query);
     Model {
         context: Context::None,
-        query,
+        query: "".to_string(),
         refreshing_state: RefreshingState::None,
     }
 }
 
+fn on_url_changed(uc: subs::UrlChanged) -> Msg {
+    let mut url = uc.0;
+    info!(
+        "url changed '{}', history {}",
+        url,
+        history().length().unwrap_or(0)
+    );
+    let hpp = url.remaining_hash_path_parts();
+    match hpp.as_slice() {
+        ["t", tid] => Msg::ShowRequest(tid.to_string()),
+        ["s", query] => {
+            let query = Url::decode_uri_component(query).unwrap_or("".to_string());
+            Msg::SearchRequest {
+                query,
+                page: 0,
+                results_per_page: SEARCH_RESULTS_PER_PAGE,
+            }
+        }
+        ["s", query, page] => {
+            let query = Url::decode_uri_component(query).unwrap_or("".to_string());
+            let page = page[1..].parse().unwrap_or(0);
+            Msg::SearchRequest {
+                query,
+                page,
+                results_per_page: SEARCH_RESULTS_PER_PAGE,
+            }
+        }
+        p => {
+            if !p.is_empty() {
+                info!("Unhandled path '{p:?}'");
+            }
+            Msg::SearchRequest {
+                query: "".to_string(),
+                page: 0,
+                results_per_page: SEARCH_RESULTS_PER_PAGE,
+            }
+        }
+    }
+}
+
+mod urls {
+    use seed::Url;
+    pub fn search(query: &str, page: usize) -> Url {
+        let query = Url::encode_uri_component(query);
+        if page > 0 {
+            Url::new().set_hash_path(["s", &query, &format!("p{page}")])
+        } else {
+            Url::new().set_hash_path(["s", &query])
+        }
+    }
+    pub fn thread(tid: &str) -> Url {
+        Url::new().set_hash_path(["t", tid])
+    }
+}
+
 // ------ ------
 //     Model
 // ------ ------
 enum Context {
     None,
     Search(shared::SearchResult),
-    Thread(ThreadSet),
+    Thread(Vec<shared::Message>),
 }
 
 // `Model` describes our app state.
@@ -81,16 +116,18 @@ enum RefreshingState {
 
 // (Remove the line below once any of your `Msg` variants doesn't implement `Copy`.)
 // `Msg` describes the different events you can modify state with.
-enum Msg {
+pub enum Msg {
     Noop,
     RefreshStart,
     RefreshDone(Option<FetchError>),
-    SearchRequest(String),
+    SearchRequest {
+        query: String,
+        page: usize,
+        results_per_page: usize,
+    },
     SearchResult(fetch::Result<shared::SearchResult>),
     ShowRequest(String),
-    ShowResult(fetch::Result<ThreadSet>),
-    ShowPrettyRequest(String),
-    ShowPrettyResult(fetch::Result<ThreadSet>),
+    ShowResult(fetch::Result<Vec<shared::Message>>),
     NextPage,
     PreviousPage,
 }
@@ -107,18 +144,30 @@ fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
             model.refreshing_state = if let Some(err) = err {
                 RefreshingState::Error(format!("{:?}", err))
             } else {
+                // If looking at search page, refresh the search to view update on the server side.
+                if let Context::Search(sr) = &model.context {
+                    let query = sr.query.clone();
+                    let page = sr.page;
+                    let results_per_page = sr.results_per_page;
+                    orders.perform_cmd(async move {
+                        Msg::SearchResult(search_request(&query, page, results_per_page).await)
+                    });
+                }
+
                 RefreshingState::None
             };
         }
 
-        Msg::SearchRequest(query) => {
-            info!("searching for '{query}'");
+        Msg::SearchRequest {
+            query,
+            page,
+            results_per_page,
+        } => {
+            info!("searching for '{query}' pg {page} # / pg {results_per_page}");
             model.query = query.clone();
-            let url = Url::new().set_hash_path(["s", &query]);
-            orders.request_url(url);
-            orders
-                .skip()
-                .perform_cmd(async move { Msg::SearchResult(search_request(&query).await) });
+            orders.skip().perform_cmd(async move {
+                Msg::SearchResult(search_request(&query, page, results_per_page).await)
+            });
         }
         Msg::SearchResult(Ok(response_data)) => {
             debug!("fetch ok {:#?}", response_data);
@@ -129,8 +178,6 @@ fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
         }
 
         Msg::ShowRequest(tid) => {
-            let url = Url::new().set_hash_path(["t", &tid]);
-            orders.request_url(url);
             orders
                 .skip()
                 .perform_cmd(async move { Msg::ShowResult(show_request(&tid).await) });
@@ -142,30 +189,10 @@ fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
         Msg::ShowResult(Err(fetch_error)) => {
             error!("fetch failed {:?}", fetch_error);
         }
-
-        Msg::ShowPrettyRequest(tid) => {
-            let url = Url::new().set_hash_path(["t", &tid]);
-            orders.request_url(url);
-            orders
-                .skip()
-                .perform_cmd(async move { Msg::ShowPrettyResult(show_pretty_request(&tid).await) });
-        }
-        Msg::ShowPrettyResult(Ok(response_data)) => {
-            debug!("fetch ok {:#?}", response_data);
-            model.context = Context::Thread(response_data);
-        }
-        Msg::ShowPrettyResult(Err(fetch_error)) => {
-            error!("fetch failed {:?}", fetch_error);
-        }
         Msg::NextPage => {
             match &model.context {
                 Context::Search(sr) => {
-                    orders.send_msg(Msg::SearchRequest(format!(
-                        "{}?page={}&results_per_page={}",
-                        Url::encode_uri_component(&sr.query),
-                        sr.page + 1,
-                        sr.results_per_page
-                    )));
+                    orders.request_url(urls::search(&sr.query, sr.page + 1));
                 }
                 Context::Thread(_) => (), // do nothing (yet?)
                 Context::None => (),      // do nothing (yet?)
@@ -174,12 +201,7 @@ fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
         Msg::PreviousPage => {
             match &model.context {
                 Context::Search(sr) => {
-                    orders.send_msg(Msg::SearchRequest(format!(
-                        "{}?page={}&results_per_page={}",
-                        Url::encode_uri_component(&sr.query),
-                        sr.page.saturating_sub(1),
-                        sr.results_per_page
-                    )));
+                    orders.request_url(urls::search(&sr.query, sr.page.saturating_sub(1)));
                 }
                 Context::Thread(_) => (), // do nothing (yet?)
                 Context::None => (),      // do nothing (yet?)
@@ -188,8 +210,25 @@ fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
     }
 }
 
-async fn search_request(query: &str) -> fetch::Result<shared::SearchResult> {
-    Request::new(api::search(query))
+pub async fn show_request(tid: &str) -> fetch::Result<Vec<shared::Message>> {
+    let b = Request::new(api::show(tid))
+        .method(Method::Get)
+        .fetch()
+        .await?
+        .check_status()?
+        .bytes()
+        .await?;
+    let mut deserializer = serde_json::Deserializer::from_slice(&b);
+    deserializer.disable_recursion_limit();
+    Ok(Vec::<shared::Message>::deserialize(&mut deserializer)
+        .map_err(|_| FetchError::JsonError(fetch::JsonError::Serde(JsValue::NULL)))?)
+}
+async fn search_request(
+    query: &str,
+    page: usize,
+    results_per_page: usize,
+) -> fetch::Result<shared::SearchResult> {
+    Request::new(api::search(query, page, results_per_page))
         .method(Method::Get)
         .fetch()
         .await?
@@ -198,25 +237,6 @@ async fn search_request(query: &str) -> fetch::Result<shared::SearchResult> {
         .await
 }
 
-mod api {
-    const BASE_URL: &str = "/api";
-    pub fn refresh() -> String {
-        format!("{BASE_URL}/refresh")
-    }
-    pub fn search(query: &str) -> String {
-        format!("{BASE_URL}/search/{query}")
-    }
-    pub fn show(tid: &str) -> String {
-        format!("{BASE_URL}/show/{tid}")
-    }
-    pub fn show_pretty(tid: &str) -> String {
-        format!("{BASE_URL}/show/{tid}/pretty")
-    }
-    pub fn original(message_id: &str) -> String {
-        format!("{BASE_URL}/original/{message_id}")
-    }
-}
-
 async fn refresh_request() -> fetch::Result<()> {
     let t = Request::new(api::refresh())
         .method(Method::Get)
@@ -229,159 +249,10 @@ async fn refresh_request() -> fetch::Result<()> {
     Ok(())
 }
 
-async fn show_request(tid: &str) -> fetch::Result<ThreadSet> {
-    let b = Request::new(api::show(tid))
-        .method(Method::Get)
-        .fetch()
-        .await?
-        .check_status()?
-        .bytes()
-        .await?;
-    let mut deserializer = serde_json::Deserializer::from_slice(&b);
-    deserializer.disable_recursion_limit();
-    Ok(ThreadSet::deserialize(&mut deserializer)
-        .map_err(|_| FetchError::JsonError(fetch::JsonError::Serde(JsValue::NULL)))?)
-}
-
-async fn show_pretty_request(tid: &str) -> fetch::Result<ThreadSet> {
-    Request::new(api::show_pretty(tid))
-        .method(Method::Get)
-        .fetch()
-        .await?
-        .check_status()?
-        .json()
-        .await
-}
-
 // ------ ------
 //     View
 // ------ ------
 
-// <subject>
-// <tags>
-//
-// <from1> <date>
-// <to1>
-// <content1>
-// <zippy>
-// <children1>
-// </zippy>
-//
-// <from2> <date>
-// <to2>
-// <body2>
-fn view_message(thread: &ThreadNode) -> Node<Msg> {
-    let message = thread.0.as_ref().expect("ThreadNode missing Message");
-    let children = &thread.1;
-    div![
-        C!["message"],
-        /* TODO(wathiede): collect all the tags and show them here. */
-        /* TODO(wathiede): collect all the attachments from all the subparts */
-        div![C!["header"], "From: ", &message.headers.from],
-        div![C!["header"], "Date: ", &message.headers.date],
-        div![C!["header"], "To: ", &message.headers.to],
-        hr![],
-        div![
-            C!["body"],
-            match &message.body {
-                Some(body) => view_body(body.as_slice()),
-                None => div!["<no body>"],
-            },
-        ],
-        children.iter().map(view_message)
-    ]
-}
-
-fn view_body(body: &[Part]) -> Node<Msg> {
-    div![body.iter().map(view_part)]
-}
-
-fn view_text_plain(content: &Option<Content>) -> Node<Msg> {
-    match &content {
-        Some(Content::String(content)) => p![C!["view-part-text-plain"], content],
-        _ => div![
-            C!["error"],
-            format!("Unhandled content enum for text/plain"),
-        ],
-    }
-}
-
-fn view_part(part: &Part) -> Node<Msg> {
-    match part.content_type.as_str() {
-        "text/plain" => view_text_plain(&part.content),
-        "text/html" => {
-            if let Some(Content::String(html)) = &part.content {
-                let inliner = css_inline::CSSInliner::options()
-                    .load_remote_stylesheets(false)
-                    .remove_style_tags(true)
-                    .build();
-                let inlined = inliner.inline(html).expect("failed to inline CSS");
-
-                return div![C!["view-part-text-html"], div!["TEST"], raw![&inlined]];
-            } else {
-                div![
-                    C!["error"],
-                    format!("Unhandled content enum for multipart/mixed"),
-                ]
-            }
-        }
-
-        // https://en.wikipedia.org/wiki/MIME#alternative
-        // RFC1341 states: In general, user agents that compose multipart/alternative entities
-        // should place the body parts in increasing order of preference, that is, with the
-        // preferred format last.
-        "multipart/alternative" => {
-            if let Some(Content::Multipart(parts)) = &part.content {
-                for part in parts.iter().rev() {
-                    if part.content_type == "text/html" {
-                        if let Some(Content::String(html)) = &part.content {
-                            let inliner = css_inline::CSSInliner::options()
-                                .load_remote_stylesheets(false)
-                                .remove_style_tags(true)
-                                .build();
-                            let inlined = inliner.inline(html).expect("failed to inline CSS");
-                            return div![Node::from_html(None, &inlined)];
-                        }
-                    }
-                    if part.content_type == "text/plain" {
-                        return view_text_plain(&part.content);
-                    }
-                }
-                div!["No known  multipart/alternative parts"]
-            } else {
-                div![
-                    C!["error"],
-                    format!("multipart/alternative with non-multipart content"),
-                ]
-            }
-        }
-        "multipart/mixed" => match &part.content {
-            Some(Content::Multipart(parts)) => div![parts.iter().map(view_part)],
-            _ => div![
-                C!["error"],
-                format!("Unhandled content enum for multipart/mixed"),
-            ],
-        },
-        _ => div![
-            C!["error"],
-            format!("Unhandled content type: {}", part.content_type)
-        ],
-    }
-}
-
-fn first_subject(thread: &ThreadNode) -> Option<String> {
-    if let Some(msg) = &thread.0 {
-        return Some(msg.headers.subject.clone());
-    } else {
-        for tn in &thread.1 {
-            if let Some(s) = first_subject(&tn) {
-                return Some(s);
-            }
-        }
-    }
-    None
-}
-
 fn set_title(title: &str) {
     seed::document().set_title(&format!("lb: {}", title));
 }
@@ -395,14 +266,19 @@ fn tags_chiclet(tags: &[String], is_mobile: bool) -> impl Iterator<Item = Node<M
         let classes = C!["tag", IF!(is_mobile => "is-small")];
         let tag = tag.clone();
         a![
+            attrs! {
+                At::Href => urls::search(&format!("tag:{tag}"), 0)
+            },
             match tag.as_str() {
                 "attachment" => span![classes, style, "📎"],
                 "replied" => span![classes, style, i![C!["fa-solid", "fa-reply"]]],
                 _ => span![classes, style, &tag],
             },
-            ev(Ev::Click, move |_| Msg::SearchRequest(
-                Url::encode_uri_component(format!("tag:{tag}"))
-            )),
+            ev(Ev::Click, move |_| Msg::SearchRequest {
+                query: format!("tag:{tag}"),
+                page: 0,
+                results_per_page: SEARCH_RESULTS_PER_PAGE,
+            })
         ]
     })
 }
@@ -450,7 +326,7 @@ fn view_mobile_search_results(query: &str, search_results: &shared::SearchResult
         ],
         td![C!["subject"], tags_chiclet(&r.tags), " ", &r.subject],
         td![C!["date"], &r.date_relative],
-        ev(Ev::Click, move |_| Msg::ShowPrettyRequest(tid)),
+        ev(Ev::Click, move |_| Msg::ShowRequest(tid)),
         ]
         */
         let tid = r.thread.clone();
@@ -458,7 +334,7 @@ fn view_mobile_search_results(query: &str, search_results: &shared::SearchResult
             div![
                 C!["subject"],
                 &r.subject,
-                ev(Ev::Click, move |_| Msg::ShowPrettyRequest(tid)),
+                ev(Ev::Click, move |_| Msg::ShowRequest(tid)),
             ],
             div![
                 span![C!["from"], pretty_authors(&r.authors)],
@@ -472,7 +348,8 @@ fn view_mobile_search_results(query: &str, search_results: &shared::SearchResult
     div![
         h1!["Search results"],
         view_search_pager(first, summaries.len(), search_results.total),
-        rows
+        rows,
+        view_search_pager(first, summaries.len(), search_results.total)
     ]
 }
 
@@ -495,9 +372,12 @@ fn view_search_results(query: &str, search_results: &shared::SearchResult) -> No
                 C!["subject"],
                 tags_chiclet(&r.tags, false),
                 " ",
-                span![
+                a![
+                    C!["has-text-light"],
+                    attrs! {
+                        At::Href => urls::thread(&tid)
+                    },
                     &r.subject,
-                    ev(Ev::Click, move |_| Msg::ShowPrettyRequest(tid))
                 ]
             ],
             td![C!["date"], &r.date_relative]
@@ -521,79 +401,39 @@ fn view_search_results(query: &str, search_results: &shared::SearchResult) -> No
                 th![C!["date"], "Date"]
             ]],
             tbody![rows]
-        ]
+        ],
+        view_search_pager(first, summaries.len(), search_results.total)
     ]
 }
 
-fn view_search_pager(page: usize, count: usize, total: usize) -> Node<Msg> {
+fn view_search_pager(start: usize, count: usize, total: usize) -> Node<Msg> {
+    let is_first = start <= 0;
+    let is_last = (start + SEARCH_RESULTS_PER_PAGE) >= total;
     nav![
         C!["pagination"],
         a![
-            C!["pagination-previous", "button"],
+            C![
+                "pagination-previous",
+                "button",
+                IF!(is_first => "is-static"),
+                IF!(is_first => "is-info"),
+            ],
             "<",
             ev(Ev::Click, |_| Msg::PreviousPage)
         ],
         a![
-            C!["pagination-next", "button"],
+            C!["pagination-next", "button", IF!(is_last => "is-static")],
+            IF!(is_last => attrs!{ At::Disabled=>true }),
             ">",
             ev(Ev::Click, |_| Msg::NextPage)
         ],
         ul![
             C!["pagination-list"],
-            li![format!("{} - {} of {}", page, page + count, total)],
+            li![format!("{} - {} of {}", start, start + count, total)],
         ],
     ]
 }
 
-fn view_thread(thread_set: &ThreadSet) -> Node<Msg> {
-    assert_eq!(thread_set.0.len(), 1);
-    let thread = &thread_set.0[0];
-    assert_eq!(thread.0.len(), 1);
-    let thread_node = &thread.0[0];
-    let subject = first_subject(&thread_node).unwrap_or("<No subject>".to_string());
-    set_title(&subject);
-    div![
-        h1![subject],
-        a![
-            attrs! {At::Href=>api::original(&thread_node.0.as_ref().expect("message missing").id)},
-            "Original"
-        ],
-        view_message(&thread_node),
-        div![
-            C!["debug"],
-            "Add zippy for debug dump",
-            view_debug_thread_set(thread_set)
-        ] /* pre![format!("Thread: {:#?}", thread_set).replace("    ", "  ")] */
-    ]
-}
-
-fn view_debug_thread_set(thread_set: &ThreadSet) -> Node<Msg> {
-    ul![thread_set
-        .0
-        .iter()
-        .enumerate()
-        .map(|(i, t)| { li!["t", i, ": ", view_debug_thread(t),] })]
-}
-fn view_debug_thread(thread: &Thread) -> Node<Msg> {
-    ul![thread
-        .0
-        .iter()
-        .enumerate()
-        .map(|(i, tn)| { li!["tn", i, ": ", view_debug_thread_node(tn),] })]
-}
-
-fn view_debug_thread_node(thread_node: &ThreadNode) -> Node<Msg> {
-    ul![
-        IF!(thread_node.0.is_some()=>li!["tn id:", &thread_node.0.as_ref().unwrap().id]),
-        thread_node.1.iter().enumerate().map(|(i, tn)| li![
-            "tn",
-            i,
-            ": ",
-            view_debug_thread_node(tn)
-        ])
-    ]
-}
-
 fn view_header(query: &str, refresh_request: &RefreshingState) -> Node<Msg> {
     let is_loading = refresh_request == &RefreshingState::Loading;
     let is_error = if let RefreshingState::Error(err) = refresh_request {
@@ -620,13 +460,17 @@ fn view_header(query: &str, refresh_request: &RefreshingState) -> Node<Msg> {
             ],
             a![
                 C!["navbar-item", "button"],
+                attrs! {
+                    At::Href => urls::search("is:unread", 0)
+                },
                 "Unread",
-                ev(Ev::Click, |_| Msg::SearchRequest("is:unread".to_string())),
             ],
             a![
                 C!["navbar-item", "button"],
+                attrs! {
+                    At::Href => urls::search("", 0)
+                },
                 "All",
-                ev(Ev::Click, |_| Msg::SearchRequest("".to_string())),
             ],
             input![
                 C!["navbar-item", "input"],
@@ -635,12 +479,18 @@ fn view_header(query: &str, refresh_request: &RefreshingState) -> Node<Msg> {
                     At::AutoFocus => true.as_at_value();
                     At::Value => query,
                 },
-                input_ev(Ev::Input, |q| Msg::SearchRequest(
-                    Url::encode_uri_component(q)
-                )),
+                input_ev(Ev::Input, |q| Msg::SearchRequest {
+                    query: Url::encode_uri_component(q),
+                    page: 0,
+                    results_per_page: SEARCH_RESULTS_PER_PAGE,
+                }),
                 // Resend search on enter.
                 keyboard_ev(Ev::KeyUp, move |e| if e.key_code() == 0x0d {
-                    Msg::SearchRequest(Url::encode_uri_component(query))
+                    Msg::SearchRequest {
+                        query: Url::encode_uri_component(query),
+                        page: 0,
+                        results_per_page: SEARCH_RESULTS_PER_PAGE,
+                    }
                 } else {
                     Msg::Noop
                 }),
@@ -659,6 +509,13 @@ fn view_footer(render_time_ms: u128) -> Node<Msg> {
     ]
 }
 
+fn view_thread(messages: &[shared::Message]) -> Node<Msg> {
+    div![
+        "MESSAGES GO HERE",
+        ol![messages.iter().map(|msg| li![format!("{:?}", msg)])]
+    ]
+}
+
 fn view_desktop(model: &Model) -> Node<Msg> {
     let content = match &model.context {
         Context::None => div![h1!["Loading"]],

web/src/nm.rs

@@ -0,0 +1,193 @@
+use notmuch::{Content, Part, Thread, ThreadNode, ThreadSet};
+use seed::{prelude::*, *};
+use serde::de::Deserialize;
+
+use crate::{api, set_title, Msg};
+
+pub async fn show_request(tid: &str) -> fetch::Result<ThreadSet> {
+    let b = Request::new(api::show(tid))
+        .method(Method::Get)
+        .fetch()
+        .await?
+        .check_status()?
+        .bytes()
+        .await?;
+    let mut deserializer = serde_json::Deserializer::from_slice(&b);
+    deserializer.disable_recursion_limit();
+    Ok(ThreadSet::deserialize(&mut deserializer)
+        .map_err(|_| FetchError::JsonError(fetch::JsonError::Serde(JsValue::NULL)))?)
+}
+
+pub fn view_thread(thread_set: &ThreadSet) -> Node<Msg> {
+    assert_eq!(thread_set.0.len(), 1);
+    let thread = &thread_set.0[0];
+    assert_eq!(thread.0.len(), 1);
+    let thread_node = &thread.0[0];
+    let subject = first_subject(&thread_node).unwrap_or("<No subject>".to_string());
+    set_title(&subject);
+    div![
+        h1![subject],
+        a![
+            attrs! {At::Href=>api::original(&thread_node.0.as_ref().expect("message missing").id)},
+            "Original"
+        ],
+        view_message(&thread_node),
+        div![
+            C!["debug"],
+            "Add zippy for debug dump",
+            view_debug_thread_set(thread_set)
+        ] /* pre![format!("Thread: {:#?}", thread_set).replace("    ", "  ")] */
+    ]
+}
+
+// <subject>
+// <tags>
+//
+// <from1> <date>
+// <to1>
+// <content1>
+// <zippy>
+// <children1>
+// </zippy>
+//
+// <from2> <date>
+// <to2>
+// <body2>
+fn view_message(thread: &ThreadNode) -> Node<Msg> {
+    let message = thread.0.as_ref().expect("ThreadNode missing Message");
+    let children = &thread.1;
+    div![
+        C!["message"],
+        /* TODO(wathiede): collect all the tags and show them here. */
+        /* TODO(wathiede): collect all the attachments from all the subparts */
+        div![C!["header"], "From: ", &message.headers.from],
+        div![C!["header"], "Date: ", &message.headers.date],
+        div![C!["header"], "To: ", &message.headers.to],
+        hr![],
+        div![
+            C!["body"],
+            match &message.body {
+                Some(body) => view_body(body.as_slice()),
+                None => div!["<no body>"],
+            },
+        ],
+        children.iter().map(view_message)
+    ]
+}
+
+fn view_body(body: &[Part]) -> Node<Msg> {
+    div![body.iter().map(view_part)]
+}
+
+fn view_text_plain(content: &Option<Content>) -> Node<Msg> {
+    match &content {
+        Some(Content::String(content)) => p![C!["view-part-text-plain"], content],
+        _ => div![
+            C!["error"],
+            format!("Unhandled content enum for text/plain"),
+        ],
+    }
+}
+
+fn view_part(part: &Part) -> Node<Msg> {
+    match part.content_type.as_str() {
+        "text/plain" => view_text_plain(&part.content),
+        "text/html" => {
+            if let Some(Content::String(html)) = &part.content {
+                let inliner = css_inline::CSSInliner::options()
+                    .load_remote_stylesheets(false)
+                    .remove_style_tags(true)
+                    .build();
+                let inlined = inliner.inline(html).expect("failed to inline CSS");
+
+                return div![C!["view-part-text-html"], div!["TEST"], raw![&inlined]];
+            } else {
+                div![
+                    C!["error"],
+                    format!("Unhandled content enum for multipart/mixed"),
+                ]
+            }
+        }
+
+        // https://en.wikipedia.org/wiki/MIME#alternative
+        // RFC1341 states: In general, user agents that compose multipart/alternative entities
+        // should place the body parts in increasing order of preference, that is, with the
+        // preferred format last.
+        "multipart/alternative" => {
+            if let Some(Content::Multipart(parts)) = &part.content {
+                for part in parts.iter().rev() {
+                    if part.content_type == "text/html" {
+                        if let Some(Content::String(html)) = &part.content {
+                            let inliner = css_inline::CSSInliner::options()
+                                .load_remote_stylesheets(false)
+                                .remove_style_tags(true)
+                                .build();
+                            let inlined = inliner.inline(html).expect("failed to inline CSS");
+                            return div![Node::from_html(None, &inlined)];
+                        }
+                    }
+                    if part.content_type == "text/plain" {
+                        return view_text_plain(&part.content);
+                    }
+                }
+                div!["No known  multipart/alternative parts"]
+            } else {
+                div![
+                    C!["error"],
+                    format!("multipart/alternative with non-multipart content"),
+                ]
+            }
+        }
+        "multipart/mixed" => match &part.content {
+            Some(Content::Multipart(parts)) => div![parts.iter().map(view_part)],
+            _ => div![
+                C!["error"],
+                format!("Unhandled content enum for multipart/mixed"),
+            ],
+        },
+        _ => div![
+            C!["error"],
+            format!("Unhandled content type: {}", part.content_type)
+        ],
+    }
+}
+
+fn first_subject(thread: &ThreadNode) -> Option<String> {
+    if let Some(msg) = &thread.0 {
+        return Some(msg.headers.subject.clone());
+    } else {
+        for tn in &thread.1 {
+            if let Some(s) = first_subject(&tn) {
+                return Some(s);
+            }
+        }
+    }
+    None
+}
+
+fn view_debug_thread_set(thread_set: &ThreadSet) -> Node<Msg> {
+    ul![thread_set
+        .0
+        .iter()
+        .enumerate()
+        .map(|(i, t)| { li!["t", i, ": ", view_debug_thread(t),] })]
+}
+fn view_debug_thread(thread: &Thread) -> Node<Msg> {
+    ul![thread
+        .0
+        .iter()
+        .enumerate()
+        .map(|(i, tn)| { li!["tn", i, ": ", view_debug_thread_node(tn),] })]
+}
+
+fn view_debug_thread_node(thread_node: &ThreadNode) -> Node<Msg> {
+    ul![
+        IF!(thread_node.0.is_some()=>li!["tn id:", &thread_node.0.as_ref().unwrap().id]),
+        thread_node.1.iter().enumerate().map(|(i, tn)| li![
+            "tn",
+            i,
+            ": ",
+            view_debug_thread_node(tn)
+        ])
+    ]
+}