ERP-node/frontend/lib/meta-components/MetaComponentRenderer.tsx

"use client";

/**
 * 메타 컴포넌트 통합 디스패처
 * - component.type에 따라 적절한 렌더러에 모든 런타임 props 전달
 * - V2 컴포넌트 변환 없이 직접 메타 렌더러 호출
 */

import React from "react";
import { FieldRenderer } from "./Field/FieldRenderer";
import { DataViewRenderer } from "./DataView/DataViewRenderer";
import { ActionRenderer } from "./Action/ActionRenderer";
import { LayoutRenderer } from "./Layout/LayoutRenderer";
import { DisplayRenderer } from "./Display/DisplayRenderer";
import { SearchRenderer } from "./Search/SearchRenderer";
import { ModalRenderer } from "./Modal/ModalRenderer";

interface MetaComponentRendererProps {
  component: {
    id: string;
    type: string;
    config: any;
    position?: any;
  };
  // 데이터 바인딩
  formData?: Record<string, any>;
  onFormDataChange?: (fieldName: string, value: any) => void;
  // 선택된 행
  selectedRowsData?: any[];
  onSelectedRowsChange?: (rows: any[], data: any[]) => void;
  // 컨텍스트
  tableName?: string;
  companyCode?: string;
  screenId?: number;
  userId?: string;
  // 콜백
  onRefresh?: () => void;
  // UI 모드
  isDesignMode?: boolean;
  disabled?: boolean;
  className?: string;
  // 레이아웃 children
  children?: React.ReactNode;
}

export function MetaComponentRenderer({
  component,
  formData,
  onFormDataChange,
  selectedRowsData,
  onSelectedRowsChange,
  tableName,
  companyCode,
  screenId,
  userId,
  onRefresh,
  isDesignMode = false,
  disabled = false,
  className,
  children,
}: MetaComponentRendererProps) {
  const { id, type, config } = component;

  // type에 따라 적절한 렌더러에 dispatch
  switch (type) {
    case "meta-field":
      return (
        <FieldRenderer
          id={id}
          config={config}
          formData={formData}
          onFormDataChange={onFormDataChange}
          tableName={tableName}
          companyCode={companyCode}
          screenId={screenId}
          isDesignMode={isDesignMode}
          disabled={disabled}
          className={className}
        />
      );

    case "meta-dataview":
      return (
        <DataViewRenderer
          id={id}
          config={config}
          selectedRowsData={selectedRowsData}
          onSelectedRowsChange={onSelectedRowsChange}
          tableName={tableName}
          companyCode={companyCode}
          screenId={screenId}
          formData={formData}
          onFormDataChange={onFormDataChange}
          isDesignMode={isDesignMode}
          className={className}
          onRefresh={onRefresh}
        />
      );

    case "meta-action":
      return (
        <ActionRenderer
          id={id}
          config={config}
          formData={formData}
          selectedRowsData={selectedRowsData}
          tableName={tableName}
          companyCode={companyCode}
          screenId={screenId}
          userId={userId}
          onRefresh={onRefresh}
          isDesignMode={isDesignMode}
          disabled={disabled}
          className={className}
        />
      );

    case "meta-layout":
      return (
        <LayoutRenderer
          id={id}
          config={config}
          children={children}
          isDesignMode={isDesignMode}
          className={className}
        />
      );

    case "meta-display":
      return (
        <DisplayRenderer
          id={id}
          config={config}
          formData={formData}
          isDesignMode={isDesignMode}
          className={className}
        />
      );

    case "meta-search":
      return (
        <SearchRenderer
          id={id}
          config={config}
          isDesignMode={isDesignMode}
          disabled={disabled}
          className={className}
        />
      );

    case "meta-modal":
      return (
        <ModalRenderer
          id={id}
          config={config}
          isDesignMode={isDesignMode}
          disabled={disabled}
          className={className}
        />
      );

    default:
      return (
        <div className="flex h-20 items-center justify-center rounded border border-destructive bg-destructive/10 text-sm text-destructive">
          Unknown component type: {type}
        </div>
      );
  }
}