{"size": 1433, "ext": "js", "max_stars_repo_path": "client/src/components/chat/ChatInterface/utils/AttachementInput.js", "max_stars_repo_name": "sarvagya2545/chat-app-react", "max_stars_repo_stars_event_min_datetime": "2021-03-16T06:30:40.000Z", "max_stars_repo_stars_event_max_datetime": "2021-11-16T11:34:41.000Z", "max_issues_repo_path": "client/src/components/chat/ChatInterface/utils/AttachementInput.js", "max_issues_repo_name": "sarvagya2545/chat-app-react", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "client/src/components/chat/ChatInterface/utils/AttachementInput.js", "max_forks_repo_name": "sarvagya2545/chat-app-react", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 6, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 24.7068965517, "max_line_length": 134, "alphanum_fraction": 0.5589672017}
import React, { Component } from 'react';
import file from '../../../../images/document.svg';
import image from '../../../../images/image.svg';
import cx from 'classnames';
import { addFiles } from '../../../../redux/actions/fileActions';
import { connect } from 'react-redux';

class AttachmentInput extends Component {
  input = React.createRef();
  
  openFileChooser = e => {
    this.input.click();
  }
  
  onFileChange = e => {
    // console.log(e.target.files);
    this.props.addFiles(e.target.files, this.props.currentChatRoom);
  }

  render() {
    let src;
    switch(this.props.ui) {
      case "img":
        src = image;
        break;
      default:
        src = file;
    }


    return (
      <>
        <div 
          className={cx("attachment", { "attachment-file": this.props.ui === "file" }, { "attachment-img": this.props.ui === "img" })}
          onClick={this.openFileChooser}
        >
          <img src={src} alt="file-icon" className="file-icon"/>
        </div>
        <input 
            type="file" 
            accept={this.props.accept} 
            ref={input => this.input = input} 
            className="file-input"
            onChange={this.onFileChange}
            multiple
        />
      </>
    );
  }
}
 
const mapStateToProps = (state) => {
  return {
    currentChatRoom: state.chat.currentChatRoom
  }
}

export default connect(mapStateToProps, { addFiles })(AttachmentInput);