{"size": 3741, "ext": "js", "max_stars_repo_path": "src/js/pages/objects.js", "max_stars_repo_name": "Falsen/ipfs-webui", "max_stars_repo_stars_event_min_datetime": "2018-07-04T21:29:54.000Z", "max_stars_repo_stars_event_max_datetime": "2018-07-04T22:21:52.000Z", "max_issues_repo_path": "src/js/pages/objects.js", "max_issues_repo_name": "Falsen/ipfs-webui", "max_issues_repo_issues_event_min_datetime": "2021-10-31T13:28:14.000Z", "max_issues_repo_issues_event_max_datetime": "2021-10-31T13:28:14.000Z", "max_forks_repo_path": "src/js/pages/objects.js", "max_forks_repo_name": "Falsen/ipfs-webui", "max_forks_repo_forks_event_min_datetime": "2021-10-31T11:52:02.000Z", "max_forks_repo_forks_event_max_datetime": "2021-10-31T11:52:02.000Z"}
{"max_stars_count": 6, "max_issues_count": 1, "max_forks_count": 1, "avg_line_length": 26.9136690647, "max_line_length": 93, "alphanum_fraction": 0.562149158}
import React from 'react'
import PropTypes from 'prop-types'
import ObjectView from '../views/object'
import {parse} from '../utils/path'
import {join} from 'path'
import i18n from '../utils/i18n'
import {Row, Col, Button} from 'react-bootstrap'
import {withIpfs} from '../components/ipfs'

class Objects extends React.Component {
  constructor (props) {
    super(props)
    const {match, ipfs} = props
    this.state = this._getStateFromRoute(match.params, ipfs)
  }

  _getStateFromRoute = (params, ipfs) => {
    let state = {}
    if (params[0]) {
      const path = parse(join('/', params[0]))
      state.path = path
      this._getObject(ipfs, state.path)
      state.pathInput = path.toString()
    }
    // reset between reloads
    return state
  }

  _updateState = () => {
    const {match, ipfs} = this.props
    this.setState(this._getStateFromRoute(match.params, ipfs))
  };

  _getObject = (ipfs, path) => {
    const p = path.toString().replace(/^\/ipfs\//, '')
    ipfs.object.get(p).then((object) => {
      this.setState({ permalink: null, object: object })

      if (path.protocol === 'ipns') {
        // also resolve the name
        return ipfs.name.resolve(path.name).then((resolved) => {
          const permalink = parse(resolved.path).append(path.path)
          this.setState({ permalink: permalink })
        })
      }
    }).catch((error) => this.setState({error}))
  };

  _update = (event) => {
    if (event.which && event.which !== 13) {
      return
    }
    const params = this.props.match.params
    params.path = parse(this.state.pathInput).urlify()

    let route = '/objects'
    if (params.path) {
      route += params.path
    }

    if ('#' + route !== window.location.hash) {
      this.context.router.history.push(route)
    }
  }

  componentDidMount () {
    this.mounted = true
    window.addEventListener('hashchange', this._updateState)
  }

  componentWillUnmount () {
    this.mounted = false
    window.removeEventListener('hashchange', this._updateState)
  }

  render () {
    const error = this.state.error ? (<div className='row'>
      <h4>{i18n.t('Error')}</h4>
      <div className='panel panel-default padded'>
        {this.state.error}
      </div>
    </div>) : null

    // TODO add provider-view here
    const views = (!error && this.state.object ? <div className='row'>
      <div className='col-xs-12'>
        <ObjectView
          object={this.state.object}
          path={this.state.path}
          permalink={this.state.permalink}
          gateway={this.props.gateway} />
      </div>
    </div> : null)

    return (
      <Row>
        <Col sm={10} smOffset={1} className={'webui-dag'}>
          <Row>
            <h4>{i18n.t('Enter a hash')}</h4>
            <Row className='path'>
              <Col xs={10}>
                <input
                  type='text'
                  className='form-control input-lg'
                  onChange={(event) => this.setState({pathInput: event.target.value.trim()})}
                  onKeyPress={this._update}
                  value={this.state.pathInput}
                  placeholder={i18n.t('Enter a hash: QmS4ustL54u...')} />
              </Col>
              <Col xs={2}>
                <Button bsStyle={'primary'} className={'go'}
                  onClick={this._update}>
                  {i18n.t('GO')}
                </Button>
              </Col>
            </Row>
          </Row>
          {error}
          {views}
        </Col>
      </Row>
    )
  }
}

Objects.displayName = 'Objects'

Objects.contextTypes = {
  router: PropTypes.object.isRequired
}

Objects.propTypes = {
  gateway: PropTypes.string,
  match: PropTypes.object,
  ipfs: PropTypes.object
}

export default withIpfs(Objects)
