File upload example in cloudinary

Fileupload.js

import Firebase from 'firebase';
import React from 'react';
import Config from '../../config/config';
import Uploader from '../edit/Uploader';
import { Status } from 'uxcore-uploadcore';
import Safename from 'sanitize-filename';

class FileUploader extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      uploadConf: {}
    };
  }

  componentWillMount() {
    this.fileRef = new Firebase(Config.firebase.baseUrl + 'files/').push();
    this.uploadConf();
  }

  uploadConf(){
    this.setState({
      uploadConf : {
        request: {
          name: 'file',
          url: this.props.cloudinary.urlRaw,
          params: {
            upload_preset: this.props.cloudinary.preset,
            tags: [this.props.assetId]
          },
          chunkEnable: true,
          chunkSize: 20000000,
          chunk_size: 20000000,
          chunkProcessThreads: 1
        }
      }
    });
  }

  recordFile(file){
    let _file = {
      filename : this.fileName,
      extension : this.fileExtension,
      size : this.fileSize,
      type : this.fileType,
      assetId : this.props.assetId,
      url: file.secure_url,
      cloudId: file.public_id,
      createdAt : Date.now()
    };

    return new Promise((resolve, reject) => {
      this.fileRef.set(_file, (err) => {
        if(err){
          reject(err);
        }
        else{
          resolve({
            key: this.fileRef.key(),
            data: _file
          });
        }
      });
    });
  }

  uploadComplete(file) {
    if (file.getStatus() === Status.SUCCESS) {
      this.recordFile(file.response.getJson())
      .then((file)=>{
        return this.props.uploadComplete(file.key, file.data);
      });
    } else {
      this.props.uploadError('An error occured while uploading the file please try again later');
    }
  }

  fileValidation(file) {
    let _filename = file.name.toLowerCase();
    let fileExtension = _filename.substr( _filename.lastIndexOf('.') + 1 );
    _filename = _filename.substring(0, _filename.lastIndexOf('.'));
    let fileAllowed = false;
    Object.keys(Config.allowedFileTypes).forEach( (fileType) => {
      if ( Config.allowedFileTypes[fileType].indexOf( fileExtension ) !== -1 ){
        fileAllowed = true;
        this.fileName = Safename(_filename).replace(/\s/g,'_');
        this.fileType = fileType;
        this.fileSize = file.size;
        this.fileExtension = fileExtension;
      }
    });
    return fileAllowed;
  }

  uploadPreparing(request) {
    let fileAllowed = this.fileValidation(request);
    let response = {};
    response.params = [];
    if(fileAllowed){
      response.status = 'OK';
    }
    else {
      response.status = 'KO';
    }

    response.params.push({
      key: 'public_id',
      value: `${this.props.cloudinary.baseFolder}/${this.props.asset.uuid}/${request.name}`
    });

    if(this.fileType === 'bitmap' || this.fileType === 'vector') {
      response.url = this.props.cloudinary.urlImageChunked;
    }

    return response;
  }

  render() {
    return (
      <Uploader
        uploadPreparing={this.uploadPreparing.bind(this)}
        uploadProgress={this.props.uploadProgress}
        uploadComplete={this.uploadComplete.bind(this)}
        uploadError={this.props.uploadError}
        uploadConf={this.state.uploadConf}
      >
          {this.props.children}
      </Uploader>
    );
  }
}

export default FileUploader;