AI-powered meta tag analyzer for preview checker

[anurag629]

Phase 4 — AI Meta Tag Analyzer

Enhance the existing preview checker (`/preview`) with AI-powered analysis and actionable improvement suggestions.

Current State

The preview checker fetches a URL's meta tags and shows how the link appears on 8 platforms. It's purely informational — it shows what exists but doesn't help users improve.

Proposed Enhancement

"✨ Analyze with AI" Button

Add a button to the preview results page that sends the fetched meta data to AI for analysis.

AI Analysis Output

```
┌──────────────────────────────────────────────────┐
│ ✨ AI Analysis │
│──────────────────────────────────────────────────│
│ │
│ Score: 7/10 │
│ ████████░░ │
│ │
│ ✅ Good │
│ • OG title is concise and descriptive (42 chars) │
│ • OG image present with correct dimensions │
│ • Twitter card type correctly set │
│ │
│ ⚠️ Improvements │
│ • Title truncates on Twitter (>70 chars with │
│ site name). Suggested: "Build REST APIs Fast" │
│ • Missing og:locale — add for better i18n │
│ • Description is generic. Try: "Step-by-step │
│ guide to building production REST APIs with │
│ Node.js, Express, and PostgreSQL" │
│ │
│ ❌ Issues │
│ • No twitter:image:alt — accessibility concern │
│ • og:image URL returns 404 │
│ │
│ 💡 Quick Fix: Generate an OG image with OGCOPS │
│ [Create OG Image for this URL →] │
└──────────────────────────────────────────────────┘
```

Analysis Covers

• Title quality: length, truncation risk per platform, clarity, click-worthiness
• Description quality: length, relevance, keyword usage
• Image: presence, dimensions, file size, alt text, URL accessibility
• Missing tags: og:locale, twitter:site, article:author, etc.
• Platform-specific: Twitter card type, LinkedIn aspect ratio, Discord embed limits
• Suggestions: Rewritten title/description alternatives
• Score: 1-10 overall quality rating with breakdown

CTA: Generate OG Image

If the page is missing an OG image or has a poor one, show a prominent CTA to create one with OGCOPS — linking to the editor with the URL pre-filled for Smart Autofill (#27).

Technical

Prompt

Send the full meta tag data (title, description, og:, twitter:, etc.) to AI with instructions to analyze for social media sharing best practices.

Endpoint

Reuse `POST /api/ai/generate` with a specific system prompt for meta analysis. No new endpoint needed.

Acceptance Criteria

• "Analyze with AI" button appears on preview results
• AI returns structured analysis (good, improvements, issues)
• Score displayed with visual bar
• Specific rewrite suggestions for title and description
• Missing tag detection
• Platform-specific truncation warnings
• CTA to create OG image with OGCOPS
• Analysis loads without blocking the existing preview results
• Error state if AI call fails (doesn't break the preview checker)