"use client";

import React from "react";
import { Map } from "lucide-react";

interface MapPreviewComponentProps {
  component: {
    config?: {
      dataSource?: {
        tableName?: string;
      };
    };
  };
}

export default function MapPreviewComponent({ component }: MapPreviewComponentProps) {
  const tableName = component.config?.dataSource?.tableName;

  return (
    <div className="flex h-full w-full items-center justify-center border-2 border-dashed border-blue-300 bg-gradient-to-br from-blue-50 to-indigo-50">
      <div className="text-center">
        <Map className="mx-auto h-12 w-12 text-blue-600" />
        <p className="mt-2 text-sm font-medium text-blue-900">지도 컴포넌트</p>
        {tableName && <p className="mt-1 text-xs text-blue-600">테이블: {tableName}</p>}
      </div>
    </div>
  );
}
