import { Collapse, Form, Switch } from "antd";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import LayoutFormRow from "../layout-form-row/layout-form-row.component";

const mapStateToProps = createStructuredSelector({});

export function JobsDetailRatesOther({ expanded }) {
  const { t } = useTranslation();

  return (
    <Collapse
      defaultActiveKey={expanded && "rates"}
      items={[
        {
          key: "cieca_pfo",
          label: t("jobs.labels.cieca_pfo"),
          forceRender: true,
          children: (
            <>
              <LayoutFormRow noDivider>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.tow_t_in1")}
                  name={["cieca_pfo", "tow_t_in1"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.tow_t_in2")}
                  name={["cieca_pfo", "tow_t_in2"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.tow_t_in3")}
                  name={["cieca_pfo", "tow_t_in3"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.tow_t_in4")}
                  name={["cieca_pfo", "tow_t_in4"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.tow_t_in5")}
                  name={["cieca_pfo", "tow_t_in5"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>

                <Form.Item
                  label={t("jobs.fields.cieca_pfo.stor_t_in1")}
                  name={["cieca_pfo", "stor_t_in1"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.stor_t_in2")}
                  name={["cieca_pfo", "stor_t_in2"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.stor_t_in3")}
                  name={["cieca_pfo", "stor_t_in3"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.stor_t_in4")}
                  name={["cieca_pfo", "stor_t_in4"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
                <Form.Item
                  label={t("jobs.fields.cieca_pfo.stor_t_in5")}
                  name={["cieca_pfo", "stor_t_in5"]}
                  valuePropName="checked"
                >
                  <Switch />
                </Form.Item>
              </LayoutFormRow>
            </>
          )
        }
      ]}
    />
  );
}

export default connect(mapStateToProps, null)(JobsDetailRatesOther);
