blob: f69000a26256943efab05c1d4fc2735f8e30f204 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
import React, {useEffect, useState} from 'react';
import axios from "axios";
import Loader from "./Loader";
import CopyButton from "./CopyButton";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faBomb } from '@fortawesome/free-solid-svg-icons';
function Response(props){
const CancelToken = axios.CancelToken;
const [requestState, setRequestState] = useState({loading: true, cancel: CancelToken.source()});
useEffect(() => {
axios.post('/', {url: "https://" + props.url}, {cancelToken: requestState.cancel.token})
.then((r) => {
setRequestState({loading: false, hash: r.data.hash, cancel: requestState.cancel});
}).catch((e) => {
if (!axios.isCancel(e)) {
setRequestState({loading: false, error: true, cancel: requestState.cancel});
}
});
return () => {
requestState.cancel.cancel();
};
}, [props.url, requestState.cancel])
let text;
let rightItem;
if (!requestState.loading) {
if (!requestState.error) {
rightItem = <CopyButton hash={requestState.hash}/>;
if (props.url.length < 20) {
text =
<span>The short link for <strong>{props.url}</strong> is<br/><strong>sho.rest/{requestState.hash}</strong></span>;
} else {
text =
<span>The short link for your URL is<br/><strong>sho.rest/{requestState.hash}</strong></span>;
}
} else {
rightItem = <FontAwesomeIcon className="right-item" icon={faBomb}/>;
text = <span>There was an error.</span>
}
} else {
text = <Loader/>
}
return (
<div className={"response-container" + (requestState.error ? " disabled" : "")}>
<div className={"title response-text" + (requestState.error ? " disabled" : "")}>{text}</div>
{rightItem}
</div>
)
}
export default Response;
|
