Skip to content

feat(site): DR-7731 add community page#7732

Merged
ArthurGamby merged 4 commits intomainfrom
dr-7731-community
Mar 31, 2026
Merged

feat(site): DR-7731 add community page#7732
ArthurGamby merged 4 commits intomainfrom
dr-7731-community

Conversation

@ArthurGamby
Copy link
Copy Markdown
Contributor

@ArthurGamby ArthurGamby commented Mar 31, 2026

Summary

  • New /community page for the website rebuild
  • Sections: hero, connect with Prisma (Discord featured), starter kit, meetups, contributing, footer CTA
  • ORM color palette with gradient cards, Action icon badges, decorative hero rings
  • Mobile-responsive with centered card layout on small screens

Linear

https://linear.app/prisma-company/issue/DR-7731/community

Summary by CodeRabbit

  • New Features
    • Added a Community page with a hero and multiple sections to connect with the Prisma community.
    • “Connect” area featuring a highlighted Discord card and a responsive grid of external channels.
    • Starter kit section showcasing docs, examples and resources (external items open in a new tab).
    • Meetups section with images, “Join Meetup” CTAs and a “See all events” link.
    • Contributing resources and a footer CTA with Discord and newsletter buttons.

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 31, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
blog Ready Ready Preview, Comment Mar 31, 2026 11:58am
docs Ready Ready Preview, Comment Mar 31, 2026 11:58am
eclipse Ready Ready Preview, Comment Mar 31, 2026 11:58am
site Ready Ready Preview, Comment Mar 31, 2026 11:58am

Request Review

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai bot commented Mar 31, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: a66bb031-07f3-42b6-95ce-f8808c11e87e

📥 Commits

Reviewing files that changed from the base of the PR and between dfdea0d and 587eebd.

📒 Files selected for processing (1)
  • apps/site/src/app/community/page.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • apps/site/src/app/community/page.tsx

Walkthrough

Adds a new Next.js Community page at apps/site/src/app/community/page.tsx exporting metadata and a default CommunityPage component that renders hero, connection (Discord + channels), starter kit, meetups, contributing links, and a footer CTA.

Changes

Cohort / File(s) Summary
New Community Page
apps/site/src/app/community/page.tsx
New Next.js App Router page exporting metadata: Metadata and default CommunityPage. Implements hero, "Connect with Prisma" (featured Discord card + mapped external channels with target="_blank"/rel="noopener noreferrer"), starter kit grid (conditional external links), meetups grid using next/image (fill, unoptimized) with "Join Meetup" CTAs and a /events link, contributing links grid, and a footer CTA with one external and one internal link.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'feat(site): DR-7731 add community page' directly and accurately describes the main change—adding a new community page to the site.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@ArthurGamby ArthurGamby marked this pull request as ready for review March 31, 2026 09:28
@argos-ci
Copy link
Copy Markdown

argos-ci bot commented Mar 31, 2026

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

Build Status Details Updated (UTC)
default (Inspect) ✅ No changes detected - Mar 31, 2026, 12:04 PM

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
apps/site/src/app/community/page.tsx (1)

251-256: Remove the redundant unoptimized prop from this Image component and configure remotePatterns for meetupstatic.com in your Next config.

The global images: { unoptimized: true } setting in apps/site/next.config.mjs (line 220) already disables optimization for all images app-wide, making the component-level prop redundant. The real performance gain comes from removing that global flag and configuring remotePatterns for external domains like meetupstatic.com (which is already allowed in your CSP on line 77). This lets Next.js optimize remote images while still allowing them to load.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@apps/site/src/app/community/page.tsx` around lines 251 - 256, Remove the
redundant unoptimized prop from the Image usage (Image component rendering
meetup.image with alt={meetup.title}) in page.tsx and instead update your Next
configuration: remove or set images.unoptimized to false in the global config
(apps/site/next.config.mjs) and add a remotePatterns entry allowing
meetupstatic.com (hostname pattern for meetupstatic.com) so Next.js can optimize
those external images; then rebuild to validate optimized remote image delivery.
🤖 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/community/page.tsx`:
- Around line 126-150: The Card is wrapped in an anchor while it contains an
interactive Button, causing nested interactive elements; change the structure so
only one interactive element remains: remove the outer anchor around the Card
(replace it with a non-interactive container/div) and move the link behavior to
the inner Button (make the Button render as an anchor or give it the
href/target/rel attributes), or alternatively keep the outer anchor and convert
the inner Button to a non-interactive element; update Button/Card usage
accordingly and preserve target="_blank" and rel="noopener noreferrer" for the
external Discord link to maintain accessibility and security.
- Line 103: The Tailwind classes z-1, inset-x-30, and before:-z-1 are
non-standard and will not compile; replace them with arbitrary-value utilities
using bracket syntax (e.g., z-[1], inset-x-[30px], and before:-z-[1]) wherever
they appear in the className string or pseudo-class sequences (such as the
element with className containing "relative z-1 ..." and any sibling/::before
usages). Ensure you update the className on the element in page.tsx (and any
corresponding ::before/after utility strings) to use z-[1], inset-x-[30px], and
before:-z-[1] so Tailwind recognizes the values.

---

Nitpick comments:
In `@apps/site/src/app/community/page.tsx`:
- Around line 251-256: Remove the redundant unoptimized prop from the Image
usage (Image component rendering meetup.image with alt={meetup.title}) in
page.tsx and instead update your Next configuration: remove or set
images.unoptimized to false in the global config (apps/site/next.config.mjs) and
add a remotePatterns entry allowing meetupstatic.com (hostname pattern for
meetupstatic.com) so Next.js can optimize those external images; then rebuild to
validate optimized remote image delivery.
🪄 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: 07a5aab9-b4d8-4953-8629-c57207754b1f

📥 Commits

Reviewing files that changed from the base of the PR and between bbcab5d and eb79e7c.

📒 Files selected for processing (1)
  • apps/site/src/app/community/page.tsx

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

♻️ Duplicate comments (2)
apps/site/src/app/community/page.tsx (2)

101-101: ⚠️ Potential issue | 🟡 Minor

Replace non-standard Tailwind utilities with arbitrary values.

Line 101 (z-1) and Line 334 (before:inset-x-30, before:-z-1) are non-default Tailwind utilities and won’t apply unless extended in config.

Suggested fix
-        <div className="relative z-1 mx-auto flex w-full max-w-[720px] flex-col items-center gap-6 text-center">
+        <div className="relative z-[1] mx-auto flex w-full max-w-[720px] flex-col items-center gap-6 text-center">

-      <div className="bg-[url('/illustrations/homepage/footer_grid.svg')] bg-contain bg-center before:inset-x-30 before:inset-y-[45%] before:absolute relative before:content-[''] before:pointer-events-none before:-z-1 rounded-full before:bg-indigo-400 before:blur-[100px]">
+      <div className="relative rounded-full bg-[url('/illustrations/homepage/footer_grid.svg')] bg-contain bg-center before:absolute before:inset-x-[7.5rem] before:inset-y-[45%] before:pointer-events-none before:-z-[1] before:content-[''] before:bg-indigo-400 before:blur-[100px]">

Also applies to: 334-334

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@apps/site/src/app/community/page.tsx` at line 101, The Tailwind classes used
in the component (e.g., the div with className containing "z-1" and the element
using "before:inset-x-30" and "before:-z-1") rely on non-standard utilities;
replace them with Tailwind arbitrary-value syntax so they apply without config
changes — for example use "z-[1]" instead of "z-1", "before:inset-x-[30px]" (or
a responsive/rem value) instead of "before:inset-x-30", and "before:-z-[1]"
instead of "before:-z-1" in the relevant JSX className strings (locate
occurrences in page.tsx around the div with className containing "z-1" and the
element using before:...).

124-148: ⚠️ Potential issue | 🟠 Major

Remove nested interactive elements in the featured Discord card.

Line 124 creates an anchor wrapper, while Line 143 renders a Button inside it. This interactive nesting is invalid and can break keyboard/screen-reader behavior.

Suggested fix
-          <a
-            href="https://pris.ly/discord"
-            target="_blank"
-            rel="noopener noreferrer"
-            className="group mb-4 block"
-          >
-            <Card className="flex flex-col items-center text-center gap-4 p-6 transition-colors bg-[linear-gradient(180deg,var(--color-background-default)_0%,var(--color-background-orm)_262.5%)] hover:border-stroke-neutral-strong sm:flex-row sm:items-center sm:text-left sm:justify-between">
+          <Card className="group mb-4 flex flex-col items-center text-center gap-4 p-6 transition-colors bg-[linear-gradient(180deg,var(--color-background-default)_0%,var(--color-background-orm)_262.5%)] hover:border-stroke-neutral-strong sm:flex-row sm:items-center sm:text-left sm:justify-between">
               ...
-              <Button variant="orm" size="lg" className="shrink-0 w-fit">
+              <Button
+                variant="orm"
+                size="lg"
+                href="https://pris.ly/discord"
+                target="_blank"
+                rel="noopener noreferrer"
+                className="shrink-0 w-fit"
+              >
                 Join Discord
                 <i className="fa-regular fa-arrow-up-right ml-2" aria-hidden />
               </Button>
-            </Card>
-          </a>
+            </Card>
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@apps/site/src/app/community/page.tsx` around lines 124 - 148, The featured
Discord card currently nests an interactive Button inside an anchor (<a>
wrapper) which creates invalid nested interactive elements; fix by making the
outer wrapper non-interactive (e.g., replace the <a> with a <div> or <Card>
clickable prop removed) and convert the inner Button into the actual link (or
alternatively remove the inner Button and make the Card itself the anchor) so
only one interactive element remains; update the JSX around the anchor wrapper,
the Button component usage, and the Card wrapper (look for the <a ...> that
wraps <Card> and the Button variant="orm" size="lg") to ensure a single
accessible link/interactive element and preserve the same styling and target/rel
behavior.
🤖 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/community/page.tsx`:
- Around line 249-254: Remove the redundant unoptimized prop from the Image
components that render meetup images (the JSX using <Image src={meetup.image}
alt={meetup.title} fill ... />); since image optimization is already disabled
globally via next.config, simply delete the unoptimized attribute from those
Image usages (e.g., the Image instances showing meetup.image/meetup.title) in
both places where meetup cards are rendered.

---

Duplicate comments:
In `@apps/site/src/app/community/page.tsx`:
- Line 101: The Tailwind classes used in the component (e.g., the div with
className containing "z-1" and the element using "before:inset-x-30" and
"before:-z-1") rely on non-standard utilities; replace them with Tailwind
arbitrary-value syntax so they apply without config changes — for example use
"z-[1]" instead of "z-1", "before:inset-x-[30px]" (or a responsive/rem value)
instead of "before:inset-x-30", and "before:-z-[1]" instead of "before:-z-1" in
the relevant JSX className strings (locate occurrences in page.tsx around the
div with className containing "z-1" and the element using before:...).
- Around line 124-148: The featured Discord card currently nests an interactive
Button inside an anchor (<a> wrapper) which creates invalid nested interactive
elements; fix by making the outer wrapper non-interactive (e.g., replace the <a>
with a <div> or <Card> clickable prop removed) and convert the inner Button into
the actual link (or alternatively remove the inner Button and make the Card
itself the anchor) so only one interactive element remains; update the JSX
around the anchor wrapper, the Button component usage, and the Card wrapper
(look for the <a ...> that wraps <Card> and the Button variant="orm" size="lg")
to ensure a single accessible link/interactive element and preserve the same
styling and target/rel behavior.
🪄 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: 9163f6de-a994-4b87-b36d-bd4e6af13c57

📥 Commits

Reviewing files that changed from the base of the PR and between eb79e7c and dfdea0d.

📒 Files selected for processing (1)
  • apps/site/src/app/community/page.tsx

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.

2 participants