Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 348 | Rev 352 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
348 stevensc 1
import React, { useState } from "react";
2
 
349 stevensc 3
import styles from "./MobileSharePopUp.module.scss";
4
 
348 stevensc 5
const SharePopup = ({ shareData, onClose, onError }) => {
6
  const [state, setState] = useState("pending");
7
 
349 stevensc 8
  const getShareUrl = async (url = "") => {
9
    await axios
10
      .get(url)
11
      .then(({ data }) => {
12
        if (!data.success) {
13
          dispatch(addNotification({ style: "danger", msg: data.data }));
14
          return;
15
        }
16
 
17
        return data.data;
18
      })
19
      .catch((err) => {
20
        onError(err);
21
        throw new Error(err);
22
      });
23
  };
24
 
348 stevensc 25
  const copyClicked = async () => {
26
    try {
349 stevensc 27
      const shareUrl = await getShareUrl(shareData.url);
28
      await navigator.clipboard.writeText(shareUrl || "");
348 stevensc 29
      setState("success");
30
    } catch (err) {
31
      onError && onError(err);
32
      setState("error");
33
    }
34
  };
35
 
36
  const getButtonText = (state) => {
37
    switch (state) {
38
      case "success":
39
        return "Link copied";
40
      case "pending":
41
      default:
42
        return "Copy link";
43
    }
44
  };
45
 
46
  return (
349 stevensc 47
    <div className={styles.share__popup}>
348 stevensc 48
      <div>
349 stevensc 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>
69
      <div>
70
        {state === "error" ? (
348 stevensc 71
          <div>
349 stevensc 72
            <p>
73
              Unable to copy to clipboard, please manually copy the url to
74
              share.
75
            </p>
348 stevensc 76
          </div>
349 stevensc 77
        ) : null}
78
        <input value={shareData.url} readOnly />
79
        <button onClick={copyClicked}>{getButtonText(state)}</button>
348 stevensc 80
      </div>
81
    </div>
82
  );
83
};
84
 
85
export default SharePopup;