import React from 'react'
import PropTypes from 'prop-types'
import WidgetSettings from './WidgetSettingsContainer'
import SettingsChildWrapper from '../SettingsChildWrapperComponent'
import FullScreenProgress from 'general/FullScreenProgress'

class WidgetsSettings extends React.Component {
  constructor (props) {
    super(props)

    this.state = {
      userWidgets: null
    }
  }

  componentDidMount () {
    const { user } = this.props

    const userWidgets = {}
    var node

    for (var index in user.widgets.edges) {
      node = user.widgets.edges[index].node
      userWidgets[node.name] = node
    }

    this.setState({
      userWidgets: userWidgets
    })
  }

  render () {
    const { user, app, showError } = this.props

    // We need to wait for the
    // userWidgetsMap to be created before
    // mounting the WidgetSettings.
    if (!this.state.userWidgets) {
      return (<FullScreenProgress />)
    }

    const self = this
    return (
      <SettingsChildWrapper>
        <div style={{ paddingTop: 0 }} >
          {app.widgets.edges.map((edge, index) => {
            return (<WidgetSettings
              key={index}
              user={user}
              appWidget={edge.node}
              widget={self.state.userWidgets[edge.node.name]}
              showError={showError} />)
          })}
        </div>
      </SettingsChildWrapper>
    )
  }
}

WidgetsSettings.propTypes = {
  user: PropTypes.object.isRequired,
  app: PropTypes.object.isRequired,
  showError: PropTypes.func.isRequired
}

export default WidgetsSettings

import React from 'react'
import PropTypes from 'prop-types'
import WidgetSettings from './WidgetSettingsContainer'
import SettingsChildWrapper from '../SettingsChildWrapperComponent'
import FullScreenProgress from 'general/FullScreenProgress'

class WidgetsSettings extends React.Component {
  constructor (props) {
    super(props)

    this.state = {
      userWidgets: null
    }
  }

  componentDidMount () {
    const { user } = this.props

    const userWidgets = {}
    var node

    for (var index in user.widgets.edges) {
      node = user.widgets.edges[index].node
      userWidgets[node.name] = node
    }

    this.setState({
      userWidgets: userWidgets
    })
  }

  render () {
    const { user, app, showError } = this.props

    // We need to wait for the
    // userWidgetsMap to be created before
    // mounting the WidgetSettings.
    if (!this.state.userWidgets) {
      return (<FullScreenProgress />)
    }

    const self = this
    return (
      <SettingsChildWrapper>
        <div style={{ paddingTop: 0 }} >
          {app.widgets.edges.map((edge, index) => {
            return (<WidgetSettings
              key={index}
              user={user}
              appWidget={edge.node}
              widget={self.state.userWidgets[edge.node.name] || null}
              showError={showError} />)
          })}
        </div>
      </SettingsChildWrapper>
    )
  }
}

WidgetsSettings.propTypes = {
  user: PropTypes.object.isRequired,
  app: PropTypes.object.isRequired,
  showError: PropTypes.func.isRequired
}

export default WidgetsSettings

Allow a user’s widget data to be null on the settings page.