"use client";

/**
 * 세금계산서 목록 컴포넌트 (레지스트리용 래퍼)
 */

import React from "react";
import { TaxInvoiceList } from "@/components/tax-invoice";
import { TaxInvoiceListConfig } from "./types";

interface TaxInvoiceListComponentProps {
  config?: TaxInvoiceListConfig;
  componentId?: string;
  isEditMode?: boolean;
}

export function TaxInvoiceListComponent({
  config,
  componentId,
  isEditMode,
}: TaxInvoiceListComponentProps) {
  // 편집 모드에서는 플레이스홀더 표시
  if (isEditMode) {
    return (
      <div className="flex h-full min-h-[300px] items-center justify-center rounded-lg border-2 border-dashed border-gray-300 bg-gray-50">
        <div className="text-center">
          <div className="text-muted-foreground mb-2 text-4xl">📄</div>
          <p className="text-muted-foreground text-sm font-medium">세금계산서 목록</p>
          <p className="text-muted-foreground text-xs">
            {config?.title || "세금계산서 관리"}
          </p>
        </div>
      </div>
    );
  }

  return (
    <div className="h-full w-full" style={{ height: config?.height || "auto" }}>
      <TaxInvoiceList />
    </div>
  );
}

// 래퍼 컴포넌트 (레지스트리 호환용)
export function TaxInvoiceListWrapper(props: any) {
  return <TaxInvoiceListComponent {...props} />;
}