"use client";

import { Loader2 } from "lucide-react";
import FarmerDashboardShell from "@/components/farmer/FarmerDashboardShell";
import TradeModule from "@/components/farmer/modules/TradeModule";
import { useFarmerDashboard } from "@/components/farmer/hooks/useFarmerDashboard";

export default function TradePage() {
  const { loading, data, user } = useFarmerDashboard();

  if (loading) {
    return (
      <FarmerDashboardShell>
        <div className="flex items-center justify-center py-20">
          <Loader2 className="w-8 h-8 text-green-deep animate-spin" />
        </div>
      </FarmerDashboardShell>
    );
  }

  return (
    <FarmerDashboardShell userPhone={user?.phone}>
      <TradeModule data={data?.trade ?? null} />
    </FarmerDashboardShell>
  );
}