import React from "react";
import { Upload as KendoUpload } from "@progress/kendo-react-upload";
import { UploadProps } from "./UploadProps";

const Upload: React.FC<UploadProps> = ({
  dataTestId,
  accept,
  actionsLayout,
  ariaDescribedBy,
  ariaLabelledBy,
  autoUpload,
  batch,
  className,
  defaultFiles,
  disabled,
  files,
  id,
  listItemUI,
  multiple,
  removeField,
  removeHeaders,
  removeMethod,
  removeUrl,
  responseType,
  restrictions,
  saveField,
  saveHeaders,
  saveMethod,
  saveUrl,
  selectMessageUI,
  showActionButtons,
  showFileList,
  tabIndex,
  withCredentials,
  onAdd,
  onBeforeRemove,
  onBeforeUpload,
  onCancel,
  onProgress,
  onRemove,
  onStatusChange,
}) => (
  <div data-test-id={dataTestId}>
    <KendoUpload
      accept={accept}
      actionsLayout={actionsLayout}
      ariaDescribedBy={ariaDescribedBy}
      ariaLabelledBy={ariaLabelledBy}
      autoUpload={autoUpload}
      batch={batch}
      className={className}
      defaultFiles={defaultFiles}
      disabled={disabled}
      files={files}
      id={id}
      listItemUI={listItemUI}
      multiple={multiple}
      removeField={removeField}
      removeHeaders={removeHeaders}
      removeMethod={removeMethod}
      removeUrl={removeUrl}
      responseType={responseType}
      restrictions={restrictions}
      saveField={saveField}
      saveHeaders={saveHeaders}
      saveMethod={saveMethod}
      saveUrl={saveUrl}
      selectMessageUI={selectMessageUI}
      showActionButtons={showActionButtons}
      showFileList={showFileList}
      tabIndex={tabIndex}
      withCredentials={withCredentials}
      onAdd={onAdd}
      onBeforeRemove={onBeforeRemove}
      onBeforeUpload={onBeforeUpload}
      onCancel={onCancel}
      onProgress={onProgress}
      onRemove={onRemove}
      onStatusChange={onStatusChange}
    />
  </div>
);

export default Upload;
