import React from "react";
import { Button } from "@/components/ui/button";
import { FileText, Upload } from "lucide-react";
import { useAgentGraph } from "@/context/AgentGraphContext";

export function UnifiedButtonSection() {
  const { actions } = useAgentGraph();

  const handleExampleTraces = () => {
    actions.setActiveView("example-traces");
  };

  const handleUploadTrace = () => {
    actions.setActiveView("upload");
  };

  return (
    <>
      <Button
        onClick={handleExampleTraces}
        className="w-full justify-start gap-3 h-8 px-3 text-sm font-medium mb-1 hover:bg-muted/80 transition-colors"
        variant="ghost"
      >
        <FileText className="h-4 w-4" />
        Gallery
      </Button>

      <Button
        onClick={handleUploadTrace}
        className="w-full justify-start gap-3 h-8 px-3 text-sm font-medium mb-1 hover:bg-muted/80 transition-colors"
        variant="ghost"
        data-upload-trigger
      >
        <Upload className="h-4 w-4" />
        Upload
      </Button>
    </>
  );
}