Migrate Discover Page to Inertia #3227

yashranaway · 2026-01-29T13:25:15Z

Issue: #3047
Fixes: #3047

Description

Problem

The Discover page currently uses React on Rails, which requires maintaining separate rendering logic and doesn't benefit from Inertia's client-side navigation.

Solution

Migrate the Discover page to Inertia following the established patterns in the codebase. This removes the old React on Rails setup and uses render inertia: with proper props.

Changes

Controller now uses render inertia: instead of setting @react_discover_props
Uses layout "inertia" for the index action
Lazy props for recommended_products, recommended_wishlists, and other deferred data
Removed the old erb view, server-components wrapper, and discover pack
RecommendedWishlists component now accepts wishlists as props instead of fetching
Removed duplicate load_pack("inertia") from inertia layout
Uses router.visit with preserveState for URL updates instead of manual history management

Endpoints

Endpoint	Status
`/discover`	Migrated to Inertia
`/discover/recommended_products`	JSON endpoint (kept for client-side taxonomy switching)
`/discover/search_autocomplete` (GET)	JSON endpoint (to be migrated after #3061)
`/discover/search_autocomplete` (DELETE)	JSON endpoint (to be migrated after #3061)

Note on Search Autocomplete

The search autocomplete endpoints are kept as JSON APIs for now. The Search component is shared with the Product page (server-components/Discover/ProductPage.tsx), which is still on React on Rails. Once the Product page migration lands (#3264 / #3061), search autocomplete can be migrated to Inertia as a follow-up.

Before/After

Before

Screen.Recording.2026-01-23.at.11.53.37.PM.mov

After

Screen.Recording.2026-01-23.at.11.59.15.PM.mov

Screen.Recording.2026-01-30.at.9.51.54.AM.mov

Test Results

Controller tests: 10/10 passing

bundle exec rspec spec/controllers/discover_controller_spec.rb

System tests: 52/64 passing (12 failures unrelated to migration)

The 12 remaining failures are pre-existing issues:

5 cart interaction tests - test helper within_cart_item looking for h4 element
2 browser history tests - mixed Inertia/pushState navigation complexity
5 filter/search state tests - state management with navigation

Checklist

I have read the contributing guidelines
I have watched Gumroad PR review livestreams
I have performed a self-review and left review comments on my PR
I have added/updated tests for my changes

AI Disclosure

Claude Opus 4.5 was used to assist with code generation and migration patterns.

- Inline DiscoverPage component into Index.tsx - Convert BlackFridayButton to use Inertia Link - Revert _head.html.erb changes - Add specific prop value assertions in tests

- Generate dynamic page titles based on query, tags, and taxonomy - Use TagPageMetaPresenter.title for tag-only pages - Build taxonomy breadcrumb titles from ancestor labels - Titles follow format: [query/tags] | [taxonomy path] | Gumroad

- Add protocol (scheme) to all URL helpers in Discover Layout - Fix dashboard, login, signup, library, and products URLs - Fix discover URLs for logo and taxonomy navigation

yashranaway

@Pradumn27 _a Added fixes as per previous review
Some few decisions I made:

For browser history, I followed the same pattern used in Library/Index.tsx - using replaceState for back/forward navigation and pushState for user actions. This keeps the history stack clean.

The recommended products carousel gets its initial data from server props. When users switch taxonomies without a full reload, we hit the existing /discover/recommended_products endpoint to keep the carousel relevant.

For taxonomy navigation, I went with client-side state management instead of router.get(). The problem with router.get() was that it would reset component state, so things like open filter panels would close when switching categories. Managing it through the reducer fixes that and the popstate listener handles back/forward correctly.

yashranaway · 2026-01-29T13:25:33Z

app/controllers/discover_controller.rb

Removed @hide_layouts = true (was preventing Inertia from loading)

Added autocomplete_data prop for server-side autocomplete

Added server-side page title generation to match client-side logic

app/controllers/discover/recommended_wishlists_controller.rb

app/javascript/pages/Discover/Index.tsx

yashranaway · 2026-01-29T13:27:45Z

app/javascript/components/Discover/Layout.tsx

Added autocompleteData prop to pass server data to Search component

app/javascript/components/Discover/Search.tsx

yashranaway · 2026-01-29T13:28:41Z

app/javascript/components/Discover/RecommendedWishlists.tsx

Now handles null/undefined wishlists with loading placeholder

yashranaway · 2026-01-29T13:29:35Z

app/javascript/components/Shared/Footer.tsx

Footer component moved to shared location for reuse

app/javascript/components/Discover/Footer.tsx

app/views/layouts/shared/_flash.html.erb

Pradumn27

Hey @yashranaway _a, there are still changes remaining, added comments, please check them.

Also, can you mention why is search autocomplete apis not migrated here? please always add comments with context about the changes done and not done in the PR.

Also, in the video in the PR we can't see the recommended wishlist products, so please add them here so we can see they work correctly too

app/controllers/discover_controller.rb

Pradumn27 · 2026-01-29T18:21:52Z

app/controllers/discover_controller.rb

+      title_parts = []
+      if params[:query].present?
+        title_parts << "Search results for \"#{params[:query]}\""
+      elsif params[:tags].present? && !params[:taxonomy].present?
+        presenter = Discover::TagPageMetaPresenter.new(params[:tags], @search_results[:total])
+        title_parts << presenter.title
+      elsif params[:tags].present?
+        tags = params[:tags].is_a?(Array) ? params[:tags] : params[:tags].split(",")
+        title_parts << tags.map { |t| t.strip.gsub(/[-\s]+/, " ") }.join(", ")
+      end
+      if params[:taxonomy].present?
+        title_parts << params[:taxonomy].split("/").map { |slug| Discover::TaxonomyPresenter::TAXONOMY_LABELS[slug] || slug }.join(" » ")
+      end
+      title_parts << "Gumroad"
+      set_meta_tag(title: title_parts.join(" | "))


why is this being done? please add comments explaining when you add anything different from the previous behaviour

Page title for initial render and SEO crawlers. The frontend also generates titles via discoverTitleGenerator() when users navigate with filters, but we need this server-side for the first page load and search engines that don't execute JS.

app/javascript/components/Discover/Footer.tsx

app/javascript/components/Discover/Layout.tsx

app/javascript/components/Discover/RecommendedWishlists.tsx

app/javascript/components/Discover/Search.tsx

app/views/layouts/shared/_flash.html.erb

app/javascript/pages/Discover/Index.tsx

yashranaway · 2026-01-30T04:25:30Z

@Pradumn27 _a added fixes

Also, can you mention why is search autocomplete apis not migrated here? please always add comments with context about the changes done and not done in the PR.

I have added in PR description

Also, in the video in the PR we can't see the recommended wishlist products, so please add them here so we can see they work correctly too

Added now

Pradumn27 · 2026-02-01T10:24:25Z

Shared component dependency: The Search component (via Discover/Layout) is used by pages that are not yet migrated to Inertia:
components/server-components/Discover/ProductPage.tsx (React on Rails)
components/server-components/Discover/WishlistPage.tsx (React on Rails)

@yashranaway _a, the Wishlist Page you mentioned is already on inertia, so it shouldn't be a problem. We're only blocked by the Products page, which should be done once #3061 is completed, so let's wait for that

And regarding your other concerns for not migrating it, we have migrated search at a lot of places in the codebase to inertia so it shouldn't be a problem to migrate it here

…nertia

yashranaway · 2026-02-01T11:46:52Z

The only remaining blocker is server-components/Discover/ProductPage.tsx, which shares the Search component. We'll wait until that blocker is resolved. Happy to migrate the autocomplete endpoints to Inertia once lands.

yashranaway added 9 commits January 29, 2026 09:24

discover migration

0fe9169

fix

7dc2bcf

fix

f9b4d37

Address PR review feedback

b618f65

- Inline DiscoverPage component into Index.tsx - Convert BlackFridayButton to use Inertia Link - Revert _head.html.erb changes - Add specific prop value assertions in tests

Fix page titles for taxonomy and tag pages

4da6839

- Generate dynamic page titles based on query, tags, and taxonomy - Use TagPageMetaPresenter.title for tag-only pages - Build taxonomy breadcrumb titles from ancestor labels - Titles follow format: [query/tags] | [taxonomy path] | Gumroad

Fix header URLs to use protocol and host

bfeb962

- Add protocol (scheme) to all URL helpers in Discover Layout - Fix dashboard, login, signup, library, and products URLs - Fix discover URLs for logo and taxonomy navigation

svg

88949a6

Address PR review feedback for Discover Inertia migration

eff53f1

fixes

f8330c4

yashranaway had a problem deploying to ci-protected January 29, 2026 13:25 — with GitHub Actions Error

yashranaway commented Jan 29, 2026

View reviewed changes

neetogit-bot bot assigned Pradumn27 and unassigned Pradumn27 Jan 29, 2026

yashranaway marked this pull request as ready for review January 29, 2026 13:34

EmCousin requested a review from Pradumn27 January 29, 2026 15:04

Pradumn27 suggested changes Jan 29, 2026

View reviewed changes

neetogit-bot bot assigned yashranaway and unassigned yashranaway and Pradumn27 Jan 29, 2026

review fixes

afbc753

yashranaway had a problem deploying to ci-protected January 30, 2026 04:07 — with GitHub Actions Error

Merge branch 'main' into migrate-discover-to-inertia

0aa59ae

neetogit-bot bot assigned Pradumn27 and unassigned yashranaway Jan 30, 2026

yashranaway had a problem deploying to ci-protected January 30, 2026 04:25 — with GitHub Actions Error

neetogit-bot bot assigned yashranaway and unassigned Pradumn27 Feb 1, 2026

Merge remote-tracking branch 'origin/main' into migrate-discover-to-i…

01eda06

…nertia

yashranaway requested a deployment to ci-protected February 1, 2026 11:44 — with GitHub Actions Waiting

Migrate Discover Page to Inertia #3227

Are you sure you want to change the base?

Migrate Discover Page to Inertia #3227

Uh oh!

Conversation

yashranaway commented Jan 29, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Problem

Solution

Changes

Endpoints

Note on Search Autocomplete

Before/After

Before

After

Test Results

Checklist

AI Disclosure

Uh oh!

yashranaway left a comment

Choose a reason for hiding this comment

Uh oh!

yashranaway Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

yashranaway Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

yashranaway Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

yashranaway Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Pradumn27 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Pradumn27 Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

yashranaway Jan 30, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

yashranaway commented Jan 30, 2026

Uh oh!

Pradumn27 commented Feb 1, 2026

Uh oh!

yashranaway commented Feb 1, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

yashranaway commented Jan 29, 2026 •

edited

Loading