/**
 * MyStars view
 *
 * Generated by coz on 2017-01-05,
 * from a template provided by apeman-asset-templates.
 *
 * @function MyStarsView
 */
'use strict'

import React, { Component, PropTypes as types } from 'react'
import defineDebug from 'debug'
import {
  ApView, ApViewHeader, ApViewBody,
  ApSection, ApSectionHeader, ApSectionBody
} from 'apeman-react-basic'
import {
  asView,
  asConnected,
  asLocaled,
  forSpin,
  asServed,
  forList,
  forLink,
  ofSigned,
  combine
} from '../../wrappers'
import { PostList } from '../../fragments'

import { IconClasses } from 'ore-fol-enums'

const debug = defineDebug('project:view:my-stars')
const { STAR_ICON } = IconClasses

/** @lends MyStarsView */
class MyStarsView extends Component {
  // --------------------
  // Specs
  // --------------------
  static get propTypes () {
    return {}
  }

  static get defaultProps () {
    return {}
  }

  render () {
    const s = this
    const {
      props,
      l
    } = s
    let {
      stargazedPosts
    } = props
    return (
      <ApView id='my-stars-view'
              className='view'
              spinning={ props.spinning }
              way={ props.way }
      >
        <ApViewHeader onLeftTap={ s.handlePop }
                      leftText={ null }
                      leftIcon={ props.popIcon }
                      titleText={ l('titles.MY_STARS') }
                      titleIcon={ STAR_ICON }
                      onRightTap={ null }
                      rightIcon={ null }
                      rightText={ null }
        />

        <ApViewBody>
          <div className='stars-content aside-wrap'>
            <MyStarsView.PostSection l={ l }
                                     posts={ stargazedPosts }
                                     onDetail={ s.handlePostDetail }
            />
          </div>
        </ApViewBody>
      </ApView>
    )
  }

  // --------------------
  // Lifecycle
  // --------------------

  componentWillMount () {
    debug('willMount')
    const s = this
  }

  componentDidMount () {
    debug('didMount')
    const s = this

    return Promise.all([
      s.loadPosts({})
    ])
  }

  componentWillUnmount () {
    debug('willUnmount')
    const s = this
  }

  // --------------------
  // Handlers
  // --------------------

  handleThreadDetail (thread) {
    const s = this
    const { urlForThread } = s.service('urlService')
    s.followLink(urlForThread(thread))
  }

  handlePostDetail (post) {
    const s = this
    const { urlForPost } = s.service('urlService')
    s.followLink(urlForPost(post))
  }

  // --------------------
  // Sub Components
  // --------------------

  static PostSection ({ l, caption, posts, onDetail, onMore }) {
    return (
      <ApSection>
        <ApSectionHeader lined>{ caption }</ApSectionHeader>
        <ApSectionBody>
          {
            posts ? (
                <PostList posts={ posts.entities }
                          onDetail={ onDetail }
                          alt={ l('alt.NO_STAR_POST_FOUND')}
                          hasMore={ false }
                          moreText={ l('buttons.SHOW_MORE') }
                          onMore={ onMore }
                          moreSpinning={ false }
                          wrap
                          simple
                />
              ) : (
                <div className='stars-loading'>{ l('messages.NOW_LOADING') }</div>
              )
          }
        </ApSectionBody>
      </ApSection>
    )
  }

  // --------------------
  // Custom
  // --------------------

  loadPosts () {
    const s = this
    const { use } = s.service('apiService')
    return use('postApi').then((postApi) =>
      s.applySpinWhile(() =>
        s.applyListLoad({
          stargazedPosts: () => postApi.listStargazed()
        })
      )
    )
  }

}

export default combine(
  asServed(),
  forSpin(),
  ofSigned(),
  forList(),
  forLink(),
  asLocaled(),
  asView(),
  asConnected()
)(MyStarsView)