Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughAdds a Postgres marketing page and dataset, a client-side PostgresTabs component, updates to enterprise carousel and logo-grid (types, animations, theme images), step/active-in-view behavior to the two-column card section, and a new PPG stroke CSS variable. Changes
Estimated code review effort🎯 4 (Complex) | ⏱️ ~50 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
|
The latest updates on your projects. Learn more about Argos notifications ↗︎
|
There was a problem hiding this comment.
Actionable comments posted: 4
🧹 Nitpick comments (1)
apps/site/src/components/postgres.tsx (1)
56-61: Render the tab copy as text until this field is explicitly trusted HTML.The new
apps/site/src/data/postgres.jsonvalues are plain strings, soparse(body.content)only expands the HTML/XSS surface here. If rich markup is intentional later, sanitize it upstream and switch the wrapper to a<div>so block tags don't end up nested inside a<p>.♻️ Safer default
- <p className="text-foreground-neutral-weak text-base"> - {parse(body.content)} - </p> + <p className="text-foreground-neutral-weak text-base"> + {body.content} + </p>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/components/postgres.tsx` around lines 56 - 61, The code currently uses parse(body.content) which injects HTML; change it to render the raw string as plain text (let JSX escape it) by replacing parse(body.content) with just body.content inside the <p> so no HTML is parsed. Keep the outer <p> as-is for now; if you later intend to support trusted rich HTML, sanitize upstream and then switch the wrapper to a <div> and reintroduce parse(body.content) only after sanitization.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/site/src/app/postgres/page.tsx`:
- Around line 19-20: The create-database CTA is inconsistent and the footer
button is missing an href; standardize all CTAs to use the single CONSOLE_URL
constant defined in this module and wire the footer primary button to that same
constant. Update every occurrence where a different URL or no href is used (the
hero CTA, the video CTA reference, and the footer primary button in this
file—look for usages around the blocks that render the hero, video section, and
footer components) to reference CONSOLE_URL, and ensure the footer button
element receives an href or onClick that navigates to CONSOLE_URL so all three
CTAs behave identically.
- Around line 99-120: The metadata object currently reuses homepage values
causing duplicate content for the /postgres route; update the metadata (export
const metadata) so alternates.canonical and openGraph.url point to the /postgres
URL (e.g., "https://www.prisma.io/postgres"), replace title/description
constants (SITE_HOME_TITLE, SITE_HOME_DESCRIPTION) with the page-specific
postgres equivalents or new strings for the Postgres landing page, update
openGraph.images if needed, and mirror these page-specific title/description/url
values into the twitter block so Twitter cards and crawlers reflect /postgres
rather than the homepage.
In `@apps/site/src/components/homepage/card-section/card-section.tsx`:
- Around line 44-45: The component dereferences cardSection[0] without guarding
against an empty array; compute a safe guard like hasSteps =
Boolean(cardSection[0]?.step) at the top of the component (or return null when
cardSection.length === 0), then replace direct uses of cardSection[0].step in
the useEffect and render paths (including the block around lines 66-79) with
that hasSteps boolean and use cardSection[0] only after confirming hasSteps is
true and containerRef.current exists; update the useEffect condition from if
(!cardSection[0].step || !containerRef.current) to if (!hasSteps ||
!containerRef.current) and similarly protect any other dereferences of
cardSection[0].
- Around line 80-90: The map is calling hooks (useInView, useEffect) inside
cardSection.map which breaks the Rules of Hooks; extract each card into a new
child component (e.g., CardItem({ item, index, setActive })) and move useInView
and the useEffect that calls setActive into that component’s top level so hooks
are called consistently; update the map to return <CardItem item={item}
index={index} setActive={setActive} /> and ensure CardItem uses useInView and
calls setActive(index) when inView.
---
Nitpick comments:
In `@apps/site/src/components/postgres.tsx`:
- Around line 56-61: The code currently uses parse(body.content) which injects
HTML; change it to render the raw string as plain text (let JSX escape it) by
replacing parse(body.content) with just body.content inside the <p> so no HTML
is parsed. Keep the outer <p> as-is for now; if you later intend to support
trusted rich HTML, sanitize upstream and then switch the wrapper to a <div> and
reintroduce parse(body.content) only after sanitization.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: b8edef54-e0cd-4b65-aab4-e4ffd80059c4
⛔ Files ignored due to path filters (42)
apps/site/public/illustrations/postgres/postgres_1.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_1_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_1_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_1_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_1_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_1_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_2_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_3_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_4_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_5_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6_mobile.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6_mobile_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6_tablet.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_6_tablet_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_7.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_7_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_8.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_8_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_9.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_9_light.svgis excluded by!**/*.svg
📒 Files selected for processing (7)
apps/site/src/app/postgres/page.tsxapps/site/src/components/enterprise/carousel-item.tsxapps/site/src/components/enterprise/scroll-carousel.tsxapps/site/src/components/homepage/card-section/card-section.tsxapps/site/src/components/postgres.tsxapps/site/src/data/postgres.jsonpackages/eclipse/src/styles/globals.css
apps/site/src/components/homepage/card-section/card-section.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/components/homepage/card-section/card-section.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
apps/site/src/components/homepage/card-section/logo-grid.tsx (1)
242-250: All component variants are instantiated regardless of whichtypeis selected.This object-map pattern creates all three JSX elements upfront (including
SpotlightModetwice) before selecting one. React will execute the component functions for all of them, even though only one gets mounted.For a component that could be rendered many times on a page, consider conditional rendering to avoid the overhead:
♻️ Suggested refactor using conditional rendering
- const comps = { - track: <TrackMode logos={logos} color={color} />, - spotlight: <SpotlightMode logos={logos} color={color} />, - wrap: <SpotlightMode still logos={logos} color={color} />, - }; return ( <> <AnimationStyles /> - {comps[type]} + {type === "track" && <TrackMode logos={logos} color={color} />} + {type === "spotlight" && <SpotlightMode logos={logos} color={color} />} + {type === "wrap" && <SpotlightMode still logos={logos} color={color} />} </> );🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/components/homepage/card-section/logo-grid.tsx` around lines 242 - 250, The current comps object instantiates all variants (TrackMode, SpotlightMode) immediately, causing unnecessary renders; instead, change to conditional rendering so only the selected variant is created — replace the comps map usage around comps[type] with a conditional switch or if/else that returns <TrackMode ... />, <SpotlightMode ... /> or the "still" SpotlightMode only when type matches; keep AnimationStyles outside and pass logos and color into the rendered component (use the same props as now) so only the chosen component function (TrackMode, SpotlightMode) executes.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/site/src/components/homepage/card-section/logo-grid.tsx`:
- Around line 135-144: SpotlightMode declares a still?: boolean prop but never
uses it; update the SpotlightMode component to check still and, when true,
disable the hover/animation transforms (e.g., remove or skip adding classes like
"hover:-translate-y-0.5" and "hover:scale-[1.02]" and any transition class
application inside the mapped logo item render), so the "wrap" mode that passes
still behaves differently; implement this by conditionally composing the
className for the logo container (based on still) where the transition/hover
classes are applied.
---
Nitpick comments:
In `@apps/site/src/components/homepage/card-section/logo-grid.tsx`:
- Around line 242-250: The current comps object instantiates all variants
(TrackMode, SpotlightMode) immediately, causing unnecessary renders; instead,
change to conditional rendering so only the selected variant is created —
replace the comps map usage around comps[type] with a conditional switch or
if/else that returns <TrackMode ... />, <SpotlightMode ... /> or the "still"
SpotlightMode only when type matches; keep AnimationStyles outside and pass
logos and color into the rendered component (use the same props as now) so only
the chosen component function (TrackMode, SpotlightMode) executes.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 7f185e16-7b5e-40a9-92f0-3336ba0e40b3
⛔ Files ignored due to path filters (7)
apps/site/public/icons/technologies/drizzle.svgis excluded by!**/*.svgapps/site/public/icons/technologies/kysely.svgis excluded by!**/*.svgapps/site/public/icons/technologies/typeorm.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_8.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_8_light.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_9.svgis excluded by!**/*.svgapps/site/public/illustrations/postgres/postgres_9_light.svgis excluded by!**/*.svg
📒 Files selected for processing (3)
apps/site/src/app/postgres/page.tsxapps/site/src/components/homepage/card-section/logo-grid.tsxapps/site/src/data/postgres.json
✅ Files skipped from review due to trivial changes (1)
- apps/site/src/data/postgres.json
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/site/src/app/postgres/page.tsx
d6168db to
d94ef5c
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
apps/site/src/app/postgres/page.tsx (2)
19-20:⚠️ Potential issue | 🟠 MajorCTA URL inconsistency remains unresolved.
The funnel has three different states:
- Hero (line 151): hardcoded
/sign-upURL- Video section (line 299):
CONSOLE_URLpointing to/login- Footer (line 330): no
hrefat all — button is inertUsers clicking the footer CTA won't go anywhere. Standardize all CTAs to use a single constant pointing to the sign-up flow.
🔗 Proposed fix
const CONSOLE_URL = - "https://console.prisma.io/login?utm_source=website&utm_medium=postgres&utm_campaign=cta"; + "https://console.prisma.io/sign-up?utm_source=website&utm_medium=postgres&utm_campaign=cta";Then update line 151 to use
href={CONSOLE_URL}instead of the hardcoded URL, and addhref={CONSOLE_URL}to the footer button at line 330.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/app/postgres/page.tsx` around lines 19 - 20, The CTA links are inconsistent: CONSOLE_URL currently points to the /login flow while the Hero uses a hardcoded /sign-up and the Footer button has no href; update CONSOLE_URL to the canonical sign-up URL (the sign-up flow you want), then replace the Hero's hardcoded '/sign-up' href to use CONSOLE_URL and add href={CONSOLE_URL} to the Footer button so all CTAs (Hero, Video section which already uses CONSOLE_URL, and Footer) point to the same sign-up flow.
330-337:⚠️ Potential issue | 🟠 MajorFooter primary button is non-functional and docs link is inconsistent.
Two issues in this CTA block:
Line 330: The primary "Create your first Database" button has no
href—clicking it does nothing. This breaks the page's main conversion goal.Line 334: The docs button links to
/docs, but the hero's docs button (line 162) links to/docs/postgres. These should be consistent—presumably the Postgres-specific docs path is more appropriate here.🔧 Proposed fix
- <Button variant="ppg" size="2xl"> + <Button + variant="ppg" + size="2xl" + href={CONSOLE_URL} + target="_blank" + rel="noopener noreferrer" + > <span>Create your first Database</span> <i className="fa-regular fa-arrow-right ml-2" /> </Button> - <Button variant="default-stronger" size="2xl" href="/docs"> + <Button variant="default-stronger" size="2xl" href="/docs/postgres"> <span>Read the docs</span>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/app/postgres/page.tsx` around lines 330 - 337, The CTA footer buttons are misconfigured: add a proper link to the primary Button (the one containing the span "Create your first Database") so it navigates to the Postgres onboarding/creation route (e.g., the same target used elsewhere for starting a Postgres DB), and change the secondary docs Button (currently href="/docs") to the Postgres-specific docs path "/docs/postgres" to match the hero button; update the Button props accordingly so the primary Button receives an href (or onClick navigation) and the docs Button's href is "/docs/postgres".
🧹 Nitpick comments (2)
apps/site/src/app/postgres/page.tsx (2)
129-129: Consider renaming the component to match its purpose.The function is named
SiteHomebut this is the Postgres landing page, not the homepage. A more descriptive name likePostgresPageorPostgresLandingPagewould improve code clarity and make it easier to distinguish from the actual homepage component.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/app/postgres/page.tsx` at line 129, The exported async component named SiteHome should be renamed to a more descriptive name (e.g., PostgresPage or PostgresLandingPage) to reflect that it is the Postgres landing page; update the function declaration (export default async function SiteHome -> export default async function PostgresPage/PostgresLandingPage) and adjust any imports or references to this component across the codebase (including tests and route registrations) so they point to the new identifier.
185-187: Remove unused variable.The
firstvariable is declared but never used—the styling relies on Tailwind'sfirst:andnot-first:pseudo-class variants instead (lines 191-192).{postgresData.stack.map((card, index) => { - const first = index === 0; return (🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@apps/site/src/app/postgres/page.tsx` around lines 185 - 187, Remove the unused local variable `first` declared inside the postgresData.stack.map callback; the component already uses Tailwind's `first:`/`not-first:` pseudo-class variants for styling, so delete the `const first = index === 0;` declaration in the map callback (the function passed to postgresData.stack.map) to eliminate the unused variable warning.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@apps/site/src/app/postgres/page.tsx`:
- Around line 309-314: The Youtube component's title prop ("See how Prisma
Studio works") is inconsistent with the section heading "See Postgres in
action"; update the title prop on the Youtube component (videoId="O1S0ax7GlL8")
to match the section context (e.g., "See Postgres in action") for correct
accessibility, or if the video actually covers Prisma Studio instead, change the
surrounding section heading/copy to reflect that content so the Youtube title
and section copy are aligned.
- Around line 1-17: The file imports several symbols that are never
used—Antigravity, SITE_HOME_TITLE, SITE_HOME_DESCRIPTION, Bento, review
(homepage.json) and Testimonials—so remove those import statements to clean the
module and avoid bundling unused JSON; locate the import lines that reference
Antigravity, SITE_HOME_TITLE, SITE_HOME_DESCRIPTION, Bento, review and
Testimonials and delete them, ensuring you don't remove used symbols like
PostgresTabs, postgresData, LogoGrid, EnterpriseScrollCarousel or Youtube.
---
Duplicate comments:
In `@apps/site/src/app/postgres/page.tsx`:
- Around line 19-20: The CTA links are inconsistent: CONSOLE_URL currently
points to the /login flow while the Hero uses a hardcoded /sign-up and the
Footer button has no href; update CONSOLE_URL to the canonical sign-up URL (the
sign-up flow you want), then replace the Hero's hardcoded '/sign-up' href to use
CONSOLE_URL and add href={CONSOLE_URL} to the Footer button so all CTAs (Hero,
Video section which already uses CONSOLE_URL, and Footer) point to the same
sign-up flow.
- Around line 330-337: The CTA footer buttons are misconfigured: add a proper
link to the primary Button (the one containing the span "Create your first
Database") so it navigates to the Postgres onboarding/creation route (e.g., the
same target used elsewhere for starting a Postgres DB), and change the secondary
docs Button (currently href="/docs") to the Postgres-specific docs path
"/docs/postgres" to match the hero button; update the Button props accordingly
so the primary Button receives an href (or onClick navigation) and the docs
Button's href is "/docs/postgres".
---
Nitpick comments:
In `@apps/site/src/app/postgres/page.tsx`:
- Line 129: The exported async component named SiteHome should be renamed to a
more descriptive name (e.g., PostgresPage or PostgresLandingPage) to reflect
that it is the Postgres landing page; update the function declaration (export
default async function SiteHome -> export default async function
PostgresPage/PostgresLandingPage) and adjust any imports or references to this
component across the codebase (including tests and route registrations) so they
point to the new identifier.
- Around line 185-187: Remove the unused local variable `first` declared inside
the postgresData.stack.map callback; the component already uses Tailwind's
`first:`/`not-first:` pseudo-class variants for styling, so delete the `const
first = index === 0;` declaration in the map callback (the function passed to
postgresData.stack.map) to eliminate the unused variable warning.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: d700bb23-24e2-4c19-b0c3-172823658850
⛔ Files ignored due to path filters (1)
apps/site/public/og/og-postgres.pngis excluded by!**/*.png
📒 Files selected for processing (1)
apps/site/src/app/postgres/page.tsx
- Fix type HowSectionData
18fb757 to
85793ed
Compare
Summary by CodeRabbit
New Features
Enhancements
Style
Content