feat: Distributor badges link to relevant source#210
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
WalkthroughThe changes introduce a new utility module for generating distributor URLs and display names based on configuration. The Changes
Sequence Diagram(s)sequenceDiagram
participant FeedPage
participant DistributorBadges
participant distributor-urls.ts
FeedPage->>DistributorBadges: Render with distribute: DistributorConfig[]
DistributorBadges->>distributor-urls.ts: getDistributorDisplayName(distributor)
DistributorBadges->>distributor-urls.ts: getDistributorUrl(distributor)
distributor-urls.ts-->>DistributorBadges: Returns display name and URL
DistributorBadges-->>FeedPage: Render badges (as links if URL exists)
Assessment against linked issues
Assessment against linked issues: Out-of-scope changesNo out-of-scope changes found. Possibly related PRs
Poem
✨ Finishing Touches
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. 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 (
|
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
apps/app/src/lib/distributor-urls.ts (1)
213-261: Consider reducing code duplication in hasSpecificUrl function.The
hasSpecificUrlfunction duplicates the logic from the URL generator functions. Consider refactoring to reuse the existing logic.export function hasSpecificUrl(distributor: DistributorConfig): boolean { - const pluginName = getPluginName(distributor.plugin); - const config = distributor.config; - - switch (pluginName) { - case "rss": - return !!getConfigString(config, "serviceUrl"); - // ... other cases - } + const url = getDistributorUrl(distributor); + const pluginName = getPluginName(distributor.plugin); + + // Check if we got a specific URL (not just a fallback) + if (!url) return false; + + // For distributors that always return fallback URLs, check if they have specific config + const fallbackUrls = { + 'twitter': 'https://twitter.com', + 'telegram': 'https://telegram.org', + 'notion': 'https://notion.so', + 'discord': 'https://discord.com', + 'near-social': 'https://near.social', + 'supabase': 'https://supabase.com' + }; + + return url !== fallbackUrls[pluginName]; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
apps/app/src/components/DistributorBadges.tsx(1 hunks)apps/app/src/lib/distributor-urls.ts(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
apps/app/src/components/DistributorBadges.tsx (2)
apps/app/src/lib/distributor-urls.ts (3)
DistributorConfig(8-11)getDistributorDisplayName(195-211)getDistributorUrl(148-190)packages/types/src/config.ts (1)
DistributorConfig(101-101)
🔇 Additional comments (8)
apps/app/src/lib/distributor-urls.ts (3)
8-11: Well-structured interface definition.The
DistributorConfiginterface provides a clean abstraction for distributor configuration with the plugin name and optional config object.
13-32: Robust helper functions for safe configuration extraction.The template variable detection and safe string extraction logic effectively prevents template variables from being used as actual URLs, which is a good security practice.
124-136: Regex pattern validation ✅
The existing regexhttps://([^.]+)\.supabase\.cosuccessfully extracts project refs containing letters, numbers, hyphens, and underscores—and correctly ignores the rootsupabase.coURL. No changes needed.apps/app/src/components/DistributorBadges.tsx (5)
2-6: Clean integration of the new utility module.The import statement correctly brings in the required utilities and type definition from the new distributor-urls module.
11-11: Improved type safety with structured DistributorConfig type.The prop type has been updated to use the more structured
DistributorConfig[]type, which provides better type safety and consistency with the utility functions.
15-23: Efficient use of utility functions for display and URL generation.The component now leverages the centralized utility functions to determine display names and URLs, improving maintainability and consistency across the application.
25-38: Proper implementation of conditional link rendering with security attributes.The component correctly wraps badges in links when URLs are available, includes proper security attributes (
rel="noopener noreferrer"), and opens links in new tabs for better user experience.
20-20: Consistent styling between linked and non-linked badges.The styling is properly maintained between linked and non-linked badges, with appropriate hover effects added to linked badges to indicate their clickable nature.
Also applies to: 43-43
| function getDiscordUrl(config: Record<string, unknown> | undefined): string { | ||
| // Discord links to the specific channel if available | ||
| const channelId = getConfigString(config, "channelId"); | ||
| if (channelId) { | ||
| // Discord channel URLs format: https://discord.com/channels/serverId/channelId | ||
| // Since we don't have serverId, we use @me which works for direct channel links | ||
| return `https://discord.com/channels/@me/${channelId}`; | ||
| } | ||
| return "https://discord.com"; | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Discord URL construction may not work reliably.
The Discord URL construction uses @me as the server ID, which may not work for all channel types. Discord channel URLs typically require both server ID and channel ID.
Consider adding a comment to clarify the limitation or implement a more robust solution:
if (channelId) {
// Discord channel URLs format: https://discord.com/channels/serverId/channelId
- // Since we don't have serverId, we use @me which works for direct channel links
+ // Since we don't have serverId, we use @me which may not work for all channel types
return `https://discord.com/channels/@me/${channelId}`;
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function getDiscordUrl(config: Record<string, unknown> | undefined): string { | |
| // Discord links to the specific channel if available | |
| const channelId = getConfigString(config, "channelId"); | |
| if (channelId) { | |
| // Discord channel URLs format: https://discord.com/channels/serverId/channelId | |
| // Since we don't have serverId, we use @me which works for direct channel links | |
| return `https://discord.com/channels/@me/${channelId}`; | |
| } | |
| return "https://discord.com"; | |
| } | |
| function getDiscordUrl(config: Record<string, unknown> | undefined): string { | |
| // Discord links to the specific channel if available | |
| const channelId = getConfigString(config, "channelId"); | |
| if (channelId) { | |
| // Discord channel URLs format: https://discord.com/channels/serverId/channelId | |
| // Since we don't have serverId, we use @me which may not work for all channel types | |
| return `https://discord.com/channels/@me/${channelId}`; | |
| } | |
| return "https://discord.com"; | |
| } |
🤖 Prompt for AI Agents
In apps/app/src/lib/distributor-urls.ts around lines 98 to 107, the Discord URL
construction uses '@me' as a placeholder for serverId, which may not work for
all channel types since Discord URLs typically require both serverId and
channelId. To fix this, add a clear comment explaining this limitation and
consider implementing a more robust solution that retrieves or requires the
actual serverId to construct valid Discord channel URLs.
| function getCrosspostUrl(config: Record<string, unknown> | undefined): string { | ||
| // Crosspost links to the Open Crosspost platform | ||
| // Could potentially link to specific account if signerId is available | ||
| const signerId = getConfigString(config, "signerId"); | ||
| if (signerId) { | ||
| return `https://near.social/mob.near/widget/MainPage.N.Profile.Page?accountId=${signerId}`; | ||
| } | ||
| return "https://opencrosspost.com"; | ||
| } |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Inconsistent fallback URL for crosspost distributor.
The crosspost function constructs NEAR Social URLs when signerId is available, but falls back to "https://opencrosspost.com" when not. This creates an inconsistency where the same distributor type can link to different platforms.
Consider using a consistent fallback that aligns with the primary URL construction:
- return "https://opencrosspost.com";
+ return "https://near.social";📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function getCrosspostUrl(config: Record<string, unknown> | undefined): string { | |
| // Crosspost links to the Open Crosspost platform | |
| // Could potentially link to specific account if signerId is available | |
| const signerId = getConfigString(config, "signerId"); | |
| if (signerId) { | |
| return `https://near.social/mob.near/widget/MainPage.N.Profile.Page?accountId=${signerId}`; | |
| } | |
| return "https://opencrosspost.com"; | |
| } | |
| function getCrosspostUrl(config: Record<string, unknown> | undefined): string { | |
| // Crosspost links to the Open Crosspost platform | |
| // Could potentially link to specific account if signerId is available | |
| const signerId = getConfigString(config, "signerId"); | |
| if (signerId) { | |
| return `https://near.social/mob.near/widget/MainPage.N.Profile.Page?accountId=${signerId}`; | |
| } | |
| return "https://near.social"; | |
| } |
🤖 Prompt for AI Agents
In apps/app/src/lib/distributor-urls.ts around lines 85 to 93, the fallback URL
for the crosspost distributor is inconsistent, linking to
"https://opencrosspost.com" instead of a NEAR Social URL. To fix this, update
the fallback URL to a consistent NEAR Social URL that aligns with the primary
URL structure, ensuring all crosspost links point to the same platform
regardless of signerId presence.
* add feed conflicts and lowercase id * Adds "my feeds" on profile (#204) * feat: update my feeds tab on profile page * feat: update tabs to be routes * fix: double scrollbar * comment unused files in overview tab * fix: revert rsbuild * fmt * fix: add routegen to prettier ignore * clean up, server side --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * Resolve shot's comments (#205) * feat: add name and tag validation to create * feat: add no activity data in activity tab * add coming soon sections for profile page * feat: clicking on leaderboard feed hashtag will redirect to that feed * fix: keeps name on start when disable feed names collapse * fix: rsbuild * fix: add routegen to prettier ignore * fix: add ability to navigate to collapsed feeds in leaderboard * add ability to expand or collapse all * fix: rsbuild * adjustments * nitpicks --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * feat: new feed edit (#198) * feat: update the feed editor * feat: improve performance, and fix bugs * feat: revert local development change * add routegen to pretttier ignore * fix: resolve code rabbit comments * fix some nitpick comments * fix prettier and build config * formats * merge --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * debounce * nitpicks * adds processing step plan * fix auth * Feat: recent content (#208) * Feat: add recent feeds * feat: add recent content to the main feed page * fmt * Update apps/app/src/hooks/use-rss-feed.ts Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * nitpicks --------- Co-authored-by: Elliot Braem <elliot@everything.dev> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * atuh flow * delete old requests * feat: Distributor badges link to relevant source (#210) * add _tabs * init with a rss feed * xml * fmt --------- Co-authored-by: Zeeshan Ahmad <itexpert120@outlook.com> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
* add feed conflicts and lowercase id * Adds "my feeds" on profile (#204) * feat: update my feeds tab on profile page * feat: update tabs to be routes * fix: double scrollbar * comment unused files in overview tab * fix: revert rsbuild * fmt * fix: add routegen to prettier ignore * clean up, server side --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * Resolve shot's comments (#205) * feat: add name and tag validation to create * feat: add no activity data in activity tab * add coming soon sections for profile page * feat: clicking on leaderboard feed hashtag will redirect to that feed * fix: keeps name on start when disable feed names collapse * fix: rsbuild * fix: add routegen to prettier ignore * fix: add ability to navigate to collapsed feeds in leaderboard * add ability to expand or collapse all * fix: rsbuild * adjustments * nitpicks --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * feat: new feed edit (#198) * feat: update the feed editor * feat: improve performance, and fix bugs * feat: revert local development change * add routegen to pretttier ignore * fix: resolve code rabbit comments * fix some nitpick comments * fix prettier and build config * formats * merge --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * debounce * nitpicks * adds processing step plan * fix auth * Feat: recent content (#208) * Feat: add recent feeds * feat: add recent content to the main feed page * fmt * Update apps/app/src/hooks/use-rss-feed.ts Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * nitpicks --------- Co-authored-by: Elliot Braem <elliot@everything.dev> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * atuh flow * delete old requests * feat: Distributor badges link to relevant source (#210) * add _tabs * init with a rss feed * xml * fmt * append --------- Co-authored-by: Zeeshan Ahmad <itexpert120@outlook.com> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
* add feed conflicts and lowercase id * Adds "my feeds" on profile (#204) * feat: update my feeds tab on profile page * feat: update tabs to be routes * fix: double scrollbar * comment unused files in overview tab * fix: revert rsbuild * fmt * fix: add routegen to prettier ignore * clean up, server side --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * Resolve shot's comments (#205) * feat: add name and tag validation to create * feat: add no activity data in activity tab * add coming soon sections for profile page * feat: clicking on leaderboard feed hashtag will redirect to that feed * fix: keeps name on start when disable feed names collapse * fix: rsbuild * fix: add routegen to prettier ignore * fix: add ability to navigate to collapsed feeds in leaderboard * add ability to expand or collapse all * fix: rsbuild * adjustments * nitpicks --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * feat: new feed edit (#198) * feat: update the feed editor * feat: improve performance, and fix bugs * feat: revert local development change * add routegen to pretttier ignore * fix: resolve code rabbit comments * fix some nitpick comments * fix prettier and build config * formats * merge --------- Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * debounce * nitpicks * adds processing step plan * fix auth * Feat: recent content (#208) * Feat: add recent feeds * feat: add recent content to the main feed page * fmt * Update apps/app/src/hooks/use-rss-feed.ts Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> * nitpicks --------- Co-authored-by: Elliot Braem <elliot@everything.dev> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Elliot Braem <elliot@ejlbraem.com> * atuh flow * delete old requests * feat: Distributor badges link to relevant source (#210) * add _tabs * init with a rss feed * xml * fmt * append * add service url * adjustments * fix --------- Co-authored-by: Zeeshan Ahmad <itexpert120@outlook.com> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
2 participants
Resolved #209
Summary by CodeRabbit