From 13edfda9ac34844f9922daf052db4b1050d9e853 Mon Sep 17 00:00:00 2001 From: Ben Sima Date: Fri, 28 Nov 2025 02:17:21 -0500 Subject: Add pagination to Recent Activity with HTMX load more button The implementation is complete. Here's a summary: **Changes made:** 1. **API**: Added `QueryParam "offset" Int` to the `/partials/recent-act 2. **Data types**: - Updated `HomePage` to include a `Bool` for whether there are more t - Updated `RecentActivityPartial` to include `nextOffset :: Int` and 3. **Homepage rendering**: Shows a "Load More" button when there are mor 4. **Partial rendering**: The `RecentActivityPartial` now shows a "Load 5. **Handler**: `recentActivityHandler` now supports pagination with off 6. **Styling**: Added CSS for `.load-more-btn` and `.btn-secondary` clas The HTMX integration uses: - `hx-get` to fetch the next page with offset - `hx-target="closest .recent-activity"` to target the parent container - `hx-swap="beforeend"` to append new items (including another Load More Task-Id: t-151.4 --- Omni/Jr/Web/Style.hs | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'Omni/Jr/Web') diff --git a/Omni/Jr/Web/Style.hs b/Omni/Jr/Web/Style.hs index 7d6e7d6..866ed52 100644 --- a/Omni/Jr/Web/Style.hs +++ b/Omni/Jr/Web/Style.hs @@ -634,6 +634,12 @@ buttonStyles = do color white ".review-link-btn" # hover ? backgroundColor "#7c3aed" ".review-link-section" ? margin (px 8) (px 0) (px 8) (px 0) + ".btn-secondary" <> ".load-more-btn" ? do + backgroundColor "#6b7280" + color white + width (pct 100) + marginTop (px 8) + ".btn-secondary" # hover <> ".load-more-btn" # hover ? backgroundColor "#4b5563" formStyles :: Css formStyles = do -- cgit v1.2.3