/* eslint-disable react/display-name */
import React, { PropsWithChildren, useState } from 'react'
import { Button, Upload, TextArea, UploadData, isUploadRealFile } from 'react-icecream'
import { UploadIcon } from 'react-icecream/icons'

import './demo.less'

export default () => {
  const [text, setText] = useState('')

  const onChange1 = (data: UploadData[]) => {
    const current = data[0]
    if (current && isUploadRealFile(current) && current.file.size <= 100 * 1024 * 1024) {
      current.file.text().then(val => setText(val))
    }
  }

  return (
    <div className="upload-wrapper">
      <div className="upload-comp">
        <Line>
          <Upload
            value={[]}
            onChange={onChange1}
            onUpload={() => undefined}
            showFileList={false}
          >
            <Button icon={<UploadIcon />}>只获取数据，不进行上传</Button>
          </Upload>
          <TextArea style={{ marginTop: 12, width: 400 }} value={text} onChange={setText} />
        </Line>
      </div>
    </div>
  )
}

function Line({ children }: PropsWithChildren<{}>) {
  return <div style={{ marginBottom: '24px' }}>{children}</div>
}