/**
 * HeaderTab component
 *
 * Generated by coz on 2016-12-04,
 * from a template provided by apeman-asset-templates.
 *
 * @function HeaderTab
 */
'use strict'

import React from 'react'
import defineDebug from 'debug'
import {
  ApHeaderTab, ApHeaderTabItem
} from 'apeman-react-basic'

import { TabNames } from 'ore-fol-enums'
import { asPure, asLocaled, asServed, combine } from '../../wrappers'

const {
  THREAD_TAB,
  OTHER_TAB,
  TAG_TAB
} = TabNames

const debug = defineDebug('project:fragment:header-tab')

/** @lends HeaderTab */
const HeaderTab = ({
  l,
  srvc,
  tabHidden,
  selectedTab,
  onPop,
  onSelect
}) => {
  const { urlForThreads, urlForTags, urlForOthers } = srvc.urlService
  let isSelected = (tab) => selectedTab === tab
  let items = [
    [ l('tabs.THREAD_TAB'), urlForThreads(), THREAD_TAB ],
    [ l('tabs.TAG_TAB'), urlForTags(), TAG_TAB ],
    [ l('tabs.OTHER_TAB'), urlForOthers(), OTHER_TAB ]
  ]
  return tabHidden ? null : (
      <ApHeaderTab className='header-tab'>
        {
          items.map(([ label, url, tab ]) => {
            let selected = isSelected(tab)
            return (
              <ApHeaderTabItem key={ label }
                               href={ selected ? null : url }
                               onTap={ () => (selected ? onPop : onSelect)({ tab }) }
                               selected={ selected }
              >{ label }</ApHeaderTabItem>
            )
          })
        }
      </ApHeaderTab>
    )
}

export default combine(
  asPure(),
  asLocaled.proxy(),
  asServed.proxy()
)(HeaderTab)