"use client";

import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { ScrollArea } from "@/components/ui/scroll-area";
import { ComponentPalette } from "./ComponentPalette";
import { TemplatePalette } from "./TemplatePalette";

export function ReportDesignerLeftPanel() {
  return (
    <div className="w-80 border-r bg-white">
      <ScrollArea className="h-full">
        <div className="space-y-4 p-4">
          {/* 템플릿 */}
          <Card className="border-2">
            <CardHeader className="pb-3">
              <CardTitle className="text-sm">기본 템플릿</CardTitle>
            </CardHeader>
            <CardContent className="pt-0">
              <TemplatePalette />
            </CardContent>
          </Card>

          {/* 컴포넌트 */}
          <Card className="border-2">
            <CardHeader className="pb-3">
              <CardTitle className="text-sm">컴포넌트</CardTitle>
            </CardHeader>
            <CardContent className="pt-0">
              <ComponentPalette />
            </CardContent>
          </Card>
        </div>
      </ScrollArea>
    </div>
  );
}