hanna/fabrica

feat(web): paginate dashboard activity; label + language-bar fixes

d1603bb · hanna committed on 2026-07-25

Paginate the dashboard "Recent activity" feed (retain up to 100 commits, 10 per
page with prev/next + a page-size selector that preserves the repo-search term).
Lay label descriptions to the right of the chip instead of below. Fully hide the
language-bar <details> disclosure triangle (display:block on the summary) so it
no longer shows or reserves left indent.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Signed by hannaSSH key fingerprint: SHA256:4g9cWhkAAw8gwqhJUcVbSnGEvdGwklW+1Aa/fMUu59k

assets/base.css +13 −3

crates/web/src/activity.rs +20 −5

crates/web/src/pages.rs +4 −3

+}
 .label-list .entry-row-body {
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
-  gap: 0.25rem;
+  align-items: center;
-  align-items: flex-start;
+  gap: 0.6rem;
+  flex-wrap: wrap;
+}
+.label-list .entry-row-meta {
+  margin: 0;
+}
 .label-add {
   display: flex;
   margin: 0 0 1rem;
+}
 .lang-bar-summary {
+  /* `display: block` drops the default disclosure triangle (and the indent it
+     reserves) in Chromium; the list-style/marker resets cover other engines. */
+  display: block;
   list-style: none;
   cursor: pointer;
+}
 .lang-bar-summary::-webkit-details-marker {
   display: none;
+}
+.lang-bar-summary::marker {
+  content: "";
+}
 .lang-bar {
   display: flex;
   height: 0.6rem;

 const WEEKS: usize = 53;
 /// Commits scanned per repo on its default branch — bounds dashboard cost.
 const SCAN_PER_REPO: usize = 400;
-/// Recent commits shown in the activity feed.
+/// The most recent commits retained for the (paginated) activity feed.
-const FEED_LIMIT: usize = 20;
+const FEED_LIMIT: usize = 100;
 /// One commit in the activity feed.
 pub struct FeedItem {
+        }
+    }
-    /// Render the recent-activity commit feed.
+    /// Render the recent-activity commit feed, paginated. `path`/`query` are the
-    pub fn feed_section(&self, now_ms: i64) -> Markup {
+    /// dashboard URL and its query (so the page-size selector and prev/next keep
+    /// any repo-search term).
+    pub fn feed_section(
+        &self,
+        now_ms: i64,
+        paging: crate::repo::Pagination,
+        path: &str,
+        query: Option<&str>,
+    ) -> Markup {
+        let start = paging.offset().min(self.feed.len());
+        let end = start.saturating_add(paging.per_page).min(self.feed.len());
+        let page = &self.feed[start..end];
+        let has_next = end < self.feed.len();
         html! {
             section class="listing" {
                 h2 { "Recent activity" }
                     div class="card" { p class="muted" { "No recent activity." } }
                 } @else {
                     ul class="activity-feed card" {
-                        @for item in &self.feed {
+                        @for item in page {
                             @let base = format!("/{}/{}", item.owner, item.repo);
                             li class="activity-item" {
                                 div class="activity-head muted" {
+                            }
+                        }
+                    }
+                    @if has_next || paging.page > 1 {
+                        (crate::repo::pagination_nav(path, query, paging, has_next))
+                    }
+                }
+            }
+        }

 ) -> AppResult<Response> {
     let (jar, chrome) = build_chrome(&state, jar, user.clone(), uri.path().to_string());
     if let Some(u) = user {
-        let body = dashboard_body(&state, &u, &lq.q.unwrap_or_default()).await?;
+        let body = dashboard_body(&state, &u, &lq.q.unwrap_or_default(), &uri).await?;
         Ok((jar, page(&chrome, "Dashboard", body)).into_response())
     } else {
         let body = explore_repos_body(&state, "").await?;
 /// The dashboard: the viewer's contribution activity and recent commits, beside
 /// a filterable list of their repositories.
-async fn dashboard_body(state: &AppState, user: &User, q: &str) -> AppResult<Markup> {
+async fn dashboard_body(state: &AppState, user: &User, q: &str, uri: &Uri) -> AppResult<Markup> {
     let now = now_ms();
     let activity = crate::activity::compute(state, user, now).await?;
+    let paging = repo::Pagination::from_query(uri.query());
     let mine = state.store.repos_by_owner(&user.id).await?;
     let needle = q.trim().to_lowercase();
         div class="dashboard" {
             div class="dashboard-main" {
                 (activity.heatmap())
-                (activity.feed_section(now))
+                (activity.feed_section(now, paging, uri.path(), uri.query()))
+            }
             aside class="dashboard-side" {
                 form class="search-row" method="get" {