Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 349 Rev 352
Línea 1... Línea 1...
1 
import React, { useState } from "react";
 1 
import React, { useEffect, useRef, useState } from "react";
- 
 
 2 
import parse from "html-react-parser";
- 
 
 3 
import useOutsideClick from "../../../../hooks/useOutsideClick";
Línea 2... Línea 4...
2 
 
 4 
 
Línea 3... Línea 5...
3 
import styles from "./MobileSharePopUp.module.scss";
 5 
import styles from "./MobileSharePopUp.module.scss";
- 
 
 6 
 
4 
 
 7 
const SharePopup = ({ shareData, onClose, onError }) => {
- 
 
 8 
  const [shareUrl, setShareUrl] = useState("");
- 
 
 9 
  const [state, setState] = useState("pending");
Línea 5... Línea 10...
5 
const SharePopup = ({ shareData, onClose, onError }) => {
 10 
  const popUp = useRef(null);
6 
  const [state, setState] = useState("pending");
 11 
  useOutsideClick(popUp, onClose);
7 
 
 12 
 
8 
  const getShareUrl = async (url = "") => {
 13 
  const getShareUrl = async (url = "") => {
9 
    await axios
 14 
    await axios
10 
      .get(url)
 15 
      .get(url)
11 
      .then(({ data }) => {
 16 
      .then(({ data }) => {
12 
        if (!data.success) {
 17 
        if (!data.success) {
Línea 13... Línea 18...
13 
          dispatch(addNotification({ style: "danger", msg: data.data }));
 18 
          dispatch(addNotification({ style: "danger", msg: data.data }));
14 
          return;
 19 
          return;
15 
        }
 20 
        }
16 
 
 21 
 
17 
        return data.data;
 22 
        setShareUrl(data.data);
18 
      })
 23 
      })
19 
      .catch((err) => {
 24 
      .catch((err) => {
Línea 20... Línea 25...
20 
        onError(err);
 25 
        onError(err);
21 
        throw new Error(err);
 26 
        throw new Error(err);
22 
      });
 - 
 
23 
  };
 27 
      });
24 
 
 28 
  };
25 
  const copyClicked = async () => {
 29 
 
26 
    try {
 30 
  const copyClicked = async () => {
27 
      const shareUrl = await getShareUrl(shareData.url);
 31 
    try {
Línea 41... Línea 45...
41 
      default:
 45 
      default:
42 
        return "Copy link";
 46 
        return "Copy link";
43 
    }
 47 
    }
44 
  };
 48 
  };
Línea -... Línea 49...
- 
 
 49 
 
- 
 
 50 
  useEffect(() => {
- 
 
 51 
    getShareUrl(shareData.url);
- 
 
 52 
  }, [shareData]);
45 
 
 53 
 
46 
  return (
 54 
  return (
47 
    <div className={styles.share__popup}>
 - 
 
48 
      <div>
 55 
    <div className={styles.share__popup} ref={popUp}>
49 
        <h3>{shareData.title}</h3>
 - 
 
50 
        <button onClick={onClose}>
 - 
 
51 
          <span>Close Share</span>
 - 
 
52 
          <div aria-hidden="true">
 - 
 
53 
            <svg
 - 
 
54 
              xmlns="http://www.w3.org/2000/svg"
 - 
 
55 
              width="24"
 - 
 
56 
              height="24"
 - 
 
57 
              viewBox="0 0 24 24"
 - 
 
58 
            >
 - 
 
59 
              <g id="close">
 - 
 
60 
                <path
 - 
 
61 
                  id="x"
 - 
 
62 
                  d="M18.717 6.697l-1.414-1.414-5.303 5.303-5.303-5.303-1.414 1.414 5.303 5.303-5.303 5.303 1.414 1.414 5.303-5.303 5.303 5.303 1.414-1.414-5.303-5.303z"
 - 
 
63 
                />
 - 
 
64 
              </g>
 - 
 
65 
            </svg>
 - 
 
66 
          </div>
 - 
 
67 
        </button>
 - 
 
68 
      </div>
 56 
      <div>{parse(shareData.title)}</div>
69 
      <div>
 57 
      <div>
70 
        {state === "error" ? (
 58 
        {state === "error" ? (
71 
          <div>
 59 
          <div>
72 
            <p>
 60 
            <p>
73 
              Unable to copy to clipboard, please manually copy the url to
 61 
              Unable to copy to clipboard, please manually copy the url to
74 
              share.
 62 
              share.
75 
            </p>
 63 
            </p>
76 
          </div>
 64 
          </div>
77 
        ) : null}
 65 
        ) : null}
78 
        <input value={shareData.url} readOnly />
 66 
        <input value={shareUrl} readOnly />
- 
 
 67 
        <button className="btn btn-primary" onClick={copyClicked}>
- 
 
 68 
          {getButtonText(state)}
79 
        <button onClick={copyClicked}>{getButtonText(state)}</button>
 69 
        </button>
80 
      </div>
 70 
      </div>
81 
    </div>
 71 
    </div>
82 
  );
 72 
  );