Skip to content

[FEATURE]: Add "Recently Viewed" and "Picks For You" sections on Homepage #368

Description

@ida-jemi

Feature description

Add two new personalized sections to the homepage, alongside the existing "Trending Right Now" and "Best Sellers":

  • Recently Viewed : shows the last 6-8 products the logged-in user viewed (most recent first), with a "Clear history" option.
  • Picks For You : a lightweight personalized recommendation row generated from signals the platform already has: items in the user's wishlist/cart, categories of recently viewed products, and purchase history. Falls back to trending/best-seller items for new users with no activity yet.

Why this feature?

The homepage currently only shows generic, non-personalized rows (Trending, Best Sellers). It has no memory of what an individual user has looked at or shown interest in, even though that data (wishlist, cart, view history) already exists elsewhere in the app. Every major e-commerce platform (Amazon, Flipkart, Myntra) surfaces "Recently Viewed" and "Because you liked X" rows on the homepage, it's a baseline expectation now, and it directly drives repeat engagement and conversion by reminding users of items they almost bought.

Implementation ideas

  • Backend:
    • New ViewHistory model: { userId, productId, viewedAt }, capped at last ~20 entries per user (TTL index or trim on insert).
    • Log a view event on GET /api/products/:id (debounced so refreshing doesn't spam the same entry).
    • New endpoint GET /api/users/recently-viewed → returns hydrated product details for the last N viewed items.
    • New endpoint GET /api/users/picks-for-you → simple rule-based scoring: weight categories from wishlist + cart + view history, return top-N products in those categories that the user hasn't already purchased. (No ML needed for v1 - can iterate later.)
  • Frontend:
    • New RecentlyViewed and PicksForYou components, styled consistently with the existing Best Sellers / Trending Right Now carousels.
    • Fetch via existing API client pattern, render only if the array is non-empty (hide section entirely for first-time visitors with no history).
    • Guest/logged-out users: store view history in localStorage as a fallback so the section isn't empty before sign-in.

Metadata

Metadata

Assignees

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions