"use client";

import React from "react";
import { ComponentData } from "@/types/screen";
import { componentRegistry, ComponentRenderer } from "../DynamicComponentRenderer";
import { DataTableTemplate } from "@/components/screen/templates/DataTableTemplate";

// 데이터 테이블 컴포넌트 렌더러
const DataTableRenderer: ComponentRenderer = ({ component, ...props }) => {
  const dataTableComponent = component as any; // DataTableComponent 타입

  return (
    <DataTableTemplate
      title={dataTableComponent.title || dataTableComponent.label}
      description={`${dataTableComponent.label}을 표시하는 데이터 테이블`}
      columns={dataTableComponent.columns}
      filters={dataTableComponent.filters}
      pagination={dataTableComponent.pagination}
      actions={
        dataTableComponent.actions || {
          showSearchButton: dataTableComponent.showSearchButton ?? true,
          searchButtonText: dataTableComponent.searchButtonText || "검색",
          enableExport: dataTableComponent.enableExport ?? true,
          enableRefresh: dataTableComponent.enableRefresh ?? true,
          enableAdd: dataTableComponent.enableAdd ?? true,
          enableEdit: dataTableComponent.enableEdit ?? true,
          enableDelete: dataTableComponent.enableDelete ?? true,
          addButtonText: dataTableComponent.addButtonText || "추가",
          editButtonText: dataTableComponent.editButtonText || "수정",
          deleteButtonText: dataTableComponent.deleteButtonText || "삭제",
        }
      }
      style={component.style}
      className="h-full w-full"
      isPreview={true}
    />
  );
};

// 레지스트리에 등록
componentRegistry.register("datatable", DataTableRenderer);

export { DataTableRenderer };
