Rev 355 | Rev 357 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { useEffect, useState } from "react";import { Modal } from "react-bootstrap";import { useDispatch } from "react-redux";import { addNotification } from "../../../../redux/notification/notification.actions";import parse from "html-react-parser";import Input from "../../../UI/Input";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 = async (url = "") => {await axios.get(url).then(({ data }) => {if (!data.success) {dispatch(addNotification({ style: "danger", msg: data.data }));throw new Error(err);}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(() => {getShareUrl(shareData.url);}, [shareData]);return (<Modal show={show} onHide={onClose} centered><Modal.Header closeButton /><Modal.Body>{parse(shareData.title)}{state === "error" ? (<FormErrorFeedback>No se pudo copiar al portapapeles, por favor copia la urlmanualmente para compartir.</FormErrorFeedback>) : null}<Input value={shareUrl} readOnly /><button className="btn btn-primary" onClick={copyClicked}>{getButtonText(state)}</button></Modal.Body></Modal>);};export default SharePopup;