Proyectos de Subversion LeadersLinked - SPA

import React, { useEffect, useState } from "react";
import { axios } from "../../../../utils";
import { Modal } from "react-bootstrap";
import { useDispatch } from "react-redux";
import { addNotification } from "../../../../redux/notification/notification.actions";

import FormErrorFeedback from "../../../UI/FormErrorFeedback";

const SharePopup = ({ shareData, onClose, onError, show }) => {
  const [shareUrl, setShareUrl] = useState("");
  const [state, setState] = useState("pending");
  const dispatch = useDispatch();

  const getShareUrl = (url = "") => {
    axios
      .get(url)
      .then(({ data }) => {
        if (!data.success) {
          dispatch(addNotification({ style: "danger", msg: data.data }));
          return;
        }

        setShareUrl(data.data);
      })
      .catch((err) => {
        onError(err);
        throw new Error(err);
      });
  };

  const copyClicked = async () => {
    try {
      await navigator.clipboard.writeText(shareUrl || "");
      setState("success");
    } catch (err) {
      onError && onError(err);
      setState("error");
    }
  };

  const getButtonText = (state) => {
    switch (state) {
      case "success":
        return "URL Copiada al portapapeles";
      case "pending":
      default:
        return "Copiar URL";
    }
  };

  useEffect(() => {
    if (show) {
      getShareUrl(shareData?.url);
    }
  }, [shareData, show]);

  return (
    <Modal show={show} onHide={onClose} centered>
      <Modal.Header closeButton />
      <Modal.Body>
        {state === "error" ? (
          <FormErrorFeedback>
            No se pudo copiar al portapapeles, por favor copia la url
            manualmente para compartir.
          </FormErrorFeedback>
        ) : null}
        <input className="form-control" type="text" value={shareUrl} readOnly />
        <button className="btn btn-primary mt-3" onClick={copyClicked}>
          {getButtonText(state)}
        </button>
      </Modal.Body>
    </Modal>
  );
};

export default SharePopup;