"use client";

import { useSearchParams } from "next/navigation";
import { Suspense } from "react";
import { Header } from "@/components/layout/header";
import { QueryResults } from "@/components/skeptic";

function SkepticContent() {
  const searchParams = useSearchParams();
  const subject = searchParams.get("subject") ?? undefined;
  const predicate = searchParams.get("predicate") ?? undefined;

  return <QueryResults initialSubject={subject} initialPredicate={predicate} />;
}

export default function SkepticPage() {
  return (
    <>
      <Header title="Skeptic Query" />
      <div className="p-6">
        <Suspense fallback={<div className="text-sm text-muted-foreground">Loading...</div>}>
          <SkepticContent />
        </Suspense>
      </div>
    </>
  );
}
