'use client';

import React from 'react';
import { useParams, useSearchParams } from 'next/navigation';
import { WorkflowReportLayout } from './components/WorkflowReportLayout';

export default function ReportPage() {
  // Next.js 15 params handling
  // Note: In client components, hooks like useParams() handle the async nature internally or return current values
  const params = useParams();
  const searchParams = useSearchParams();
  
  const symbol = typeof params.symbol === 'string' ? decodeURIComponent(params.symbol) : '';
  const initialTemplateId = searchParams.get('template_id') || undefined;
  const initialMarket = searchParams.get('market') || undefined;
  const initialRequestId = searchParams.get('request_id') || undefined;

  if (!symbol) {
    return <div className="p-8 text-center text-red-500">Invalid Symbol</div>;
  }

  return (
    <WorkflowReportLayout 
      symbol={symbol}
      initialMarket={initialMarket}
      initialTemplateId={initialTemplateId}
      initialRequestId={initialRequestId}
    />
  );
}
