-
Notifications
You must be signed in to change notification settings - Fork 294
/
StepDisconnect.jsx
58 lines (53 loc) · 1.57 KB
/
StepDisconnect.jsx
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
56
57
58
// @flow
import React, { useCallback } from "react";
import Box from "~/renderer/components/Box";
import Text from "~/renderer/components/Text";
import { useDispatch } from "react-redux";
import { cleanFullNodeDisconnect } from "~/renderer/actions/accounts";
import styled from "styled-components";
import { Trans } from "react-i18next";
import fullnodeIllustration from "~/renderer/images/disconnect.png";
import Button from "~/renderer/components/Button";
import { removeLSS } from "~/renderer/storage";
const Illustration = styled.div`
margin-bottom: 24px;
width: 236px;
height: 64px;
background: url('${fullnodeIllustration}');
background-size: contain;
align-self: center;
`;
const Disconnect = () => (
<Box>
<Illustration />
<Text
mx={30}
ff="Inter|Regular"
textAlign={"center"}
mt={32}
fontSize={4}
color="palette.text.shade50"
>
<Trans i18nKey={"fullNode.modal.steps.disconnect.description"} />
</Text>
</Box>
);
export const StepDisconnectFooter = ({ onClose }: { onClose: () => void }) => {
const dispatch = useDispatch();
const onConfirmDisconnect = useCallback(() => {
removeLSS();
dispatch(cleanFullNodeDisconnect());
onClose();
}, [dispatch, onClose]);
return (
<Box horizontal alignItems={"flex-end"}>
<Button secondary onClick={onClose} mr={3}>
<Trans i18nKey="common.cancel" />
</Button>
<Button danger onClick={onConfirmDisconnect}>
<Trans i18nKey="fullNode.modal.steps.disconnect.cta" />
</Button>
</Box>
);
};
export default Disconnect;