// withHooks
// noPage
import esp from 'esoftplay/esp';

import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';

import React from 'react';
import { View } from 'react-native';


export interface MarketProgress_barArgs {

}
export interface MarketProgress_barProps {
  barWidth: number,
  barCount: number,
  progressCount: number,
  barColor?: string,
  progressColor?: string,
  leftToRight?: boolean
}

export function labelProgress(stock: number, buy: number) {
  let teks = ''
  const percen = Math.round((buy / stock) * 100)
  if (percen < 50) {
    teks = esp.lang("market/progress_bar", "ready")
  } else if (percen >= 50 && percen < 90) {
    teks = esp.lang("market/progress_bar", "hot")
  } else if (percen >= 90 && percen < 100) {
    teks = esp.lang("market/progress_bar", "run_out")
  } else {
    teks = esp.lang("market/progress_bar", "sold_out")
  }
  return teks
}

export default function m(props: MarketProgress_barProps): any {
  let progressWidth = (props.progressCount / props.barCount * props.barWidth) || 0
  if (progressWidth > props.barWidth) {
    progressWidth = props.barWidth
  }
  return (
    <View style={{ marginTop: 8, backgroundColor: props.barColor || '#f5f5f5', borderRadius: 3, height: 6, width: props.barWidth || 0, flexDirection: 'row', alignContent: 'center', alignItems: 'center' }} >
      <View style={{ backgroundColor: props.progressColor || '#EC4E2C', borderRadius: 3, height: 6, width: progressWidth }} />
      {
        progressWidth < props.barWidth ?
          <View style={{ marginLeft: progressWidth == 0 ? -5 : -10, marginBottom: 10 }}>
            <LibIcon name="fire" color={LibStyle.colorRed} />
          </View>
          :
          props.leftToRight && progressWidth == props.barWidth ?
            <View style={{ marginLeft: -15, marginBottom: 10 }}>
              <LibIcon name="fire" color={LibStyle.colorRed} />
            </View>
            :
            <View />

      }
    </View>
  )
}