improvement(landing): homepage redesign with live hero and real platform UI feature cards#5408
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
PR SummaryMedium Risk Overview Hero — Drops the two-panel absolute layout and in-hero New Features — Replaces Supporting — Extracts shared Reviewed by Cursor Bugbot for commit a4f43a9. Configure here. |
Greptile SummaryFull homepage redesign replacing the split-panel hero with a full-width media frame that overlays a live animated two-pane platform loop (chat + draggable workflow stage) over a scaled screenshot. Feature cards migrate from
Confidence Score: 5/5Landing-only redesign with no changes to API routes, auth, or data contracts. The capture harness is properly gated; animation effects clean up correctly. All changes are confined to the (landing) route group and its static assets. The live hero animation uses correct timer/RAF cleanup and motion-preference handling. The capture harness ships with a production guard and an idempotent seed pattern. The one actionable finding is an inaccurate next/image sizes hint on backdrop images in FeatureCard, which causes slightly larger image downloads but has no correctness or runtime impact. apps/sim/app/(landing)/components/features/components/feature-card/feature-card.tsx — the sizes hint on backdrop images could be tightened. Important Files Changed
Sequence Diagram%%{init: {'theme': 'neutral'}}%%
sequenceDiagram
participant PL as HeroPlatformLoop
participant Chat as HeroChatLoop
participant Stage as HeroWorkflowStage
participant T as setTimeout chain
PL->>T: runCycle — schedule all ticks
T-->>Chat: "phase=user at 500ms"
T-->>Chat: "phase=thinking at 1400ms"
T-->>PL: "stageOpen=true at 1900ms"
PL->>Stage: "mount with builtCount=0"
T-->>Stage: builtCount 1-5 at 2400-5480ms
T-->>Chat: "phase=reply at 6400ms"
Chat->>Chat: stream reply word by word
T-->>PL: "fading=true at 12240ms"
T-->>PL: runCycle restart at 12500ms
PL->>Stage: remount with next cycleId
%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
sequenceDiagram
participant PL as HeroPlatformLoop
participant Chat as HeroChatLoop
participant Stage as HeroWorkflowStage
participant T as setTimeout chain
PL->>T: runCycle — schedule all ticks
T-->>Chat: "phase=user at 500ms"
T-->>Chat: "phase=thinking at 1400ms"
T-->>PL: "stageOpen=true at 1900ms"
PL->>Stage: "mount with builtCount=0"
T-->>Stage: builtCount 1-5 at 2400-5480ms
T-->>Chat: "phase=reply at 6400ms"
Chat->>Chat: stream reply word by word
T-->>PL: "fading=true at 12240ms"
T-->>PL: runCycle restart at 12500ms
PL->>Stage: remount with next cycleId
Reviews (6): Last reviewed commit: "fix(landing): stop double-seeding query ..." | Re-trigger Greptile |
…orm UI feature cards
…tor window, proportional feature cards - Build card: replace the Mothership chat loop with a static left-to-right support-triage workflow showcase (two triggers converging on a triage agent, fanning out to Linear/Slack/Gmail/Tables) on the hero's solid --surface-3 stage, with the goo cycle loader phasing in the bottom-left corner; the chat animation component stays parked in build-callout/components for reuse - Monitor card: swap the floating logs panel for the REAL platform Logs page captured as a full window (new capture-logs-ui pipeline), framed and positioned identically to the Context card, over a new canyon backdrop - Feature cards scale like Cursor's: media stages are aspect-locked (3:2 desktop, 4:3 stacked) instead of fixed-height, and the UI-window callouts use percentage insets so the whole composition scales proportionally with the browser - Eyebrow chips relocate into the copy column above the title on stacked breakpoints instead of overlapping the full-width media - Extract the hero stage's block card for reuse; export the horizontal smoothstep edge helper; drop the unused formation-graph and logs-table-preview components Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
8e52ff4 to
d1d0c2c
Compare
Matches the token already used by its sibling composer buttons instead of a raw hex hover color.
…ture harness Staging removed the sandbox provider as unused when the academy pages were deleted (#5388), but the landing-preview capture route committed on this branch imports it - the branch failed to compile after rebasing. Restore the lightweight provider with its consumer documented. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The mock hydration state set by the readme-tour-capture route was missing the required requestId/error fields added to HydrationState, breaking the production typecheck.
- hero.tsx: object-top-left isn't a real Tailwind v3 utility, so the crop fell back to center; use object-left-top. - hero-workflow-stage.tsx: byId/builtIds were rebuilt on every render, including every drag pointermove frame; hoist the STAGE_BLOCKS lookup to module scope and memoize builtIds on builtCount. - hero-platform-loop.tsx: prefers-reduced-motion was only read once on mount, so toggling it mid-loop didn't stop the scheduled animation; listen for the media query's change event like BuildChatAnimation does. - landing-preview/page.tsx and readme-tour-capture/[workspaceId]/page.tsx: both are dev/preview-only scaffolds (one explicitly "local-only... delete before committing") that were reachable in production with no auth guard. 404 them outside of production instead of leaving them open.
|
@cursor review |
showFinished (added when wiring up the prefers-reduced-motion change listener) set the finished phase but left fading true if the preference flipped mid reset-fade, leaving HeroChatLoop stuck at opacity-0.
|
@cursor review |
The word-reveal effect only checked prefers-reduced-motion once per showReply transition. If HeroPlatformLoop's showFinished set phase to 'reply' while it was already 'reply' (no re-render, no dependency change), the running stream interval kept ticking at normal speed instead of snapping to the full reply. Listen for the media query's change event, mirroring the fix already applied to HeroPlatformLoop and BuildChatAnimation.
|
@cursor review |
HeroStat's staggered count-up entrance only checked prefers-reduced-motion once on mount, unlike the hero loops in this PR that now listen for the media query's change event. Toggling the preference mid-entrance left the scheduled timers/RAF running instead of snapping to the settled value.
|
@cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit b0ca3cf. Configure here.
|
Want your agent to iterate on Greptile's feedback? Try greploops. |
seed(queryClient) ran inside a useState lazy initializer, a render-phase side effect that Strict Mode invokes twice. Replace it with a ref guard so the store mutation runs exactly once, still synchronously before first paint. Flagged across three Greptile review rounds.
|
@cursor review |
There was a problem hiding this comment.
✅ Bugbot reviewed your changes and found no new issues!
Comment @cursor review or bugbot run to trigger another review on this PR
Reviewed by Cursor Bugbot for commit a4f43a9. Configure here.
qc.setQueryData(logKeys.list(...)) requires LogFilters, but the inline seed object had no annotation and timeRange inferred as string, which TypeScript widened past the TimeRange literal union. Failed prod build type-check. Also swap the stray `sandbox` prop back to `embedded` to match Workflow's actual prop name.
What this is
The landing homepage redesign, rebased onto the latest
staging(clean linear history; the one conflict —partners/page.tsx, deleted on staging by #5388 — resolved by keeping the deletion).Commit 1 — homepage redesign
Live hero with the real platform two-pane loop, real-UI feature cards, and the
(landing)route group updates.Commit 2 — feature-card iteration
--surface-3stage, goo cycle loader in the corner. Non-brand icon tiles use the hero's greyscale ramp; brand colors only on real third-party marks.capture-logs-uipipeline mirroring the knowledge capture, seeded run table) over a new canyon backdrop, positioned identically to the Context card.3:2desktop /4:3stacked) instead of fixed-height, and UI-window callouts use percentage insets — the whole composition scales uniformly with browser size. Verified at 1440/1280/1120/768/375 with no overflow.StageBlockCardfor reuse, exported the horizontalsmoothStephelper, removed the unusedformation-graphandlogs-table-previewcomponents.build-callout/components/build-chat-animation) is committed but intentionally unwired — parked for reuse on another surface.Review notes
apps/sim/app/landing-preview/**(login-bypass preview + capture harness) is included from the redesign commit — it powers the UI-capture pipeline; flagging in case it should be gated or dropped before prod.