Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 355 | Rev 357 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 355 Rev 356
Línea 1... Línea 1...
1 
import React, { useEffect, useRef, useState } from "react";
 1 
import React, { useEffect, useState } from "react";
- 
 
 2 
import { Modal } from "react-bootstrap";
- 
 
 3 
import { useDispatch } from "react-redux";
- 
 
 4 
import { addNotification } from "../../../../redux/notification/notification.actions";
2 
import parse from "html-react-parser";
 5 
import parse from "html-react-parser";
3 
import useOutsideClick from "../../../../hooks/useOutsideClick";
 - 
 
Línea 4... Línea 6...
4 
 
 6 
 
- 
 
 7 
import Input from "../../../UI/Input";
Línea 5... Línea 8...
5 
import styles from "./MobileSharePopUp.module.scss";
 8 
import FormErrorFeedback from "../../../UI/FormErrorFeedback";
6 
 
 9 
 
7 
const SharePopup = ({ shareData, onClose, onError }) => {
 10 
const SharePopup = ({ shareData, onClose, onError, show }) => {
8 
  const [shareUrl, setShareUrl] = useState("");
 11 
  const [shareUrl, setShareUrl] = useState("");
9 
  const [state, setState] = useState("pending");
 - 
 
Línea 10... Línea 12...
10 
  const popUp = useRef(null);
 12 
  const [state, setState] = useState("pending");
11 
  useOutsideClick(popUp, () => onClose());
 13 
  const dispatch = useDispatch();
12 
 
 14 
 
13 
  const getShareUrl = async (url = "") => {
 15 
  const getShareUrl = async (url = "") => {
14 
    await axios
 16 
    await axios
15 
      .get(url)
 17 
      .get(url)
16 
      .then(({ data }) => {
 18 
      .then(({ data }) => {
17 
        if (!data.success) {
 19 
        if (!data.success) {
Línea 18... Línea 20...
18 
          dispatch(addNotification({ style: "danger", msg: data.data }));
 20 
          dispatch(addNotification({ style: "danger", msg: data.data }));
19 
          return;
 21 
          throw new Error(err);
20 
        }
 22 
        }
Línea 38... Línea 40...
38 
  };
 40 
  };
Línea 39... Línea 41...
39 
 
 41 
 
40 
  const getButtonText = (state) => {
 42 
  const getButtonText = (state) => {
41 
    switch (state) {
 43 
    switch (state) {
42 
      case "success":
 44 
      case "success":
43 
        return "Link copied";
 45 
        return "URL Copiada al portapapeles";
44 
      case "pending":
 46 
      case "pending":
45 
      default:
 47 
      default:
46 
        return "Copy link";
 48 
        return "Copiar URL";
47 
    }
 49 
    }
Línea 48... Línea 50...
48 
  };
 50 
  };
49 
 
 51 
 
50 
  useEffect(() => {
 52 
  useEffect(() => {
Línea 51... Línea 53...
51 
    getShareUrl(shareData.url);
 53 
    getShareUrl(shareData.url);
52 
  }, [shareData]);
 54 
  }, [shareData]);
- 
 
 55 
 
- 
 
 56 
  return (
53 
 
 57 
    <Modal show={show} onHide={onClose} centered>
54 
  return (
 58 
      <Modal.Header closeButton />
55 
    <div className={styles.share__popup} ref={popUp}>
 59 
      <Modal.Body>
56 
      {parse(shareData.title)}
 60 
        {parse(shareData.title)}
- 
 
 61 
        {state === "error" ? (
57 
      {state === "error" ? (
 62 
          <FormErrorFeedback>
58 
        <p className={styles.copy__error}>
 63 
            No se pudo copiar al portapapeles, por favor copia la url
59 
          Unable to copy to clipboard, please manually copy the url to share.
 64 
            manualmente para compartir.
60 
        </p>
 65 
          </FormErrorFeedback>
61 
      ) : null}
 66 
        ) : null}
62 
      <input value={shareUrl} readOnly />
 67 
        <Input value={shareUrl} readOnly />
- 
 
 68 
        <button className="btn btn-primary" onClick={copyClicked}>
63 
      <button className="btn btn-primary" onClick={copyClicked}>
 69 
          {getButtonText(state)}
64 
        {getButtonText(state)}
 70 
        </button>
65 
      </button>
 71 
      </Modal.Body>
Línea 66... Línea 72...
66 
    </div>
 72 
    </Modal>