// ✅ CORRECT
import { useShare } from "@/hooks/useShare";

const { share, isSharing, copied, supportsNativeShare } = useShare({
  contentType: 'achievement',
  itemId: cardId,
});

await share({
  title: "My Achievement",
  text: "I walked 12,345 steps today!",
  url: shareUrl,
}, 'whatsapp');

// ❌ WRONG - Direct platform calls
window.open(`https://wa.me/?text=${message}`, '_blank');

// ✅ CORRECT - Config-driven
import { METRIC_CONFIGS, MetricType } from "@/lib/sharing/metricConfig";

const config = METRIC_CONFIGS[metricType];
const display = `${config.formatValue(value)} ${config.unit}`;

// ❌ WRONG - Hardcoded
const display = `${value.toLocaleString()} steps`;

// ✅ CORRECT - Concise
"Just hit 12,345 steps today! 🚶 #StepLeague"

// ❌ WRONG - Too long
"Hey everyone! I wanted to share that I walked 12,345 steps today which is amazing because last week I only did 10,000..."

import { ImageResponse } from "next/og";
import { NextRequest } from "next/server";

export async function GET(request: NextRequest) {
  const { searchParams } = request.nextUrl;

  const metricType = searchParams.get("metric_type") || "steps";
  const value = parseInt(searchParams.get("value") || "0");
  const name = searchParams.get("name") || "Player";
  // ... more params

  return new ImageResponse(
    (
      <div style={{
        height: "100%",
        width: "100%",
        display: "flex",
        // ... styling
      }}>
        {/* Card content */}
      </div>
    ),
    {
      width: 1200,
      height: 630,
    }
  );
}

/api/og?metric_type=steps&value=12345&name=John&rank=3&period=This%20Week&improvement=15&league=Team%20Alpha

export type MetricType =
  | 'steps'
  | 'calories'
  | 'slp'
  | 'distance'
  | 'swimming'
  | 'cycling'
  | 'running';

export interface MetricConfig {
  type: MetricType;
  displayName: string;      // "Steps", "Calories", "SLP"
  unit: string;             // "steps", "kcal", "SLP", "km"
  emoji: string;            // "🚶", "🔥", "⚡", "🚴"
  gradient: string;         // Tailwind gradient classes
  formatValue: (value: number) => string;
}

export const METRIC_CONFIGS: Record<MetricType, MetricConfig> = {
  steps: {
    type: 'steps',
    displayName: 'Steps',
    unit: 'steps',
    emoji: '🚶',
    gradient: 'from-sky-500 to-emerald-500',
    formatValue: (v) => v.toLocaleString(),
  },
  // Future metrics added here (PRD-48)
};

function ShareCard({ metricType, value }: Props) {
  const config = METRIC_CONFIGS[metricType];

  return (
    <div className={`bg-gradient-to-r ${config.gradient}`}>
      <span>{config.emoji}</span>
      <span>{config.formatValue(value)} {config.unit}</span>
    </div>
  );
}

export const SHARE_MESSAGES: Record<CardType, (data: ShareData) => string> = {
  daily: (d) => `Just logged ${d.formattedValue} today! ${d.emoji} #StepLeague`,
  weekly: (d) => `My week: ${d.formattedValue} (avg ${d.average}/day) 💪 #StepLeague`,
  personal_best: (d) => `NEW PERSONAL BEST! ${d.formattedValue} 🏆 #StepLeague`,
  streak: (d) => `${d.value} days in a row! 🔥 #StepLeague`,
  challenge: (d) => `Can you beat my ${d.formattedValue}? 💪 #StepLeague`,
  rank_change: (d) => `Moved from #${d.oldRank} to #${d.newRank}! 🚀 #StepLeague`,
};

/share/[userId]?type=daily&metric=steps&value=12345&period=today&rank=3&league=Team%20Alpha

/s/xK7mN2pQ

CREATE TABLE share_cards (
  id UUID PRIMARY KEY,
  short_code VARCHAR(8) UNIQUE NOT NULL,
  user_id UUID REFERENCES users(id),
  card_type VARCHAR(50) NOT NULL,
  metric_type VARCHAR(20) DEFAULT 'steps',
  metric_value INTEGER NOT NULL,
  -- ... additional fields
);

import { nanoid } from 'nanoid';

function generateShortCode(): string {
  return nanoid(8); // e.g., "xK7mN2pQ"
}

// Track share intent (modal opened)
analytics.trackEvent('share_intent', {
  card_type: 'daily',
  metric_type: 'steps',
  source: 'stats_hub', // or 'post_submission', 'milestone'
});

// Track share completion
analytics.share('achievement', cardId, platform);
// Sends to both GA4 and PostHog

const shareUrl = new URL(baseUrl);
shareUrl.searchParams.set('utm_source', 'share');
shareUrl.searchParams.set('utm_medium', platform); // 'whatsapp', 'twitter', 'copy'
shareUrl.searchParams.set('utm_campaign', cardType); // 'daily', 'streak', etc.

// In page.tsx generateMetadata
export async function generateMetadata({ searchParams }): Promise<Metadata> {
  const ogImageUrl = new URL("/api/og", process.env.NEXT_PUBLIC_APP_URL);
  // Add all params...

  return {
    title,
    description,
    openGraph: {
      title,
      description,
      images: [{
        url: ogImageUrl.toString(),
        width: 1200,
        height: 630,
        alt: title,
      }],
      type: "website",
    },
    twitter: {
      card: "summary_large_image",
      title,
      description,
      images: [ogImageUrl.toString()],
    },
  };
}

const waUrl = `https://wa.me/?text=${encodeURIComponent(fullMessage)}`;
window.open(waUrl, "_blank", "noopener,noreferrer");

// In BatchSubmissionForm or SubmissionForm
const handleSubmitSuccess = () => {
  // Check user preference
  if (userPreferences.sharePromptsEnabled !== false) {
    setShowShareModal(true);
  }
};

const STREAK_MILESTONES = [7, 14, 30, 50, 100, 365];

function checkForMilestone(newStreak: number): boolean {
  return STREAK_MILESTONES.includes(newStreak);
}

// In submission handler
if (newSteps > userStats.best_day_steps) {
  triggerSharePrompt({ type: 'personal_best', value: newSteps });
}

export function useShare(options: UseShareOptions = {}) {
  const share = useCallback(async (data: ShareData, platform: SharePlatform = "native") => {
    // Track in analytics immediately (capture intent)
    if (options.contentType) {
      analytics.share(options.contentType, options.itemId, platform);
    }

    switch (platform) {
      case "whatsapp":
        const waUrl = `https://wa.me/?text=${encodeURIComponent(fullMessage)}`;
        window.open(waUrl, "_blank", "noopener,noreferrer");
        break;
      // ... other platforms
    }
  }, [options]);

  return { share, isSharing, copied, supportsNativeShare };
}