'use client';

type ClientErrorPayload = {
  type: 'app_error' | 'window_error' | 'unhandled_rejection';
  message: string;
  stack?: string | null;
  digest?: string | null;
  source?: string | null;
  url?: string | null;
  userAgent?: string | null;
  timestamp?: string;
};

const CLIENT_ERROR_ENDPOINT = '/api/free-pick/client-error';
const MAX_STACK_LENGTH = 2000;
const MAX_MESSAGE_LENGTH = 500;

function trimValue(value: string | null | undefined, maxLength: number): string | null {
  if (typeof value !== 'string') return null;
  const trimmed = value.trim();
  if (!trimmed) return null;
  return trimmed.slice(0, maxLength);
}

export async function reportClientError(payload: ClientErrorPayload): Promise<void> {
  if (typeof window === 'undefined') return;

  const body = {
    type: payload.type,
    message: trimValue(payload.message, MAX_MESSAGE_LENGTH),
    stack: trimValue(payload.stack, MAX_STACK_LENGTH),
    digest: trimValue(payload.digest, 200),
    source: trimValue(payload.source, 300),
    url: trimValue(payload.url || window.location.href, 500),
    ua: trimValue(payload.userAgent || window.navigator.userAgent, 500),
    ts: payload.timestamp || new Date().toISOString(),
  };

  if (!body.message) return;

  await fetch(CLIENT_ERROR_ENDPOINT, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify(body),
    keepalive: true,
  });
}