Merged
Conversation
Add titleClassName, descriptionClassName, and childrenWrapperClassName props. Change description type from string to ReactNode.
Replace inline hero section with reusable Hero component and adjust countdown card styling for mobile responsiveness.
Reduce hero height on mobile so the timer card is partially visible above the fold, encouraging users to scroll.
Constrain countdown card at lg breakpoint, widen hero text container, and fix layout stretch on mid-size devices.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Caution Review failedPull request was closed or merged during review 📝 WalkthroughWalkthroughEvent card markup was extracted to a new Changes
Sequence Diagram(s)sequenceDiagram
participant Browser
participant Server as JoinStart Page (server)
participant JoinClient as JoinStartClient
participant Tile as UpcomingEventTile
Browser->>Server: Request /join-start/2026 (optional ?beta=true)
Server-->>Browser: HTML with isLive (computed from beta or LAUNCH_DATE)
Browser->>JoinClient: Hydrate JoinStartClient (receives isLive)
JoinClient->>JoinClient: choose hero/content based on isLive
JoinClient->>Tile: render multiple UpcomingEventTile (props: title, date, image, cta...)
Tile->>Browser: user clicks CTA or card -> open external link (target=_blank) or show disabled label
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Poem
🚥 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. ✨ Finishing Touches✨ Simplify code
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (3)
components/UpcomingEventTile.tsx (2)
30-38: Consider usingnext/imagefor image optimization.The component uses a native
<img>tag forimageUrl. For external images that are known at build time, consider using Next.js<Image>component for automatic optimization (lazy loading, responsive sizing, format conversion). However, if images are dynamically sourced from various external URLs, the current approach is acceptable.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@components/UpcomingEventTile.tsx` around lines 30 - 38, Replace the native <img> in UpcomingEventTile with Next.js Image for optimization when imageUrl points to static or allowed-host images: import Image from 'next/image', use the Image component instead of the img tag (keeping alt={title} and the same classes), provide explicit width and height (or use responsive/layout="fill" with a wrapper) and ensure external domains are listed in next.config.js or set unoptimized when necessary; otherwise keep the current <img> for fully dynamic external URLs and adjust the imageUrl prop type on UpcomingEventTile accordingly.
79-79: Minor: class string may contain extra spaces.When
hiddenClassNameorclassNameare empty strings (their defaults), the concatenation produces extra spaces. Consider using a utility likecn()(which is available in@/lib/utilsper Hero.tsx) for cleaner class merging.♻️ Suggested improvement
+import { cn } from "@/lib/utils" + // ... - const classes = `group relative bg-white/5 rounded-2xl overflow-hidden transition-all duration-500 hover:scale-[1.02] shadow-lg shadow-black/20 hover:shadow-xl hover:shadow-black/40 flex flex-col ${hiddenClassName} ${className}`.trim() + const classes = cn( + "group relative bg-white/5 rounded-2xl overflow-hidden transition-all duration-500 hover:scale-[1.02] shadow-lg shadow-black/20 hover:shadow-xl hover:shadow-black/40 flex flex-col", + hiddenClassName, + className + )🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@components/UpcomingEventTile.tsx` at line 79, The class string concatenation in UpcomingEventTile creates extra spaces when hiddenClassName or className are empty; replace the manual template literal that builds the classes constant with a call to the cn utility (import cn from "@/lib/utils" as used in Hero.tsx) to merge the base classes with hiddenClassName and className (e.g., cn("group relative bg-white/5 rounded-2xl overflow-hidden transition-all duration-500 hover:scale-[1.02] shadow-lg shadow-black/20 hover:shadow-xl hover:shadow-black/40 flex flex-col", hiddenClassName, className)) so empty values are handled cleanly and remove the manual .trim() handling.app/join-start/2026/JoinStartClient.tsx (1)
100-100: Remove unusedisClosedstate or add TODO comment for future use.The
isClosedstate is set on line 108 based on the countdown logic (setIsClosed(rawDiff <= 0)) but is never referenced in the component's rendered output. If this is intended for a future feature (e.g., displaying an "applications closed" message), add a TODO comment. Otherwise, remove both the state declaration and the setter call.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@app/join-start/2026/JoinStartClient.tsx` at line 100, The isClosed state (const [isClosed, setIsClosed]) in JoinStartClient is unused in rendering; either remove the state declaration and the setIsClosed(...) call inside the countdown logic, or if you plan to use it later add a clear TODO comment above the declaration referencing isClosed and setIsClosed so future work knows it controls the "applications closed" UI; update the code in JoinStartClient accordingly to keep state and effects consistent.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@app/join-start/2026/JoinStartClient.tsx`:
- Line 100: The isClosed state (const [isClosed, setIsClosed]) in
JoinStartClient is unused in rendering; either remove the state declaration and
the setIsClosed(...) call inside the countdown logic, or if you plan to use it
later add a clear TODO comment above the declaration referencing isClosed and
setIsClosed so future work knows it controls the "applications closed" UI;
update the code in JoinStartClient accordingly to keep state and effects
consistent.
In `@components/UpcomingEventTile.tsx`:
- Around line 30-38: Replace the native <img> in UpcomingEventTile with Next.js
Image for optimization when imageUrl points to static or allowed-host images:
import Image from 'next/image', use the Image component instead of the img tag
(keeping alt={title} and the same classes), provide explicit width and height
(or use responsive/layout="fill" with a wrapper) and ensure external domains are
listed in next.config.js or set unoptimized when necessary; otherwise keep the
current <img> for fully dynamic external URLs and adjust the imageUrl prop type
on UpcomingEventTile accordingly.
- Line 79: The class string concatenation in UpcomingEventTile creates extra
spaces when hiddenClassName or className are empty; replace the manual template
literal that builds the classes constant with a call to the cn utility (import
cn from "@/lib/utils" as used in Hero.tsx) to merge the base classes with
hiddenClassName and className (e.g., cn("group relative bg-white/5 rounded-2xl
overflow-hidden transition-all duration-500 hover:scale-[1.02] shadow-lg
shadow-black/20 hover:shadow-xl hover:shadow-black/40 flex flex-col",
hiddenClassName, className)) so empty values are handled cleanly and remove the
manual .trim() handling.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: b80b1153-1276-49aa-8874-6e374f04297c
📒 Files selected for processing (8)
app/events/UpcomingEventsGrid.tsxapp/for-partners/page.tsxapp/home/HomeClient.tsxapp/join-start/2026/JoinStartClient.tsxapp/join-start/2026/page.tsxcomponents/EventComponents.tsxcomponents/Hero.tsxcomponents/UpcomingEventTile.tsx
💤 Files with no reviewable changes (1)
- app/for-partners/page.tsx
SimonBurmer
approved these changes
Apr 10, 2026
Make the countdown card and apply button visible without scrolling on mobile by reducing the hero min-height and hiding the "Don't miss your chance" text on small screens.
Remove dead isClosed state in JoinStartClient that caused unnecessary re-renders. Switch UpcomingEventTile to cn() for cleaner class string handling when hiddenClassName or className are empty.
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
app/join-start/2026/JoinStartClient.tsx (1)
102-119:⚠️ Potential issue | 🟠 MajorUse
isClosedto switch the CTA and stop the timer at the deadline.
isClosedis updated every second, but this branch never consumes it. AfterTARGET_DATE, the page still shows a live “Start Application” button, and the interval keeps rerendering the component every second at00:00:00.Suggested fix
useEffect(() => { setMounted(true) - const update = () => { + const update = () => { const now = Date.now() const rawDiff = TARGET_DATE - now const diff = Math.max(0, rawDiff) - setIsClosed(rawDiff <= 0) + const closed = rawDiff <= 0 + setIsClosed(closed) setTimeLeft({ days: Math.floor(diff / (1000 * 60 * 60 * 24)), hours: Math.floor((diff / (1000 * 60 * 60)) % 24), minutes: Math.floor((diff / (1000 * 60)) % 60), seconds: Math.floor((diff / 1000) % 60), }) + return closed } - update() - const interval = setInterval(update, 1000) + if (update()) return + + const interval = setInterval(() => { + if (update()) clearInterval(interval) + }, 1000) + return () => clearInterval(interval) }, [])- <p className="text-center text-xs font-bold uppercase tracking-[0.35em] text-white/75 sm:text-sm"> - Applications close in - </p> + <p className="text-center text-xs font-bold uppercase tracking-[0.35em] text-white/75 sm:text-sm"> + {isClosed ? 'Applications closed' : 'Applications close in'} + </p> - <a - href="https://tally.so/r/eqL4yQ" - target="_blank" - rel="noopener noreferrer" - className="mt-6 inline-flex w-full items-center justify-center rounded-xl bg-brand-pink px-8 py-3 font-bold text-white transition-all duration-300 hover:shadow-[0_0_30px_rgba(208,0,111,0.4)]" - > - Start Application - </a> + {isClosed ? ( + <span className="mt-6 inline-flex w-full items-center justify-center rounded-xl bg-brand-pink/50 px-8 py-3 font-bold text-white/80"> + Applications Closed + </span> + ) : ( + <a + href="https://tally.so/r/eqL4yQ" + target="_blank" + rel="noopener noreferrer" + className="mt-6 inline-flex w-full items-center justify-center rounded-xl bg-brand-pink px-8 py-3 font-bold text-white transition-all duration-300 hover:shadow-[0_0_30px_rgba(208,0,111,0.4)]" + > + Start Application + </a> + )}Also applies to: 168-201
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@app/join-start/2026/JoinStartClient.tsx` around lines 102 - 119, The timer effect updates isClosed but never stops the interval or switches the CTA; modify the useEffect/update logic in JoinStartClient (functions: useEffect, update, setIsClosed, setTimeLeft, TARGET_DATE, clearInterval) so that when rawDiff <= 0 you set isClosed true, set timeLeft to all zeros, and clearInterval(interval) (or stop scheduling further ticks) to prevent continued rerenders; also ensure the render path that shows the CTA reads isClosed to display the closed/alternative CTA instead of the live “Start Application” button.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@app/join-start/2026/JoinStartClient.tsx`:
- Around line 102-119: The timer effect updates isClosed but never stops the
interval or switches the CTA; modify the useEffect/update logic in
JoinStartClient (functions: useEffect, update, setIsClosed, setTimeLeft,
TARGET_DATE, clearInterval) so that when rawDiff <= 0 you set isClosed true, set
timeLeft to all zeros, and clearInterval(interval) (or stop scheduling further
ticks) to prevent continued rerenders; also ensure the render path that shows
the CTA reads isClosed to display the closed/alternative CTA instead of the live
“Start Application” button.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 3061704c-752e-4212-a083-9b08375c0c98
📒 Files selected for processing (1)
app/join-start/2026/JoinStartClient.tsx
…ements ScrollIndicator now owns its own scroll listener and ResizeObserver, eliminating stale state issues where the thumb didn't track content scrolling or respond to clicks. Removed redundant scrollProgress state from events, member-journey, and join-start pages. Also added select-none to all drag-scrollable containers to prevent text selection while dragging, and removed scroll-smooth from the events slider which was fighting with programmatic drag scrolling.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary by CodeRabbit
New Features
Bug Fixes
Refactor
UI