-
-
Notifications
You must be signed in to change notification settings - Fork 173
Fix Twitter( X.com ) card previews not displaying correctly when sharing #1103
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix Twitter( X.com ) card previews not displaying correctly when sharing #1103
Conversation
|
@MichaelMoyles is attempting to deploy a commit to the Codú Team on Vercel. A member of the Team first needs to authorize it. |
WalkthroughThe changes made in the pull request focus on the Changes
Assessment against linked issues
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
Hello @MichaelMoyles, thanks for opening your first Pull Request. The maintainers will review this Pull Request and provide feedback as soon as possible. Keep up the great work! |
There was a problem hiding this 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
🧹 Outside diff range and nitpick comments (1)
app/(app)/articles/[slug]/page.tsx (1)
Line range hint
1-124: Overall impact is positive with minimal risk.The changes are well-contained within the
generateMetadatafunction and don't affect the overall structure or logic of theArticlePagecomponent. This localized modification reduces the risk of unintended side effects.To ensure the changes have the desired effect:
- Deploy these changes to a staging environment.
- Use Twitter's Card Validator tool (https://cards-dev.twitter.com/validator) to test the article URL and verify that the preview image is now displaying correctly.
Consider implementing a monitoring solution to track the success rate of Twitter card previews for your articles. This could help quickly identify any future issues with social media sharing.
| description: post.excerpt, | ||
| type: "article", | ||
| images: [`/api/og?title=${encodeURIComponent(post.title)}`], | ||
| images: [`/og?title=${encodeURIComponent(post.title)}`], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Codebase verification
Inconsistency Found in OG Image References
The /api prefix was successfully removed from app/(app)/articles/[slug]/page.tsx, but it still exists in the following file:
app/(app)/[username]/page.tsx
Please ensure that the /api prefix is removed consistently across all relevant files to resolve the issue with Twitter card previews.
🔗 Analysis chain
LGTM! Changes align with PR objectives.
The removal of the /api prefix from the image paths in both openGraph and twitter metadata should resolve the issue with Twitter card previews. This change aligns well with the PR objectives and the linked issue #1041.
To ensure the changes are effective, please run the following verification script:
Also applies to: 46-46
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Description: Verify that the /api prefix has been removed from all OG image references
# Test: Search for any remaining /api/og references in TSX files
rg --type tsx '/api/og'
# Test: Confirm the new /og path is used consistently
rg --type tsx '/og\?title='
# Note: If the first command returns results or the second command doesn't,
# there might be inconsistencies in the implementation.
Length of output: 109
Script:
#!/bin/bash
# Description: Verify that the /api prefix has been removed from all OG image references
# Test: Search for any remaining /api/og references in .tsx files
rg '/api/og' --glob '*.tsx'
# Test: Confirm the new /og path is used consistently in .tsx files
rg '/og\?title=' --glob '*.tsx'
# Note: If the first command returns results or the second command doesn't,
# there might be inconsistencies in the implementation.
Length of output: 673
NiallJoeMaher
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This one had me scratching my head! Thanks. LGTM! 🌮 🦖
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
✨ Codu Pull Request 💻
Fixes #1041
Pull Request details
Any Breaking changes
Associated Screenshots