import * as React from 'react';
import { FieldComponents, FieldComponentProps } from '../../types/overrides';
import TextFieldEntry from './TextField';
import NumberField from './NumberField';
import BooleanField from './BooleanField';
import DateField from './DateField';
import EnumField from './EnumField';
import RelationField from './RelationField';
import ImageUploadField from './ImageUploadField';
import FallbackField from './FallbackField';
import DateRangeField from './DateRangeField';
import NumberRangeField from './NumberRangeField';

const WrappedImageUploadField = (props: FieldComponentProps) =>
  React.createElement(ImageUploadField, {
    label: props.field.label,
    value: props.value || '',
    onUpload: async (file: File) => {
      const url = await props.uploadFile?.(file);
      if (url) props.onChange(url);
    },
    uploading: props.uploading,
    baseUrl: props.baseUrl || '',
    disabled: props.disabled,
  });

export const defaultFieldComponents: FieldComponents = {
  string: TextFieldEntry,
  markdown: TextFieldEntry,
  number: NumberField,
  boolean: BooleanField,
  date: DateField,
  datetime: DateField,
  enum: EnumField,
  image: WrappedImageUploadField,
  relation: RelationField,
  default: FallbackField,
  dateRange: DateRangeField,
  numberRange: NumberRangeField,
};