web: add UI to remove tags when viewing messages

web/src/state.rs

@@ -222,6 +222,7 @@ pub fn update(msg: Msg, model: &mut Model, orders: &mut impl Orders<Msg>) {
                 if let Err(e) = res {
                     error!("Failed to remove tag {tag} to {query}: {e}");
                 }
+                // TODO: reconsider this behavior
                 seed::window()
                     .location()
                     .set_href(&search_url)

web/src/view/desktop.rs

@@ -9,6 +9,7 @@ use crate::{
 
 #[topo::nested]
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    log::info!("tablet::view");
     let show_icon_text = true;
     // Do two queries, one without `unread` so it loads fast, then a second with unread.
     let content = match &model.context {

web/src/view/mobile.rs

@@ -10,6 +10,7 @@ use crate::{
 };
 
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    log::info!("tablet::view");
     let show_icon_text = false;
     let content = match &model.context {
         Context::None => div![h1!["Loading"]],

web/src/view/mod.rs

@@ -61,6 +61,59 @@ fn tags_chiclet(tags: &[String], is_mobile: bool) -> impl Iterator<Item = Node<M
     })
 }
 
+fn removable_tags_chiclet<'a>(
+    thread_id: &'a str,
+    tags: &'a [String],
+    is_mobile: bool,
+) -> Node<Msg> {
+    div![
+        C![
+            "message-tags",
+            "field",
+            "is-grouped",
+            "is-grouped-multiline"
+        ],
+        tags.iter().map(move |tag| {
+            let hex = compute_color(tag);
+            let style = style! {St::BackgroundColor=>hex};
+            let classes = C!["tag", IF!(is_mobile => "is-small")];
+            let attrs = attrs! {
+                At::Href => urls::search(&format!("tag:{tag}"), 0)
+            };
+            let tag = tag.clone();
+            let rm_tag = tag.clone();
+            let thread_id = format!("thread:{thread_id}");
+            div![
+                C!["control"],
+                div![
+                    C!["tags", "has-addons"],
+                    a![
+                        classes,
+                        attrs,
+                        style,
+                        match tag.as_str() {
+                            "attachment" => span!["📎"],
+                            "replied" => span![i![C!["fa-solid", "fa-reply"]]],
+                            _ => span![&tag],
+                        },
+                        ev(Ev::Click, move |_| Msg::FrontPageRequest {
+                            query: format!("tag:{tag}"),
+                            after: None,
+                            before: None,
+                            first: None,
+                            last: None,
+                        })
+                    ],
+                    a![
+                        C!["tag", "is-delete"],
+                        ev(Ev::Click, move |_| Msg::RemoveTag(thread_id, rm_tag))
+                    ]
+                ]
+            ]
+        })
+    ]
+}
+
 fn pretty_authors(authors: &str) -> impl Iterator<Item = Node<Msg>> + '_ {
     let one_person = authors.matches(',').count() == 0;
     let authors = authors.split(',');
@@ -748,7 +801,10 @@ fn thread(
     div![
         C!["thread"],
         h3![C!["is-size-5"], subject],
-        span![C!["tags"], tags_chiclet(&tags, false)],
+        span![
+            C!["tags"],
+            removable_tags_chiclet(&thread.thread_id, &tags, false)
+        ],
         div![
             C!["level", "is-mobile"],
             div![

web/src/view/tablet.rs

@@ -6,6 +6,7 @@ use crate::{
 };
 
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    log::info!("tablet::view");
     let show_icon_text = false;
     // Do two queries, one without `unread` so it loads fast, then a second with unread.
     let content = match &model.context {