Skip to content

feat: add partners page#13

Merged
calebephrem merged 3 commits into
open-devhub:mainfrom
calebephrem:main
Jun 22, 2026
Merged

feat: add partners page#13
calebephrem merged 3 commits into
open-devhub:mainfrom
calebephrem:main

Conversation

@calebephrem

Copy link
Copy Markdown
Member
  • add partners page
  • add more redirect links

@vercel

vercel Bot commented Jun 22, 2026

Copy link
Copy Markdown

@calebephrem is attempting to deploy a commit to the aditya ojha's projects Team on Vercel.

A member of the Team first needs to authorize it.

@devhub-bot devhub-bot Bot added the feat New feature label Jun 22, 2026
@beetle-ai

beetle-ai Bot commented Jun 22, 2026

Copy link
Copy Markdown
Contributor

Summary by Beetle

This PR enhances the website's navigation and community engagement capabilities by adding a comprehensive partners page and expanding redirect link options. The changes introduce a new /partners route that dynamically displays partner Discord servers with live statistics, rich metadata, and interactive UI elements, while also adding convenient shorthand URLs for accessing GitHub repositories, discussions, and community channels.

📁 File Changes Summary (Consolidated across all commits):

File Status Changes Description
lib/redirects.config.ts Modified +12/-2 Expanded redirect configuration with additional shorthand URLs: added /join and /chat aliases for Discord invite, /org and /gh for GitHub, and introduced dynamic routes for repository access (/repo/:repo, /r/:repo) and discussions (/discussions/:discussion, /d/:discussion)
app/partners/page.tsx Added +655/-0 Created a comprehensive partners showcase page featuring Discord server integration with live member/online counts, animated UI components, server banners, tags, and interactive join buttons. Implements client-side Discord API fetching with fallback styling options
components/Footer.tsx Modified +1/-0 Added "Partners" navigation link to footer menu for easy access to the new partners page

Total Changes: 3 files changed, +668 additions, -2 deletions

🗺️ Walkthrough:

sequenceDiagram
participant User
participant Website
participant Discord API
participant Partner Server
User->>Website: Visit /partners
Website->>Website: Render page skeleton
par Fetch all partner data
Website->>Discord API: GET /invites/{code1}?with_counts=true
Website->>Discord API: GET /invites/{code2}?with_counts=true
Website->>Discord API: GET /invites/{code3}?with_counts=true
end
Discord API-->>Website: Return guild metadata
Note over Discord API,Website: name, description, icon, banner, member count, online count
Website->>Website: Process & render cards
Note over Website: Apply fallback styling if banner/icon missing
Website-->>User: Display partner cards
User->>Website: Click "Join Server"
Website->>Partner Server: Redirect to discord.gg/{code}
Partner Server-->>User: Discord invite page
User->>Website: Click "Website"
Website->>Partner Server: Open partner website
Loading

🎯 Key Changes:

  • Dynamic Partners Page: Implements a fully-featured partners showcase with real-time Discord server statistics (member count, online count) fetched via Discord's public API
  • Rich Visual Design: Features animated cards with server banners (image or gradient fallback), custom logo displays with initials fallback, corner bracket decorations, and circuit-pattern overlays
  • Enhanced Redirect System: Adds 8 new redirect routes including shorthand aliases (/join, /chat, /org, /gh) and dynamic repository/discussion routing patterns
  • Partner Configuration: Supports flexible partner metadata including custom tags, website URLs, and fallback banner colors/images when Discord data is unavailable
  • Responsive UI Components: Utilizes Framer Motion for staggered animations, hover effects, and smooth transitions throughout the partners page
  • Footer Integration: Seamlessly adds partners page to site navigation for improved discoverability

📊 Impact Assessment:

  • Security:
  • ✅ Uses Discord's public API endpoints (no authentication required)
  • ✅ Implements rel="noopener noreferrer" on external links to prevent tabnabbing attacks
  • ⚠️ Client-side API calls expose invite codes in browser (acceptable for public invites)
  • ⚠️ No rate limiting implemented for Discord API calls - could hit rate limits with many partners
  • ✅ Dynamic redirect routes use parameterized patterns safely
  • Performance:
  • ⚠️ Fetches all partner data on page load using Promise.allSettled - could be slow with many partners
  • ✅ Uses optimized Discord CDN URLs with size parameters (?size=128, ?size=1024)
  • ⚠️ Large banner images (1024px) may impact initial load time
  • ✅ Implements loading states to prevent layout shift
  • ⚠️ No caching strategy - refetches Discord data on every page visit
  • ✅ Staggered animations prevent render blocking
  • Maintainability:
  • ✅ Well-structured partner configuration array for easy additions/removals
  • ✅ Clear separation of concerns (data fetching, rendering, styling)
  • ✅ Comprehensive TypeScript types for Discord API responses
  • ✅ Reusable color palette system for logo styling
  • ⚠️ Hardcoded partner data in component file - consider moving to separate config/CMS
  • ✅ Inline documentation with section separators
  • ⚠️ 655-line component could benefit from extraction into smaller sub-components
  • Testing:
  • ⚠️ No test coverage for new partners page functionality
  • ⚠️ No error handling UI for failed Discord API requests (silently returns null)
  • ⚠️ No validation for partner configuration data
  • ⚠️ Redirect routes lack test coverage for edge cases (special characters, malformed params)
  • ⚠️ No E2E tests for Discord API integration
  • ✅ TypeScript provides compile-time type safety for Discord data structures
⚙️ Settings

Severity Threshold: Medium — Balanced feedback — medium and high severity issues only.Change in Settings
Custom Rules: Define your own review rules — Set Custom Rules
PR Summary: Configure PR summary — Change in Settings

📖 User Guide
  • Once repos are connected, PR analysis is automatically enabled. You can disable analysis for this repo from beetleai.dev/analysis
  • Comment @beetle on any PR to start analysis manually
  • Comment @beetle stop to stop any ongoing analysis

Follow us: Beetle · X · LinkedIn

Comment thread lib/redirects.config.ts Outdated
Comment thread app/partners/page.tsx
Comment on lines +118 to +124
const results = await Promise.allSettled(
partners.map((p) =>
fetch(
`https://discord.com/api/v10/invites/${p.inviteCode}?with_counts=true`,
).then((r) => r.json()),
),
);

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Discord API fetch operations lack error handling and could fail silently. While Promise.allSettled prevents complete failure, individual fetch errors aren't logged or handled, making debugging difficult. Additionally, there's no timeout mechanism, which could cause the page to hang indefinitely if Discord's API is slow or unresponsive.

Confidence: 5/5

Suggested Fix
Suggested change
const results = await Promise.allSettled(
partners.map((p) =>
fetch(
`https://discord.com/api/v10/invites/${p.inviteCode}?with_counts=true`,
).then((r) => r.json()),
),
);
const results = await Promise.allSettled(
partners.map((p) =>
fetch(
`https://discord.com/api/v10/invites/${p.inviteCode}?with_counts=true`,
{ signal: AbortSignal.timeout(5000) }
)
.then((r) => {
if (!r.ok) throw new Error(`HTTP ${r.status}`);
return r.json();
})
.catch((err) => {
console.error(`Failed to fetch Discord data for ${p.inviteCode}:`, err);
return null;
}),
),
);

Add a 5-second timeout to prevent hanging requests, check HTTP response status, and log errors for debugging. The catch block ensures failed requests return null gracefully while providing visibility into failures.

Prompt for AI

Copy this prompt to your AI IDE to fix this issue locally:

In app/partners/page.tsx around line 118, the Discord API fetch operations lack error handling and timeout mechanisms; add a 5-second timeout using AbortSignal.timeout(5000), check the HTTP response status with if (!r.ok) throw new Error, and add a catch block to log errors with console.error while returning null for failed requests to ensure graceful degradation.

📍 This suggestion applies to lines 118-124

Co-authored-by: beetle-ai[bot] <221859081+beetle-ai[bot]@users.noreply.github.com>
@beetle-ai

beetle-ai Bot commented Jun 22, 2026

Copy link
Copy Markdown
Contributor

Important

Review skipped

Bot user detected.

To trigger a single review, invoke the @beetle command.

⚙️ Settings

Severity Threshold: Medium — Balanced feedback — medium and high severity issues only.Change in Settings
Custom Rules: Define your own review rules — Set Custom Rules
PR Summary: Configure PR summary — Change in Settings

📖 User Guide
  • Once repos are connected, PR analysis is automatically enabled. You can disable analysis for this repo from beetleai.dev/analysis
  • Comment @beetle on any PR to start analysis manually
  • Comment @beetle stop to stop any ongoing analysis

Follow us: Beetle · X · LinkedIn

@calebephrem calebephrem merged commit cd233cf into open-devhub:main Jun 22, 2026
0 of 2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

feat New feature

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant