"use client";

import React from "react";
import { ComponentData } from "@/types/screen";
import { componentRegistry, ComponentRenderer } from "../DynamicComponentRenderer";
import { File } from "lucide-react";

// 파일 컴포넌트 렌더러
const FileRenderer: ComponentRenderer = ({ component, ...props }) => {
  return (
    <div className="flex h-full flex-col">
      <div className="pointer-events-none flex-1 rounded border-2 border-dashed border-gray-300 bg-gray-50 p-4">
        <div className="flex h-full flex-col items-center justify-center text-center">
          <File className="mb-2 h-8 w-8 text-gray-400" />
          <p className="text-sm text-gray-600">파일 업로드 영역</p>
          <p className="mt-1 text-xs text-gray-400">미리보기 모드</p>
        </div>
      </div>
    </div>
  );
};

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

export { FileRenderer };