import { Button, Dropdown } from "antd";
import { useState } from "react";
import { TemplateList } from "../../utils/TemplateConstants";
import { useTranslation } from "react-i18next";
import { GenerateDocument } from "../../utils/RenderTemplate";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { selectBodyshop } from "../../redux/user/user.selectors";
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
import { PrinterFilled } from "@ant-design/icons";

const ProdTemplates = TemplateList("production");
const { production_by_technician_one, production_by_category_one, production_by_repair_status_one } =
  TemplateList("special");

const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop
});
const mapDispatchToProps = () => ({
  //setUserLanguage: language => dispatch(setUserLanguage(language))
});
export default connect(mapStateToProps, mapDispatchToProps)(ProductionListPrint);

export function ProductionListPrint({ bodyshop }) {
  const { t } = useTranslation();
  const [loading, setLoading] = useState(false);
  const notification = useNotification();

  const menu = {
    items: [
      ...Object.keys(ProdTemplates).map((key) => {
        return {
          key: key,
          label: ProdTemplates[key].title,
          onClick: async () => {
            setLoading(true);
            await GenerateDocument(
              {
                name: ProdTemplates[key].key
                // variables: { id: contract.id },
              },
              {},
              "p",
              null,
              notification
            );
            setLoading(false);
          }
        };
      }),
      {
        label: t("reportcenter.templates.production_by_technician_one"),
        children: bodyshop.employees
          .filter((e) => e.active)
          .map((e) => {
            return {
              key: e.id,
              label: `${e.first_name} ${e.last_name}`,
              onClick: async () => {
                setLoading(true);
                await GenerateDocument(
                  {
                    name: production_by_technician_one.key,
                    variables: { id: e.id }
                  },
                  {},
                  "p",
                  null,
                  notification
                );
                setLoading(false);
              }
            };
          })
      },
      {
        label: t("reportcenter.templates.production_by_category_one"),
        children: bodyshop.md_categories.map((e) => {
          return {
            key: e,
            label: e,
            onClick: async () => {
              setLoading(true);
              await GenerateDocument(
                {
                  name: production_by_category_one.key,
                  variables: { category: e }
                },
                {},
                "p",
                null,
                notification
              );
              setLoading(false);
            }
          };
        })
      },
      {
        label: t("reportcenter.templates.production_by_repair_status_one"),
        children: bodyshop.md_ro_statuses.production_statuses.map((e) => {
          return {
            key: e,
            label: e,
            onClick: async () => {
              setLoading(true);
              await GenerateDocument(
                {
                  name: production_by_repair_status_one.key,
                  variables: { status: e }
                },
                {},
                "p",
                null,
                notification
              );
              setLoading(false);
            }
          };
        })
      }
    ]
  };

  return (
    <Dropdown trigger="click" menu={menu}>
      <Button icon={<PrinterFilled />} loading={loading}>
        {t("general.labels.print")}
      </Button>
    </Dropdown>
  );
}
