 React = require 'react'
 Translate = require 'react-translate-component'
 apiClient = require '../../api/client'
-PromiseRenderer = require '../../components/promise-renderer'
+Loading = require '../../components/loading-indicator'
 
 counterpart.registerTranslations 'en',
   publications:

    currentSort: 'showAll'

  componentDidMount: ->
    document.documentElement.classList.add 'on-secondary-page'

  componentWillUnmount: ->
    document.documentElement.classList.remove 'on-secondary-page'

  render: ->
    sideBarNav = counterpart "publications.nav"

            else
              @state.currentSort
        }</h2>
        {if @state.projects
          for category, projects of publicationCategories
            if (@state.currentSort is category) or (@state.currentSort is 'showAll')
              <ul key={category} className="publications-list">
                {for projectListing in projects
                  project = @state.projects[projectListing.slug]
                  <div key={projectListing.name or project.slug}>
                    <div>
                      <h3 className="project-name">
                        {if project then project.display_name else projectListing.name}
                      </h3>
                      <span className="publication-count">{' '}({projectListing.publications.length})</span>
                    </div>
                    {projectListing.publications.map (publication) =>
                      i = Math.random()
                      <li key="publication-#{i}" className="publication-item">
                        {@avatarFor(project)}
                        <div className="citation">
                          <p>
                            <cite>{publication.citation}</cite><br />
                            {if publication.href? then <a href={publication.href} target="_blank">Available here.</a>}
                          </p>
                        </div>
                      </li>}
                  </div>
              }</ul>
        else
          <Loading />}
      </section>
    </div>

  showPublicationsList: (navItem) ->
    @setState currentSort: navItem

  avatarFor: (project) ->
    src = if project?.avatar_src
      "//#{ project.avatar_src }"
    else
      '/assets/simple-avatar.jpg'
    <img src={src} alt="Project Avatar" />
