import React from "react";
import { useSelector } from "react-redux";
import PropTypes from "prop-types";
import { Typography } from "@mui/material";
import { makeStyles } from "@mui/styles";
import useTranslation from "../../utils/useTranslation";
import PermalinkInput from "../PermalinkInput";
import DrawEditLinkInput from "../DrawEditLinkInput";
import PermalinkButton from "../PermalinkButton";
const useStyles = makeStyles(theme => ({
  margin: {
    marginTop: theme.spacing(2)
  }
}));
function DrawPermalinkButton(_ref) {
  let {
    buttonProps
  } = _ref;
  const classes = useStyles();
  const drawIds = useSelector(state => state.app.drawIds);
  const {
    t
  } = useTranslation();
  return /*#__PURE__*/React.createElement(PermalinkButton, {
    buttonProps: buttonProps || {}
  }, locationHref => {
    return /*#__PURE__*/React.createElement(React.Fragment, null, drawIds && drawIds.file_id && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Typography, {
      variant: "h4",
      gutterBottom: true
    }, "".concat(t("Link zum Teilen"), ": ")), /*#__PURE__*/React.createElement(PermalinkInput, {
      value: drawIds.admin_id ? locationHref.replace(drawIds.admin_id, drawIds.file_id) : locationHref
    })), drawIds && drawIds.admin_id && /*#__PURE__*/React.createElement("div", {
      className: classes.margin
    }, /*#__PURE__*/React.createElement(Typography, {
      variant: "h4",
      gutterBottom: true
    }, "".concat(t("Link zum Editieren"), ": ")), /*#__PURE__*/React.createElement(Typography, {
      gutterBottom: true
    }, t("Damit sie ihre Zeichnung erneut bearbeiten können, müssen sie diesen Link speichern.")), /*#__PURE__*/React.createElement(DrawEditLinkInput, null)));
  });
}
DrawPermalinkButton.propTypes = {
  buttonProps: PropTypes.object
};
export default /*#__PURE__*/React.memo(DrawPermalinkButton);
//# sourceMappingURL=DrawPermalinkButton.js.map