list archive

src/views.rs

@@ -192,6 +192,7 @@ pub fn lists_page(
                     div class="panel-heading" {
                         h2 { "Lists" }
                         span class="count-badge" { (lists.len()) }
+                        a class="archive-link" href="/archive" { "Archived →" }
                     }
                     @if lists.is_empty() {
                         div class="empty-state" {
@@ -242,6 +243,49 @@ pub fn lists_page(
     )
 }
 
+pub fn archive_page(user: &User, archived_lists: &[GroceryList]) -> Markup {
+    page(
+        "Archive",
+        Some(user),
+        html! {
+            div class="page-heading" {
+                div {
+                    p class="eyebrow" { "ARCHIVE" }
+                    h1 class="page-title" { "Archived lists" }
+                    p class="lede" { "Past lists, kept for reference." }
+                }
+                a class="button button-quiet" href="/lists" { "← Back to lists" }
+            }
+            section class="panel" {
+                div class="panel-heading" {
+                    h2 { "Archive" }
+                    span class="count-badge" { (archived_lists.len()) }
+                }
+                @if archived_lists.is_empty() {
+                    div class="empty-state" {
+                        div class="empty-mark" { "🗄" }
+                        h3 { "Nothing archived yet" }
+                        p { "Archive a list and it will show up here." }
+                    }
+                } @else {
+                    div class="list-cards" {
+                        @for list in archived_lists {
+                            a class="list-card archived-list-card" href=(format!("/lists/{}", list.id)) {
+                                span class="list-card-icon" { "🗄" }
+                                span class="list-card-copy" {
+                                    strong { (list.name) }
+                                    small { "Created " (format_date(list.created_at)) }
+                                }
+                                span class="list-card-arrow" { "→" }
+                            }
+                        }
+                    }
+                }
+            }
+        },
+    )
+}
+
 pub fn meals_page(
     user: &User,
     meals: &[Meal],
@@ -712,6 +756,13 @@ mod tests {
         assert!(html.contains("<strong>"), "expected <strong>, got: {html}");
         assert!(html.contains("<em>"), "expected <em>, got: {html}");
     }
+
+    #[test]
+    fn format_date_renders_human_readable_date() {
+        // 2026-08-07T00:00:00Z in Unix seconds.
+        let ts = 1_786_060_800;
+        assert_eq!(format_date(ts), "7 Aug 2026");
+    }
 }
 
 pub fn list_page(
@@ -733,6 +784,9 @@ pub fn list_page(
                     span class="live-pill" { span class="live-dot" {} "Live" }
                 }
             }
+            @if let Some(ts) = list.archived_at {
+                div class="archived-banner" { "This list was archived on " (format_date(ts)) "." }
+            }
             div id="meal-picker" class="meal-picker" {}
             div class="list-layout" {
                 section class="panel list-panel" {
@@ -742,11 +796,24 @@ pub fn list_page(
                             h1 { (list.name) }
                             p class="list-meta" { (items.iter().filter(|item| !item.checked).count()) " items to get" }
                         }
+                        div class="list-topbar-actions" {
+                            @if list.archived_at.is_some() {
+                                form method="post" action=(format!("/lists/{}/unarchive", list.id)) {
+                                    input type="hidden" name="csrf" value=(csrf_token);
+                                    button class="button button-small button-quiet" type="submit" { "Restore" }
+                                }
+                            } @else {
+                                form method="post" action=(format!("/lists/{}/archive", list.id)) {
+                                    input type="hidden" name="csrf" value=(csrf_token);
+                                    button class="button button-small button-quiet" type="submit" { "Archive" }
+                                }
+                            }
+                        }
                     }
-                    (list_content_fragment(list, items, categories, csrf_token, false))
+                    (list_content_fragment(list, items, categories, csrf_token, false, list.archived_at.is_none()))
                 }
                 aside class="side-column" {
-                    (list_meals_panel(list_meals, list.id, csrf_token, false))
+                    (list_meals_panel(list_meals, list.id, csrf_token, false, list.archived_at.is_none()))
                     (presence_panel(presence, false))
                     section class="panel tip-panel" {
                         span class="tip-label" { "TIP" }
@@ -765,17 +832,18 @@ pub fn list_content_fragment(
     categories: &[Category],
     csrf_token: &str,
     out_of_band: bool,
+    editable: bool,
 ) -> Markup {
     if out_of_band {
         html! {
             div id="list-content" hx-swap-oob="outerHTML" {
-                (list_content(list, items, categories, csrf_token))
+                (list_content(list, items, categories, csrf_token, editable))
             }
         }
     } else {
         html! {
             div id="list-content" {
-                (list_content(list, items, categories, csrf_token))
+                (list_content(list, items, categories, csrf_token, editable))
             }
         }
     }
@@ -786,26 +854,29 @@ fn list_content(
     items: &[Item],
     categories: &[Category],
     csrf_token: &str,
+    editable: bool,
 ) -> Markup {
     html! {
-        form
-            id="add-item-form"
-            class="add-item-form"
-            hx-post=(format!("/lists/{}/items", list.id))
-            hx-target="#list-items"
-            hx-swap="outerHTML"
-            hx-on::after-request="if (event.detail.successful) this.reset()"
-        {
-            input type="hidden" name="csrf" value=(csrf_token);
-            label class="sr-only" for="item-name" { "Item name" }
-            input id="item-name" name="name" type="text" maxlength="120" placeholder="Add an item..." autocomplete="off" required;
-            select id="item-category" name="category_id" aria-label="Category" {
-                (category_options(categories, None))
+        @if editable {
+            form
+                id="add-item-form"
+                class="add-item-form"
+                hx-post=(format!("/lists/{}/items", list.id))
+                hx-target="#list-items"
+                hx-swap="outerHTML"
+                hx-on::after-request="if (event.detail.successful) this.reset()"
+            {
+                input type="hidden" name="csrf" value=(csrf_token);
+                label class="sr-only" for="item-name" { "Item name" }
+                input id="item-name" name="name" type="text" maxlength="120" placeholder="Add an item..." autocomplete="off" required;
+                select id="item-category" name="category_id" aria-label="Category" {
+                    (category_options(categories, None))
+                }
+                input id="item-quantity" name="quantity" type="text" maxlength="40" placeholder="Qty" aria-label="Quantity";
+                button id="add-item-button" class="button button-primary add-button" type="submit" { "+ Add" }
             }
-            input id="item-quantity" name="quantity" type="text" maxlength="40" placeholder="Qty" aria-label="Quantity";
-            button id="add-item-button" class="button button-primary add-button" type="submit" { "+ Add" }
         }
-        (list_items_fragment(list, items, categories, csrf_token, false))
+        (list_items_fragment(list, items, categories, csrf_token, false, editable))
     }
 }
 
@@ -815,23 +886,29 @@ pub fn list_items_fragment(
     categories: &[Category],
     csrf_token: &str,
     out_of_band: bool,
+    editable: bool,
 ) -> Markup {
     if out_of_band {
         html! {
             div id="list-items" class="items" data-revision=(list.revision) hx-swap-oob="outerHTML" {
-                (list_items_content(items, categories, csrf_token))
+                (list_items_content(items, categories, csrf_token, editable))
             }
         }
     } else {
         html! {
             div id="list-items" class="items" data-revision=(list.revision) {
-                (list_items_content(items, categories, csrf_token))
+                (list_items_content(items, categories, csrf_token, editable))
             }
         }
     }
 }
 
-fn list_items_content(items: &[Item], categories: &[Category], csrf_token: &str) -> Markup {
+fn list_items_content(
+    items: &[Item],
+    categories: &[Category],
+    csrf_token: &str,
+    editable: bool,
+) -> Markup {
     html! {
         @if items.is_empty() {
             div class="empty-items" {
@@ -842,7 +919,7 @@ fn list_items_content(items: &[Item], categories: &[Category], csrf_token: &str)
         } @else {
             div class="item-list" {
                 @for group in item_groups(items, categories) {
-                    (category_group(&group.0, &group.1, categories, csrf_token))
+                    (category_group(&group.0, &group.1, categories, csrf_token, editable))
                 }
             }
         }
@@ -876,32 +953,37 @@ fn category_group(
     items: &[&Item],
     categories: &[Category],
     csrf_token: &str,
+    editable: bool,
 ) -> Markup {
     html! {
         section class="category-group" {
             h2 class="category-heading" { (name) }
             @for item in items {
-                (item_row(item, categories, csrf_token))
+                (item_row(item, categories, csrf_token, editable))
             }
         }
     }
 }
 
-fn item_row(item: &Item, categories: &[Category], csrf_token: &str) -> Markup {
+fn item_row(item: &Item, categories: &[Category], csrf_token: &str, editable: bool) -> Markup {
     let next_checked = if item.checked { "0" } else { "1" };
     html! {
         article class=(if item.checked { "item-row is-checked" } else { "item-row" }) id=(format!("item-{}", item.id)) data-version=(item.version) {
-            form
-                class="check-form"
-                hx-post=(format!("/lists/{}/items/{}/check", item.list_id, item.id))
-                hx-target="#list-items"
-                hx-swap="outerHTML"
-            {
-                input type="hidden" name="csrf" value=(csrf_token);
-                input type="hidden" name="checked" value=(next_checked);
-                button id=(format!("item-check-{}", item.id)) class="check-button" type="submit" aria-label=(if item.checked { "Mark unchecked" } else { "Mark complete" }) {
-                    @if item.checked { "✓" } @else { "" }
+            @if editable {
+                form
+                    class="check-form"
+                    hx-post=(format!("/lists/{}/items/{}/check", item.list_id, item.id))
+                    hx-target="#list-items"
+                    hx-swap="outerHTML"
+                {
+                    input type="hidden" name="csrf" value=(csrf_token);
+                    input type="hidden" name="checked" value=(next_checked);
+                    button id=(format!("item-check-{}", item.id)) class="check-button" type="submit" aria-label=(if item.checked { "Mark unchecked" } else { "Mark complete" }) {
+                        @if item.checked { "✓" } @else { "" }
+                    }
                 }
+            } @else if item.checked {
+                span class="check-button check-button-static" { "✓" }
             }
             label class="item-copy" for=(format!("item-check-{}", item.id)) {
                 @if !item.quantity.is_empty() {
@@ -912,39 +994,41 @@ fn item_row(item: &Item, categories: &[Category], csrf_token: &str) -> Markup {
                     small { (item.note) }
                 }
             }
-            button type="button" class="item-actions-button" aria-label="Item actions" onclick=(format!("document.getElementById('item-edit-{}').showModal()", item.id)) { "•••" }
-            dialog id=(format!("item-edit-{}", item.id)) class="item-modal" {
-                div class="item-modal-card" {
-                    div class="item-modal-header" {
-                        h3 { (item.name) }
-                        button type="button" class="meal-picker-close" aria-label="Close" onclick="this.closest('dialog').close()" { "✕" }
-                    }
-                    form
-                        hx-post=(format!("/lists/{}/items/{}/edit", item.list_id, item.id))
-                        hx-target="#list-items"
-                        hx-swap="outerHTML"
-                        class="stack"
-                    {
-                        input type="hidden" name="csrf" value=(csrf_token);
-                        label { "Name" }
-                        input id=(format!("item-edit-name-{}", item.id)) name="name" value=(item.name) maxlength="120" required;
-                        label { "Category" }
-                        select id=(format!("item-edit-category-{}", item.id)) name="category_id" {
-                            (category_options(categories, item.category_id))
+            @if editable {
+                button type="button" class="item-actions-button" aria-label="Item actions" onclick=(format!("document.getElementById('item-edit-{}').showModal()", item.id)) { "•••" }
+                dialog id=(format!("item-edit-{}", item.id)) class="item-modal" {
+                    div class="item-modal-card" {
+                        div class="item-modal-header" {
+                            h3 { (item.name) }
+                            button type="button" class="meal-picker-close" aria-label="Close" onclick="this.closest('dialog').close()" { "✕" }
+                        }
+                        form
+                            hx-post=(format!("/lists/{}/items/{}/edit", item.list_id, item.id))
+                            hx-target="#list-items"
+                            hx-swap="outerHTML"
+                            class="stack"
+                        {
+                            input type="hidden" name="csrf" value=(csrf_token);
+                            label { "Name" }
+                            input id=(format!("item-edit-name-{}", item.id)) name="name" value=(item.name) maxlength="120" required;
+                            label { "Category" }
+                            select id=(format!("item-edit-category-{}", item.id)) name="category_id" {
+                                (category_options(categories, item.category_id))
+                            }
+                            label { "Quantity" }
+                            input id=(format!("item-edit-quantity-{}", item.id)) name="quantity" value=(item.quantity) maxlength="40";
+                            label { "Note" }
+                            input id=(format!("item-edit-note-{}", item.id)) name="note" value=(item.note) maxlength="120";
+                            button id=(format!("item-edit-save-{}", item.id)) class="button button-primary" type="submit" { "Save" }
+                        }
+                        form
+                            hx-post=(format!("/lists/{}/items/{}/delete", item.list_id, item.id))
+                            hx-target="#list-items"
+                            hx-swap="outerHTML"
+                        {
+                            input type="hidden" name="csrf" value=(csrf_token);
+                            button id=(format!("item-edit-delete-{}", item.id)) class="button button-danger" type="submit" { "Remove item" }
                         }
-                        label { "Quantity" }
-                        input id=(format!("item-edit-quantity-{}", item.id)) name="quantity" value=(item.quantity) maxlength="40";
-                        label { "Note" }
-                        input id=(format!("item-edit-note-{}", item.id)) name="note" value=(item.note) maxlength="120";
-                        button id=(format!("item-edit-save-{}", item.id)) class="button button-primary" type="submit" { "Save" }
-                    }
-                    form
-                        hx-post=(format!("/lists/{}/items/{}/delete", item.list_id, item.id))
-                        hx-target="#list-items"
-                        hx-swap="outerHTML"
-                    {
-                        input type="hidden" name="csrf" value=(csrf_token);
-                        button id=(format!("item-edit-delete-{}", item.id)) class="button button-danger" type="submit" { "Remove item" }
                     }
                 }
             }
@@ -1017,9 +1101,10 @@ pub fn live_list_fragments(
     list_meals: &[ListMeal],
     csrf_token: &str,
 ) -> Markup {
+    let editable = list.archived_at.is_none();
     html! {
-        (list_content_fragment(list, items, categories, csrf_token, true))
-        (list_meals_panel(list_meals, list.id, csrf_token, true))
+        (list_content_fragment(list, items, categories, csrf_token, true, editable))
+        (list_meals_panel(list_meals, list.id, csrf_token, true, editable))
     }
 }
 
@@ -1028,6 +1113,7 @@ pub fn list_meals_panel(
     list_id: i64,
     csrf_token: &str,
     out_of_band: bool,
+    editable: bool,
 ) -> Markup {
     let panel = html! {
         div class="panel-heading" {
@@ -1042,20 +1128,24 @@ pub fn list_meals_panel(
                     div class="list-meal-row" {
                         span class="list-meal-icon" { "🍽" }
                         span class="list-meal-name" { (meal.name) }
-                        form
-                            hx-post=(format!("/lists/{}/meals/{}/remove", list_id, meal.id))
-                            hx-target="#list-items"
-                            hx-swap="outerHTML"
-                            class="list-meal-remove"
-                        {
-                            input type="hidden" name="csrf" value=(csrf_token);
-                            button type="submit" class="list-meal-remove-button" aria-label=(format!("Remove {} from list", meal.name)) { "✕" }
+                        @if editable {
+                            form
+                                hx-post=(format!("/lists/{}/meals/{}/remove", list_id, meal.id))
+                                hx-target="#list-items"
+                                hx-swap="outerHTML"
+                                class="list-meal-remove"
+                            {
+                                input type="hidden" name="csrf" value=(csrf_token);
+                                button type="submit" class="list-meal-remove-button" aria-label=(format!("Remove {} from list", meal.name)) { "✕" }
+                            }
                         }
                     }
                 }
             }
         }
-        button class="button button-small add-meal-button" hx-get=(format!("/meals?picker={}", list_id)) hx-target="#meal-picker" hx-swap="innerHTML" { "+ Add meal" }
+        @if editable {
+            button class="button button-small add-meal-button" hx-get=(format!("/meals?picker={}", list_id)) hx-target="#meal-picker" hx-swap="innerHTML" { "+ Add meal" }
+        }
     };
 
     if out_of_band {
@@ -1153,6 +1243,32 @@ pub fn invite_result(url: &str) -> Markup {
     }
 }
 
+/// Formats a Unix timestamp as a human-readable date (e.g. "7 Aug 2026").
+fn format_date(timestamp: i64) -> String {
+    let days = timestamp.div_euclid(86_400);
+    let (y, m, d) = civil_from_days(days);
+    const MONTHS: [&str; 12] = [
+        "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov",
+        "Dec",
+    ];
+    format!("{} {} {}", d, MONTHS[(m - 1) as usize], y)
+}
+
+/// Converts a count of days since the Unix epoch into a (year, month, day)
+/// civil date using Howard Hinnant's `civil_from_days` algorithm.
+fn civil_from_days(z: i64) -> (i64, i64, i64) {
+    let z = z + 719_468;
+    let era = z.div_euclid(146_097);
+    let doe = z.rem_euclid(146_097);
+    let yoe = (doe - doe / 1460 + doe / 36524 - doe / 146096) / 365;
+    let y = yoe + era * 400;
+    let doy = doe - (365 * yoe + yoe / 4 - yoe / 100);
+    let mp = (5 * doy + 2) / 153;
+    let d = doy - (153 * mp + 2) / 5 + 1;
+    let m = if mp < 10 { mp + 3 } else { mp - 9 };
+    (if m <= 2 { y + 1 } else { y }, m, d)
+}
+
 pub fn error_page(status: &str, message: &str) -> Markup {
     page(
         status,