import { Space } from "antd";
import React, { useMemo } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectScheduleLoad } from "../../redux/application/application.selectors";
const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
  scheduleLoad: selectScheduleLoad,
});
const mapDispatchToProps = (dispatch) => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});

export function ScheduleAtsSummary({ scheduleLoad, appointments }) {
  const { t } = useTranslation();

  const atsSummary = useMemo(() => {
    let atsSummary = {};
    if (!appointments || appointments.length === 0) {
      return {};
    }
    appointments
      .filter((a) => a.isintake)
      .forEach((a) => {
        if (!a.job.alt_transport) return;
        if (!atsSummary[a.job.alt_transport]) {
          atsSummary[a.job.alt_transport] = 1;
        } else {
          atsSummary[a.job.alt_transport] = atsSummary[a.job.alt_transport] + 1;
        }
      });
    return atsSummary;
  }, [appointments]);

  if (Object.keys(atsSummary).length > 0)
    return (
      <Space wrap>
        {t("schedule.labels.atssummary")}
        {Object.keys(atsSummary).map((key) => (
          <span key={key}>{`${key}: ${atsSummary[key]}`}</span>
        ))}
      </Space>
    );

  return null;
}
export default connect(mapStateToProps, mapDispatchToProps)(ScheduleAtsSummary);