fix(og): stop bypassing cache on every OG image request (JhaSourav07#3412)

## Description

Fixes a bug where the OG image endpoint was bypassing cache on every
request, firing a fresh GitHub GraphQL call on each link-preview bot
crawl (Slack, Discord, Twitter etc.) and silently exhausting API rate
limit quota.

Closes JhaSourav07#3398

## Pillar

Bug Fix

## Changes Made

- Switched `ogParamsSchema.parse()` to `safeParse()` with proper 400
error response
- Changed `bypassCache: true` to `bypassCache: refresh`
- Added `refresh` field to `ogParamsSchema`
- Aligned `Cache-Control` response header with actual fetch behaviour

## Checklist

- [x] My code follows the project style guidelines
- [x] I have performed a self-review of my code
- [x] I have run `npm run lint` and `npm run typecheck` locally
- [x] No new errors introduced
- [x] Related issue is linked above

Author: JhaSourav07

app/api/og/route.tsx

@@ -21,7 +21,6 @@ const displayDomain = (() => {
 
 function getLuminance(hex: string) {
   let normalizedHex = hex.trim();
-  // Normalize short hex (e.g., #fff or #ffff) to #rrggbb (alpha is ignored for luminance)
   if (normalizedHex.length === 4 || normalizedHex.length === 5) {
     normalizedHex = `#${normalizedHex[1]}${normalizedHex[1]}${normalizedHex[2]}${normalizedHex[2]}${normalizedHex[3]}${normalizedHex[3]}`;
   }
@@ -37,12 +36,20 @@ function getLuminance(hex: string) {
 
 export async function GET(req: NextRequest) {
   const { searchParams } = new URL(req.url);
-  const parsed = ogParamsSchema.parse(Object.fromEntries(searchParams.entries()));
-  let { user } = parsed;
-  const { theme, bg, text, accent } = parsed;
 
-  // Sanitize user: limit to 39 chars (GitHub max length) and strip invalid chars
-  user = user.slice(0, 39).replace(/[^a-zA-Z0-9-]/g, '');
+  const parseResult = ogParamsSchema.safeParse(Object.fromEntries(searchParams.entries()));
+
+  if (!parseResult.success) {
+    return new Response(
+      JSON.stringify({ error: 'Invalid parameters', details: parseResult.error.flatten() }),
+      {
+        status: 400,
+        headers: { 'Content-Type': 'application/json', 'Cache-Control': 'no-store' },
+      }
+    );
+  }
+
+  const { user, theme, bg, text, accent, refresh } = parseResult.data;
 
   const selectedTheme = themes[theme] || themes.dark;
   const resolvedBg = `#${bg || selectedTheme.bg}`;
@@ -59,19 +66,23 @@ export async function GET(req: NextRequest) {
   let longestStreak = 0;
   let currentStreak = 0;
 
-  // Only the data fetching is wrapped in try/catch — not the JSX rendering.
   try {
-    const userData = await fetchGitHubContributions(user, { bypassCache: true });
-    const calendar = userData.calendar;
-    const stats = calculateStreak(calendar);
+    // bypassCache mirrors the ?refresh=true pattern used by /api/stats and /api/streak.
+    // Without this, every link-preview bot crawl fires a fresh GitHub GraphQL request,
+    // burning API quota on an endpoint that is embedded in every page's <meta> tag.
+    const data = await fetchGitHubContributions(user, { bypassCache: refresh });
+    const stats = calculateStreak(data.calendar ?? data);
     totalCommits = stats.totalContributions;
     longestStreak = stats.longestStreak;
     currentStreak = stats.currentStreak;
   } catch (err) {
     console.error('[OG] stats fetch failed:', err);
-    // fallback to zeros if GitHub is unreachable
   }
 
+  const cacheControl = refresh
+    ? 'no-cache, no-store, must-revalidate'
+    : 'public, max-age=3600, stale-while-revalidate=86400';
+
   return new ImageResponse(
     <div
       style={{
@@ -112,7 +123,6 @@ export async function GET(req: NextRequest) {
         {`@${user}`}
       </div>
       <div style={{ display: 'flex', gap: '48px' }}>
-        {/* Total Commits */}
         <div
           style={{
             display: 'flex',
@@ -133,7 +143,6 @@ export async function GET(req: NextRequest) {
             Total Commits
           </div>
         </div>
-        {/* Longest Streak */}
         <div
           style={{
             display: 'flex',
@@ -154,7 +163,6 @@ export async function GET(req: NextRequest) {
             {'Longest Streak 🔥'}
           </div>
         </div>
-        {/* Current Streak */}
         <div
           style={{
             display: 'flex',
@@ -192,7 +200,7 @@ export async function GET(req: NextRequest) {
       width: 1200,
       height: 630,
       headers: {
-        'Cache-Control': 'public, max-age=3600, stale-while-revalidate=86400',
+        'Cache-Control': cacheControl,
       },
     }
   );

lib/validations.ts

@@ -430,6 +430,7 @@ export const ogParamsSchema = z
       .optional()
       .transform(toEmptyStringAsUndefined)
       .transform(toValidHexColor('000000')),
+    refresh: z.string().optional().transform(toRefreshFlag),
   })
   .transform((data) => ({
     ...data,