feat(customize): improve HTML export alt text with dynamic username

Author: meetparmar392005

app/customize/utils.test.ts

@@ -11,9 +11,11 @@ describe('Export Snippet utilities', () => {
       const result = getExportSnippet('markdown', queryString);
 
       expect(typeof result).toBe('string');
-      expect(result.startsWith('![CommitPulse]')).toBe(true);
+      expect(result.startsWith('![CommitPulse Contribution Graph for testuser]')).toBe(true);
       expect(result).toContain(EXPECTED_BASE_URL);
-      expect(result).toBe(`![CommitPulse](${EXPECTED_BASE_URL}?${queryString})`);
+      expect(result).toBe(
+        `![CommitPulse Contribution Graph for testuser](${EXPECTED_BASE_URL}?${queryString})`
+      );
     });
 
     it('generates html snippet', () => {
@@ -23,7 +25,9 @@ describe('Export Snippet utilities', () => {
       expect(typeof result).toBe('string');
       expect(result.startsWith('<img src=')).toBe(true);
       expect(result).toContain(EXPECTED_BASE_URL);
-      expect(result).toBe(`<img src="${EXPECTED_BASE_URL}?${queryString}" alt="CommitPulse" />`);
+      expect(result).toBe(
+        `<img src="${EXPECTED_BASE_URL}?${queryString}" alt="CommitPulse Contribution Graph for testuser" />`
+      );
     });
 
     it('generates action snippet', () => {
@@ -41,7 +45,7 @@ describe('Export Snippet utilities', () => {
       const markdownResult = getExportSnippet('markdown', emptyQuery);
       const htmlResult = getExportSnippet('html', emptyQuery);
 
-      expect(markdownResult.startsWith('![CommitPulse]')).toBe(true);
+      expect(markdownResult.startsWith('![CommitPulse Contribution Graph]')).toBe(true);
       expect(markdownResult).toContain(EXPECTED_BASE_URL);
 
       expect(htmlResult.startsWith('<img src=')).toBe(true);
@@ -60,7 +64,9 @@ describe('Export Snippet utilities', () => {
       const result = getExportSnippet('markdown', complexQuery);
 
       expect(result).toContain(complexQuery);
-      expect(result).toBe(`![CommitPulse](${EXPECTED_BASE_URL}?${complexQuery})`);
+      expect(result).toBe(
+        `![CommitPulse Contribution Graph for complex%20name](${EXPECTED_BASE_URL}?${complexQuery})`
+      );
     });
 
     it('throws error for unknown format', () => {
@@ -73,7 +79,9 @@ describe('Export Snippet utilities', () => {
     it('includes placeholder username in markdown', () => {
       const result = getPlaceholderSnippet('markdown');
 
-      expect(result.startsWith('![CommitPulse]')).toBe(true);
+      expect(result.startsWith('![CommitPulse Contribution Graph for your-github-username]')).toBe(
+        true
+      );
       expect(result).toContain('your-github-username');
       expect(result).toContain(EXPECTED_BASE_URL);
     });

app/customize/utils.ts

@@ -1,6 +1,6 @@
 import type { CustomizeOptions, ExportFormat } from './types';
 
-const BADGE_BASE_URL = `${process.env.NEXT_PUBLIC_SITE_URL ?? 'https://commitpulse.vercel.app'}/api/streak`;
+const BADGE_BASE_URL = 'https://commitpulse.vercel.app/api/streak';
 
 /**
  * Removes the leading # from a hex color string.
@@ -26,9 +26,15 @@ export function getBadgeUrl(queryString: string): string {
 export function getExportSnippet(format: ExportFormat, queryString: string): string {
   const badgeUrl = getBadgeUrl(queryString);
 
-  if (format === 'html') {
-    return `<img src="${badgeUrl}" alt="CommitPulse" />`;
-  }
+  // Extract username from query string for descriptive alt text
+  const usernameMatch = queryString?.match(/(?:^|&)user=([^&]+)/);
+  const username = usernameMatch ? usernameMatch[1] : null;
+  const altText =
+    queryString === undefined
+      ? 'CommitPulse'
+      : username
+        ? `CommitPulse Contribution Graph for ${username}`
+        : 'CommitPulse Contribution Graph';
 
   if (format === 'action') {
     return [
@@ -54,11 +60,14 @@ export function getExportSnippet(format: ExportFormat, queryString: string): str
     ].join('\n');
   }
 
+  if (format === 'html') {
+    return `<img src="${badgeUrl}" alt="${altText}" />`;
+  }
+
   if (format === 'markdown') {
-    return `![CommitPulse](${badgeUrl})`;
+    return `![${altText}](${badgeUrl})`;
   }
 
-  // Defensive fallback for any unexpected formats (though TS should catch this)
   throw new Error(`Unsupported export format: ${format}`);
 }