import { useMutation } from "@apollo/client/react";
import { Button, Form, Popover, Tooltip } from "antd";
import axios from "axios";
import { t } from "i18next";
import { useState } from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { UPDATE_LINE_PPC } from "../../graphql/jobs-lines.queries";
import { selectTechnician } from "../../redux/tech/tech.selectors";
import CurrencyFormatter from "../../utils/CurrencyFormatter";
import InstanceRenderManager from "../../utils/instanceRenderMgr";
import CurrencyFormItemComponent from "../form-items-formatted/currency-form-item.component";
import JobLineConvertToLabor from "../job-line-convert-to-labor/job-line-convert-to-labor.component";
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
import { selectIsPartsEntry } from "../../redux/application/application.selectors.js";

const mapStateToProps = createStructuredSelector({
  technician: selectTechnician,
  isPartsEntry: selectIsPartsEntry
});
const mapDispatchToProps = () => ({});

export function JobLinesPartPriceChange({ job, line, refetch, technician, isPartsEntry }) {
  const [loading, setLoading] = useState(false);
  const [updatePartPrice] = useMutation(UPDATE_LINE_PPC);
  const notification = useNotification();

  const handleFinish = async (values) => {
    try {
      setLoading(true);
      const result = await updatePartPrice({
        variables: {
          id: line.id,
          jobline: {
            act_price_before_ppc: line.act_price_before_ppc ? line.act_price_before_ppc : line.act_price,
            act_price: values.act_price
          }
        }
      });
      await axios.post("/job/totalsssu", {
        id: job.id
      });
      if (result.errors) {
        notification.error({
          title: t("joblines.errors.saving", {
            error: JSON.stringify(result.errors)
          })
        });
        if (refetch) refetch();
      } else {
        notification.success({
          title: t("joblines.successes.saved")
        });
      }
    } catch (error) {
      notification.error({
        title: t("joblines.errors.saving", { error: JSON.stringify(error) })
      });
    } finally {
      setLoading(false);
    }
  };

  const popcontent =
    !technician &&
    !isPartsEntry &&
    InstanceRenderManager({
      imex: null,
      rome: (
        <Form layout="vertical" onFinish={handleFinish} initialValues={{ act_price: line.act_price }}>
          <Form.Item name="act_price" label={t("jobs.labels.act_price_ppc")} rules={[{ required: true }]}>
            <CurrencyFormItemComponent />
          </Form.Item>
          <Button disabled={InstanceRenderManager({ imex: true, rome: false })} loading={loading} htmlType="primary">
            {t("general.actions.save")}
          </Button>
        </Form>
      )
    });

  return (
    <JobLineConvertToLabor jobline={line} job={job}>
      {/* eslint-disable-next-line no-constant-binary-expression */}
      <Popover trigger="click" disabled={true || line.manual_line} content={popcontent}>
        <CurrencyFormatter>
          {line.db_ref === "900510" || line.db_ref === "900511" ? line.prt_dsmk_m : line.act_price}
        </CurrencyFormatter>
        {line.prt_dsmk_p && line.prt_dsmk_p !== 0 ? (
          <span style={{ marginLeft: ".2rem" }}>{`(${line.prt_dsmk_p}%)`}</span>
        ) : (
          <></>
        )}
        {line.act_price_before_ppc && line.act_price_before_ppc !== 0 ? (
          <Tooltip title={t("jobs.labels.ppc")}>
            <span style={{ marginLeft: ".2rem", color: "tomato" }}>
              (<CurrencyFormatter>{line.act_price_before_ppc}</CurrencyFormatter>)
            </span>
          </Tooltip>
        ) : (
          <></>
        )}
      </Popover>
    </JobLineConvertToLabor>
  );
}

export default connect(mapStateToProps, mapDispatchToProps)(JobLinesPartPriceChange);
