<commit_before>View.ListDetail.Main = React.createClass
  getDefaultProps: ->
    data: {}

  getInitialState: ->
    clipboard: @_setupClipboard()
    list: @props.data.list
    items: @props.data.items
    editingItem: {}
    displayItemForm: false
    message: ''
    type: ''

  componentWillMount: ->
    ReactStore.ListDetailStore.initialize(@state, @_onStoreDataChanged)

  componentWillUnmount: ->
    @state.clipboard.destroy()

  render: ->
    R.article
      className: 'list-detail'
      style: Styles.ListDetail.Page
      @_renderPageHeader()
      @_renderAddItemBtn()
      @_renderBody()
      @_renderNotification()
      @_renderItemForm() if @state.displayItemForm

  _renderPageHeader: ->
    React.createElement View.Common.PageHeader,
      title: @state.list.title

  _renderAddItemBtn: ->
    React.createElement FloatingActionButton,
      style: Styles.FloatingAddBtn
      iconStyle: Styles.FloatingAddBtnIcon
      onTouchTap: @_handleClickAddItemBtn
      '+'

  _renderBody: ->
    React.createElement View.ListDetail.ItemsContainer,
      items: @state.items

  _renderNotification: ->
    React.createElement View.Notification,
      message: @state.message
      type: @state.type

  _setupClipboard: ->
    clipboard = new Clipboard '.item',
      text: (trigger) ->
        $(trigger).find('.item__content').text()

    clipboard.on 'success', (event) =>
      @_displayCopiedSuccessMessage()

    clipboard.on 'error', (event) =>
      @_displayCopiedFailedMessage()

    clipboard

  _displayCopiedSuccessMessage: ->
    @setState
      message: 'Copied!'
      type: 'success'

  _displayCopiedFailedMessage: ->
    @setState
      message: 'Cannot copy with Safari. Please press Ctrl + C to copy!'
      type: 'fail'

  _renderItemForm: ->
    React.createElement View.ItemForm,
      item: @state.editingItem

  _onStoreDataChanged: ->
    @setState(ReactStore.ListDetailStore.getAllData())

  _handleClickAddItemBtn: (event) ->
    ReactAction.ListDetailAction.showItemFormFor({})<commit_msg>Make number of columns to display be responsive<commit_after>View.ListDetail.Main = React.createClass
  getDefaultProps: ->
    data: {}

  getInitialState: ->
    clipboard: @_setupClipboard()
    list: @props.data.list
    items: @props.data.items
    editingItem: {}
    displayItemForm: false
    message: ''
    type: ''

  componentWillMount: ->
    ReactStore.ListDetailStore.initialize(@state, @_onStoreDataChanged)

  componentWillUnmount: ->
    @state.clipboard.destroy()

  render: ->
    R.article
      className: 'list-detail'
      style: Styles.ListDetail.Page
      @_renderPageHeader()
      @_renderAddItemBtn()
      @_renderBody()
      @_renderNotification()
      @_renderItemForm() if @state.displayItemForm

  _renderPageHeader: ->
    React.createElement View.Common.PageHeader,
      title: @state.list.title

  _renderAddItemBtn: ->
    React.createElement FloatingActionButton,
      style: Styles.FloatingAddBtn
      iconStyle: Styles.FloatingAddBtnIcon
      onTouchTap: @_handleClickAddItemBtn
      '+'

  _renderBody: ->
    React.createElement View.ListDetail.ItemsContainer,
      items: @state.items
      numberOfColumns: @_getNumberOfColumnsToDisplay()

  _renderNotification: ->
    React.createElement View.Notification,
      message: @state.message
      type: @state.type

  _setupClipboard: ->
    clipboard = new Clipboard '.item',
      text: (trigger) ->
        $(trigger).find('.item__content').text()

    clipboard.on 'success', (event) =>
      @_displayCopiedSuccessMessage()

    clipboard.on 'error', (event) =>
      @_displayCopiedFailedMessage()

    clipboard

  _displayCopiedSuccessMessage: ->
    @setState
      message: 'Copied!'
      type: 'success'

  _displayCopiedFailedMessage: ->
    @setState
      message: 'Cannot copy with Safari. Please press Ctrl + C to copy!'
      type: 'fail'

  _renderItemForm: ->
    React.createElement View.ItemForm,
      item: @state.editingItem

  _onStoreDataChanged: ->
    @setState(ReactStore.ListDetailStore.getAllData())

  _handleClickAddItemBtn: (event) ->
    ReactAction.ListDetailAction.showItemFormFor({})

  _getNumberOfColumnsToDisplay: ->
    width = $(window).width()
    if width <= 414
      1
    else if width < 600
      2
    else
      3
{'fraction_non_alphanumeric': 0.11175650557620818, 'fraction_numerical': 0.002091078066914498, 'mean_word_length': 3.1354466858789625, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 40, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1887898', 'n_tokens_mistral': 1326, 'n_tokens_neox': 1303, 'n_words': 240}