feat: add Open Graph metadata for share links; show Shared Workspace …#202
Conversation
…in link previews Made-with: Cursor
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Important
Looks good to me! 👍
Reviewed everything up to 0dee0bc in 7 seconds. Click for details.
- Reviewed
172lines of code in2files - Skipped
0files when reviewing. - Skipped posting
0draft comments. View those below. - Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.
Workflow ID: wflow_1cv4FerK53moEsAo
You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.
📝 WalkthroughWalkthroughTwo layout files updated to enhance dynamic metadata generation: a new invite link layout with metadata generation from database queries and conditional handling for expired/invalid links, and an improved share-copy layout with enhanced workspace metadata and localized error handling. Changes
Sequence DiagramsequenceDiagram
participant Client
participant Layout as Layout Component
participant DB as Database
participant MetadataService as Metadata Generator
Client->>Layout: Request invite link [token]
activate Layout
Layout->>DB: Query share link by token
activate DB
DB-->>Layout: Share link + workspace data
deactivate DB
alt Link Not Found
Layout->>MetadataService: Generate not-found metadata
else Link Expired
Layout->>MetadataService: Generate expired metadata
else Link Valid
Layout->>MetadataService: Generate workspace metadata
end
activate MetadataService
MetadataService-->>Layout: Metadata object with OG/Twitter tags
deactivate MetadataService
Layout-->>Client: Response with metadata headers
deactivate Layout
Estimated Code Review Effort🎯 3 (Moderate) | ⏱️ ~20 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Tip Try Coding Plans. Let us write the prompt for your AI agent so you can ship faster (with fewer bugs). 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 |
There was a problem hiding this comment.
Your free trial has ended. If you'd like to continue receiving code reviews, you can add a payment method here.
|
There was a problem hiding this comment.
🧹 Nitpick comments (3)
src/app/share-copy/[id]/layout.tsx (1)
36-36: Missingimagesin Twitter metadata for not-found case.The not-found Twitter metadata omits the
imagesarray, whereas the valid workspace case at line 64 includes it. For consistent link preview behavior, consider adding the images here as well.🔧 Suggested fix
- twitter: { card: "summary_large_image", title: getPageTitle(notFoundTitle), description: notFoundDesc }, + twitter: { card: "summary_large_image", title: getPageTitle(notFoundTitle), description: notFoundDesc, images: [getFullImageUrl()] },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/app/share-copy/`[id]/layout.tsx at line 36, The Twitter metadata for the not-found branch is missing an images entry; update the metadata object where twitter: { card: "summary_large_image", title: getPageTitle(notFoundTitle), description: notFoundDesc } to include an images array (matching the structure used in the valid workspace metadata) so the not-found preview uses the same preview image(s); reference getPageTitle, notFoundTitle, and notFoundDesc to locate the not-found metadata block and mirror the images property from the workspace metadata branch.src/app/invite/link/[token]/layout.tsx (2)
26-86: Consider extracting a shared metadata builder helper.Both this file and
src/app/share-copy/[id]/layout.tsxconstruct nearly identical metadata objects with repeated patterns for OG/Twitter. A helper function likebuildShareMetadata({ title, description, url })could reduce duplication and ensure consistency.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/app/invite/link/`[token]/layout.tsx around lines 26 - 86, Extract the repeated metadata construction into a helper (e.g., buildShareMetadata({title, description, url})) and replace the duplicated openGraph/twitter object assembly in layout.tsx and src/app/share-copy/[id]/layout.tsx; the helper should accept title, description, url and internally use getPageTitle, getFullImageUrl and seoConfig.siteName to build the title, description, openGraph (images with width/height/alt) and twitter fields so callers (the branches using shareLink, expired/notFound/shared) simply compute workspaceName/fullTitle/description/url and return buildShareMetadata({ title: fullTitle, description, url }).
40-40: Missingimagesin Twitter metadata for not-found and expired cases.Same issue as in
share-copylayout: the Twitter metadata for error states (lines 40 and 58) omits theimagesarray, while the valid case (line 83) includes it.🔧 Suggested fix for line 40
- twitter: { card: "summary_large_image", title: getPageTitle(notFoundTitle), description: notFoundDesc }, + twitter: { card: "summary_large_image", title: getPageTitle(notFoundTitle), description: notFoundDesc, images: [getFullImageUrl()] },🔧 Suggested fix for line 58
- twitter: { card: "summary_large_image", title: getPageTitle(expiredTitle), description: expiredDesc }, + twitter: { card: "summary_large_image", title: getPageTitle(expiredTitle), description: expiredDesc, images: [getFullImageUrl()] },Also applies to: 58-58
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@src/app/invite/link/`[token]/layout.tsx at line 40, The Twitter metadata objects for the not-found and expired states are missing the images array; update the twitter metadata in the not-found block (twitter: { card, title: getPageTitle(notFoundTitle), description: notFoundDesc }) and the expired block to include an images property that uses the same image URL/source as the valid invite case (i.e., the twitter.images value used in the successful case), calling the same image generator/helper you use elsewhere (the Open Graph image function) so all three cases include identical twitter.images.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@src/app/invite/link/`[token]/layout.tsx:
- Around line 26-86: Extract the repeated metadata construction into a helper
(e.g., buildShareMetadata({title, description, url})) and replace the duplicated
openGraph/twitter object assembly in layout.tsx and
src/app/share-copy/[id]/layout.tsx; the helper should accept title, description,
url and internally use getPageTitle, getFullImageUrl and seoConfig.siteName to
build the title, description, openGraph (images with width/height/alt) and
twitter fields so callers (the branches using shareLink,
expired/notFound/shared) simply compute workspaceName/fullTitle/description/url
and return buildShareMetadata({ title: fullTitle, description, url }).
- Line 40: The Twitter metadata objects for the not-found and expired states are
missing the images array; update the twitter metadata in the not-found block
(twitter: { card, title: getPageTitle(notFoundTitle), description: notFoundDesc
}) and the expired block to include an images property that uses the same image
URL/source as the valid invite case (i.e., the twitter.images value used in the
successful case), calling the same image generator/helper you use elsewhere (the
Open Graph image function) so all three cases include identical twitter.images.
In `@src/app/share-copy/`[id]/layout.tsx:
- Line 36: The Twitter metadata for the not-found branch is missing an images
entry; update the metadata object where twitter: { card: "summary_large_image",
title: getPageTitle(notFoundTitle), description: notFoundDesc } to include an
images array (matching the structure used in the valid workspace metadata) so
the not-found preview uses the same preview image(s); reference getPageTitle,
notFoundTitle, and notFoundDesc to locate the not-found metadata block and
mirror the images property from the workspace metadata branch.



…in link previews
Made-with: Cursor
Important
Add Open Graph metadata for share links in
layout.tsxto enhance link previews for shared workspaces.generateMetadatainlayout.tsxfor/invite/link/[token]and/share-copy/[id]now includes Open Graph and Twitter metadata.getPageTitleandgetFullImageUrlfromseo-configto construct metadata.seoConfig.siteUrlfor consistency.InviteLinkLayoutandShareLayoutcomponents to wrap children.This description was created by
for 0dee0bc. You can customize this summary. It will automatically update as commits are pushed.
Summary by CodeRabbit