File upload

I am not sure if this is in scope for this project. But I can’t figure out how to have Feather JS accept a file from <FileInput>

Can someone point give some pointers? Thanks!

[AshotN]

Thank you kindly for this, that exactly what I needed. On a similar note, is there a way to set the form as a enctype="multipart/form-data"? Thanks again for the help.

[josx]

it is out of the scope, but i can share with you some legacy code on how to do it:

client:

const dataProvider = restClient(feathersClient, { id: '_id', usePatch: true });

export class OperacionCreate extends Component {
  constructor(props) {
    super(props);
    this.state = {
      currentFile: null,
      result: null,
      isSaving: false
    }
    this.clickHandler = this.handleClick.bind(this)
    this.fileHandler = this.onFileChange.bind(this)
  }
  onFileChange(file) {
    this.setState({currentFile: file})
  }
  handleClick() {
    if (!this.state.isSaving && this.state.currentFile){
      this.setState({isSaving: true})
      convertFileToBase64(this.state.currentFile).then((convertedFile)=>{
        dataProvider(CREATE, 'operaciones', { data: {uri: convertedFile}})
        .then((resp) => {
          this.setState({result: resp.data.data})
        }).finally(()=> {
          this.setState({isSaving: false})
        })
      })
    }
  }
  render() {
    return (
      <Create {...this.props} title="Importar Operaciones">
        <SimpleForm toolbar={<OperacionToolbar isSaving={this.state.isSaving} handleClick={this.clickHandler}/>} redirect={false} >
          <FileInput onChange={this.fileHandler} source="uri" label="Planilla de Operacion" accept="application/vnd.ms-excel" validate={[required()]}>
            <FileField source="src" title="title" />
          </FileInput>
          {
            this.state.result ?
              <ResultadoDeCarga result={this.state.result}/>
              : null
          }
        </SimpleForm>
      </Create>
    );
  }
}