Skip to content

feat: implement dynamic comparison routes and restructure VS page#1940

Merged
ComputelessComputer merged 7 commits intomainfrom
jj-branch-28
Nov 27, 2025
Merged

feat: implement dynamic comparison routes and restructure VS page#1940
ComputelessComputer merged 7 commits intomainfrom
jj-branch-28

Conversation

@ComputelessComputer
Copy link
Collaborator

  • Added dynamic routing for comparison pages
  • Improved competitor icon display with image and opacity
  • Exported previously local components
  • Added route for Apple Intel download page
  • Restructured VS page sections with interactive elements
  • Updated competitor comparison content with privacy-focused messaging

@netlify
Copy link

netlify bot commented Nov 27, 2025

Deploy Preview for hyprnote-storybook ready!

Name Link
🔨 Latest commit 554657e
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote-storybook/deploys/6927d59e0e5ad80008e5dba6
😎 Deploy Preview https://deploy-preview-1940--hyprnote-storybook.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@netlify
Copy link

netlify bot commented Nov 27, 2025

Deploy Preview for hyprnote ready!

Name Link
🔨 Latest commit 554657e
🔍 Latest deploy log https://app.netlify.com/projects/hyprnote/deploys/6927d59e58a4100008b0e7bd
😎 Deploy Preview https://deploy-preview-1940--hyprnote.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Nov 27, 2025

Caution

Review failed

The pull request is closed.

📝 Walkthrough

Walkthrough

This PR consolidates individual competitor comparison routes into a centralized dynamic route system. It adds a new "vs" content collection with MDX-driven content files for 19+ competitors, introduces a dynamic $slug.tsx route to render these pages, exports reusable view components from the main index file, and removes 19+ placeholder route files.

Changes

Cohort / File(s) Summary
Content Collection Configuration
apps/web/content-collections.ts
Added new "vs" collection with MDX parsing, slug generation, and schema requiring name, icon, headline, description, and metaDescription fields. Transform compiles MDX with remarkGfm and mdxMermaid.
Competitor Comparison Content
apps/web/content/vs/aside.mdx, bear.mdx, bluedot.mdx, circleback.mdx, cluely.mdx, evernote.mdx, fathom.mdx, fellow.mdx, fireflies.mdx, gong.mdx, granola.mdx, jamie.mdx, logseq.mdx, meetgeek.mdx, notability.mdx, notion.mdx, notta.mdx, obsidian.mdx, otter.mdx, read-ai.mdx, reflect.mdx, tactiq.mdx, tldv.mdx
Added 23 new MDX files defining competitor comparison pages, each with consistent frontmatter structure (name, icon URL, headline, description, metaDescription).
View Component Exports
apps/web/src/routes/_view/index.tsx
Converted five view components from private to public exports: CoolStuffSection, HowItWorksSection, MainFeaturesSection, DetailsSection, CTASection. Minor layout adjustments for consistency.
Dynamic Comparison Route
apps/web/src/routes/_view/vs/$slug.tsx
Added new dynamic route file implementing loader (fetches doc by slug from allVs collection), head function for SEO meta tags, and page component rendering HeroSection, HowItWorksSection, CoolStuffSection, MainFeaturesSection, DetailsSection, GitHubOpenSource, and CTASection with comparator UI and scroll-sync for details/features.
Removed Individual Routes
apps/web/src/routes/_view/vs/aside.tsx, bear.tsx, bluedot.tsx, circleback.tsx, cluely.tsx, evernote.tsx, fathom.tsx, fellow.tsx, fireflies.tsx, gong.tsx, granola.tsx, jamie.tsx, meetgeek.tsx, meetily.tsx, notability.tsx, notion.tsx, notta.tsx, obsidian.tsx, otter.tsx, read-ai.tsx, reflect.tsx, tactiq.tsx, tldv.tsx, route.tsx
Removed 24 placeholder route files (individual competitor routes) that were replaced by the centralized dynamic $slug.tsx route.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Router as TanStack Router
    participant Loader as $slug Loader
    participant Content as allVs Collection
    participant Page as $slug Page Component

    User->>Router: Navigate to /vs/bear
    Router->>Loader: Load route params (slug: "bear")
    Loader->>Content: Fetch doc by slug
    alt Doc found
        Content-->>Loader: Return competitor doc + MDX
        Loader-->>Router: Resolve loaderData
        Router->>Page: Render with doc + MDX
        Page->>Page: Render HeroSection (Hyprnote vs Bear)
        Page->>Page: Render HowItWorksSection
        Page->>Page: Render FeaturesList with sync
        Page->>Page: Render DetailsList with sync
        Page-->>User: Display comparison page
    else Doc not found
        Content-->>Loader: null
        Loader-->>Router: throw notFound()
        Router-->>User: Show 404
    end
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

  • Content-collections.ts addition: Verify the "vs" collection schema matches all MDX frontmatter fields and that the transform (MDX compilation, slug generation, field attachment) is correctly configured.
  • $slug.tsx route implementation: Review loader logic (slug fetching, notFound handling), head function (SEO meta tag construction from doc), page component layout assembly, HeroSection comparator UI, and scroll-sync logic between details/features sections.
  • Component exports in index.tsx: Confirm that all five exported components (CoolStuffSection, HowItWorksSection, MainFeaturesSection, DetailsSection, CTASection) are correctly wired in $slug.tsx and that removal/restructuring of FeaturesIntroSection does not break existing pages.
  • MDX files and route removals: Large volume of homogeneous changes (23 consistent MDX files, 24 identical placeholder routes) reduce per-file complexity but require spot-checking a few examples to confirm format consistency.

Areas requiring extra attention:

  • Verify that the allVs import in $slug.tsx correctly references the newly defined "vs" collection from content-collections.ts.
  • Check that slug generation in content-collections.ts matches the expected URL structure (e.g., "bear" from "bear.mdx").
  • Confirm that the HeroSection component in $slug.tsx handles both the Hyprnote branding and competitor-specific data (icon, name) correctly.
  • Validate that scroll-sync logic between MainFeaturesSection and DetailsSection refs works as intended.

Possibly related PRs

Suggested reviewers

  • yujonglee
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch jj-branch-28

📜 Recent review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 938c857 and 554657e.

⛔ Files ignored due to path filters (1)
  • apps/web/src/routeTree.gen.ts is excluded by !**/*.gen.ts
📒 Files selected for processing (50)
  • apps/web/content-collections.ts (1 hunks)
  • apps/web/content/vs/aside.mdx (1 hunks)
  • apps/web/content/vs/bear.mdx (1 hunks)
  • apps/web/content/vs/bluedot.mdx (1 hunks)
  • apps/web/content/vs/circleback.mdx (1 hunks)
  • apps/web/content/vs/cluely.mdx (1 hunks)
  • apps/web/content/vs/evernote.mdx (1 hunks)
  • apps/web/content/vs/fathom.mdx (1 hunks)
  • apps/web/content/vs/fellow.mdx (1 hunks)
  • apps/web/content/vs/fireflies.mdx (1 hunks)
  • apps/web/content/vs/gong.mdx (1 hunks)
  • apps/web/content/vs/granola.mdx (1 hunks)
  • apps/web/content/vs/jamie.mdx (1 hunks)
  • apps/web/content/vs/logseq.mdx (1 hunks)
  • apps/web/content/vs/meetgeek.mdx (1 hunks)
  • apps/web/content/vs/notability.mdx (1 hunks)
  • apps/web/content/vs/notion.mdx (1 hunks)
  • apps/web/content/vs/notta.mdx (1 hunks)
  • apps/web/content/vs/obsidian.mdx (1 hunks)
  • apps/web/content/vs/otter.mdx (1 hunks)
  • apps/web/content/vs/read-ai.mdx (1 hunks)
  • apps/web/content/vs/reflect.mdx (1 hunks)
  • apps/web/content/vs/tactiq.mdx (1 hunks)
  • apps/web/content/vs/tldv.mdx (1 hunks)
  • apps/web/src/routes/_view/index.tsx (7 hunks)
  • apps/web/src/routes/_view/vs/$slug.tsx (1 hunks)
  • apps/web/src/routes/_view/vs/aside.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/bear.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/bluedot.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/circleback.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/cluely.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/evernote.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/fathom.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/fellow.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/fireflies.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/gong.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/granola.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/jamie.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/meetgeek.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/meetily.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/notability.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/notion.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/notta.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/obsidian.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/otter.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/read-ai.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/reflect.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/route.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/tactiq.tsx (0 hunks)
  • apps/web/src/routes/_view/vs/tldv.tsx (0 hunks)

Comment @coderabbitai help to get the list of available commands and usage tips.

@ComputelessComputer ComputelessComputer merged commit f4a3d2e into main Nov 27, 2025
8 of 11 checks passed
@ComputelessComputer ComputelessComputer deleted the jj-branch-28 branch November 27, 2025 04:39
@argos-ci
Copy link

argos-ci bot commented Nov 27, 2025

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build Status Details Updated (UTC)
web (Inspect) ⚠️ Changes detected (Review) 3 changed Nov 27, 2025, 4:40 AM

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant