import Iconfont from "../../../../iconfont";
import React, { useEffect, useMemo } from 'react';
import { getServiceTime } from "../../../utils";
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import 'dayjs/locale/en';
import 'dayjs/locale/zh-tw';
import 'dayjs/locale/ja';
import 'dayjs/locale/pt';
import "./index.less";
import { PREFIX } from "../../index";
var localeTypes = {
  'en-US': 'en',
  'zh-CN': 'zh-cn',
  'zh-HK': 'zh-tw',
  'ja': 'ja',
  'pt': 'pt'
};
var TimeRange = function TimeRange(props) {
  var _props$dataSource = props.dataSource,
    dataSource = _props$dataSource === void 0 ? {} : _props$dataSource;
  var start_date = dataSource.start_date,
    end_date = dataSource.end_date,
    _dataSource$locale = dataSource.locale,
    locale = _dataSource$locale === void 0 ? 'en-US' : _dataSource$locale;
  if (!start_date || !end_date) return null;
  if (!dayjs(start_date).isValid() || !dayjs(end_date).isValid()) return null;
  useEffect(function () {
    dayjs.locale(localeTypes[locale]);
  }, [locale]);
  var isEn = useMemo(function () {
    return locale === 'en-US' || locale === 'en';
  }, [locale]);
  var _format = useMemo(function () {
    return isEn ? 'HH:mm DD/MM/YYYY' : 'YYYY-MM-DD HH:mm';
  }, [isEn]);
  var renderTimeItem = function renderTimeItem(time) {
    return /*#__PURE__*/React.createElement("div", {
      className: "time-range-item"
    }, /*#__PURE__*/React.createElement(Iconfont, {
      className: "time-icon",
      type: "pisell2-clock"
    }), /*#__PURE__*/React.createElement("span", {
      className: "time-str"
    }, dayjs(time).format(_format)));
  };
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: "".concat(PREFIX, "__time-range")
  }, /*#__PURE__*/React.createElement(Iconfont, {
    className: "time-icon",
    type: "pisell2-clock"
  }), getServiceTime(dataSource, start_date)));
};
export default TimeRange;