From 35e83ed8da7267a5196f871e872f084aeffcd8ac Mon Sep 17 00:00:00 2001 From: Tim Pechersky Date: Wed, 25 Aug 2021 14:29:49 +0200 Subject: [PATCH 1/6] linter --- frontend/src/components/ContractSource.js | 48 +++++++++++------------ frontend/src/components/TxInfo.js | 16 ++++---- 2 files changed, 32 insertions(+), 32 deletions(-) diff --git a/frontend/src/components/ContractSource.js b/frontend/src/components/ContractSource.js index fc804209..88d9d67f 100644 --- a/frontend/src/components/ContractSource.js +++ b/frontend/src/components/ContractSource.js @@ -1,29 +1,29 @@ import React from "react"; -import { - VStack, - Code, -} from "@chakra-ui/react"; +import { VStack, Code } from "@chakra-ui/react"; import { Table, Thead, Tbody, Tr, Th, Td } from "@chakra-ui/react"; const ContractSource = ({ source_info }) => { - return ( - - - - - - - - - - - - - - -
Contract NameCompiler version
{source_info.name} {source_info.compiler_version}
- {source_info.source_code} -
) -} + return ( + + + + + + + + + + + + + + +
Contract NameCompiler version
{source_info.name} {source_info.compiler_version}
+ + {source_info.source_code} + +
+ ); +}; -export default ContractSource; \ No newline at end of file +export default ContractSource; diff --git a/frontend/src/components/TxInfo.js b/frontend/src/components/TxInfo.js index 4ad40178..30046e23 100644 --- a/frontend/src/components/TxInfo.js +++ b/frontend/src/components/TxInfo.js @@ -9,7 +9,7 @@ import { Box, VStack, } from "@chakra-ui/react"; -import ContractSource from './ContractSource' +import ContractSource from "./ContractSource"; import { Table, Thead, Tbody, Tr, Th, Td } from "@chakra-ui/react"; const toEth = (wei) => { return wei / Math.pow(10, 18); @@ -95,13 +95,13 @@ const TxInfo = (props) => { )} - {transaction.smart_contract_info && } - { - transaction.tx.input && transaction.tx.input !== "0x" && ( - - ) - } - + {transaction.smart_contract_info && ( + + )} + {transaction.tx.input && transaction.tx.input !== "0x" && ( + + )} + ); }; export default TxInfo; From a3c7164794d8b9b1b81d224ebae35d57f8952475 Mon Sep 17 00:00:00 2001 From: Tim Pechersky Date: Wed, 25 Aug 2021 14:30:04 +0200 Subject: [PATCH 2/6] intial works --- .../src/components/NewModalSubscripton.js | 14 +- .../stream-cards/EthereumWhalewatch.js | 200 ++++++++++++------ 2 files changed, 149 insertions(+), 65 deletions(-) diff --git a/frontend/src/components/NewModalSubscripton.js b/frontend/src/components/NewModalSubscripton.js index 6d613e14..e87f0d18 100644 --- a/frontend/src/components/NewModalSubscripton.js +++ b/frontend/src/components/NewModalSubscripton.js @@ -21,11 +21,18 @@ import { useForm } from "react-hook-form"; import { GithubPicker } from "react-color"; import { BiRefresh } from "react-icons/bi"; import { makeColor } from "../core/utils/makeColor"; -const NewSubscription = ({ isFreeOption, onClose }) => { +const NewSubscription = ({ + isFreeOption, + onClose, + initialAddress, + initialType, +}) => { const [color, setColor] = useState(makeColor()); const { typesCache, createSubscription } = useSubscriptions(); const { handleSubmit, errors, register } = useForm({}); - const [radioState, setRadioState] = useState("ethereum_blockchain"); + const [radioState, setRadioState] = useState( + initialType ?? "ethereum_blockchain" + ); let { getRootProps, getRadioProps } = useRadioGroup({ name: "type", defaultValue: radioState, @@ -66,6 +73,8 @@ const NewSubscription = ({ isFreeOption, onClose }) => { autoComplete="off" placeholder="Enter label" name="label" + defaultValue={initialAddress ?? ""} + isReadOnly={!!initialAddress} ref={register({ required: "label is required!" })} > @@ -98,6 +107,7 @@ const NewSubscription = ({ isFreeOption, onClose }) => { const radio = getRadioProps({ value: type.id, isDisabled: + (initialAddress && initialType) || !type.active || (isFreeOption && type.id !== "ethereum_blockchain"), }); diff --git a/frontend/src/components/stream-cards/EthereumWhalewatch.js b/frontend/src/components/stream-cards/EthereumWhalewatch.js index 11fccb4f..4b53f0bc 100644 --- a/frontend/src/components/stream-cards/EthereumWhalewatch.js +++ b/frontend/src/components/stream-cards/EthereumWhalewatch.js @@ -10,16 +10,28 @@ import { Spacer, Spinner, chakra, + SimpleGrid, + Box, + Modal, + ModalContent, + ModalOverlay, + IconButton, + useDisclosure, } from "@chakra-ui/react"; import UIContext from "../../core/providers/UIProvider/context"; import { useToast } from "../../core/hooks"; import { useSubscriptions } from "../../core/hooks"; +import moment from "moment"; +import { AiOutlineMonitor } from "react-icons/ai"; +import NewSubscription from "../NewModalSubscripton"; const EthereumWhalewatchCard_ = ({ entry, showOnboardingTooltips, className, }) => { + const [newSubscriptionWhaleType, setNewSubscriptionWhaleType] = useState(); + const { isOpen, onOpen, onClose } = useDisclosure(); const { subscriptionsCache, subscriptionTypeIcons } = useSubscriptions(); const ui = useContext(UIContext); const [copyString, setCopyString] = useState(false); @@ -64,14 +76,35 @@ const EthereumWhalewatchCard_ = ({ }); const rowLabels = { - transactionsOut: "Number of transactions sent", - transactionsIn: "Number of transactions received", + transactionsOut: "transactions sent", + transactionsIn: "transactions received", valueOut: "WEI sent", valueIn: "WEI received", }; + const subscribeClicked = (whaleType) => { + setNewSubscriptionWhaleType(whaleType); + onOpen(); + }; return ( + + + + + + + {icon ? : ""} - + Ethereum whale watch - {`${entry.event_data.date_range.start_time} to ${entry.event_data.date_range.end_time}`} + {`${moment(entry.event_data.date_range.start_time).format( + "ll [from] LT" + )} to ${moment(entry.event_data.date_range.end_time).format( + moment(entry.event_data.date_range.start_time).format("l") === + moment(entry.event_data.date_range.end_time).format("l") + ? "LT" + : "lll" + )}`} - {Object.keys(whales).map((whaleType) => { - return ( - - - + + + Whale + + + Address + + + Value + + {Object.keys(whales).map((whaleType) => { + return ( + <> + {rowLabels[whaleType]} - - - - + + setCopyString(whales[whaleType].address)} + isTruncated + > + {whales[whaleType].label} + + + {whales[whaleType].label === whales[whaleType].address && ( + + + subscribeClicked(whaleType)} + colorScheme="secondary" + variant="outline" + m={0} + boxSize="24px" + icon={} + /> + + + )} + + setCopyString(whales[whaleType].address)} + textAlign="left" + pl={2} > - {whales[whaleType].label} -- {whales[whaleType].statistic} - - - - ); - })} + {whales[whaleType].statistic} + + + ); + })} + ); }; From c1ce8946c89007d42fe7b7e5197b9752cb316e0a Mon Sep 17 00:00:00 2001 From: Tim Pechersky Date: Wed, 25 Aug 2021 14:37:51 +0200 Subject: [PATCH 3/6] works --- frontend/src/components/NewModalSubscripton.js | 4 ++-- frontend/src/components/stream-cards/EthereumWhalewatch.js | 7 +------ 2 files changed, 3 insertions(+), 8 deletions(-) diff --git a/frontend/src/components/NewModalSubscripton.js b/frontend/src/components/NewModalSubscripton.js index e87f0d18..9fb40a2b 100644 --- a/frontend/src/components/NewModalSubscripton.js +++ b/frontend/src/components/NewModalSubscripton.js @@ -73,8 +73,6 @@ const NewSubscription = ({ autoComplete="off" placeholder="Enter label" name="label" - defaultValue={initialAddress ?? ""} - isReadOnly={!!initialAddress} ref={register({ required: "label is required!" })} > @@ -87,6 +85,8 @@ const NewSubscription = ({ autoComplete="off" my={2} placeholder="Enter address" + defaultValue={initialAddress ?? undefined} + isReadOnly={!!initialAddress} name="address" ref={register({ required: "address is required!" })} > diff --git a/frontend/src/components/stream-cards/EthereumWhalewatch.js b/frontend/src/components/stream-cards/EthereumWhalewatch.js index 4b53f0bc..5b641e86 100644 --- a/frontend/src/components/stream-cards/EthereumWhalewatch.js +++ b/frontend/src/components/stream-cards/EthereumWhalewatch.js @@ -1,4 +1,4 @@ -import React, { useContext, useEffect, useState } from "react"; +import React, { useEffect, useState } from "react"; import { Text, Stack, @@ -6,7 +6,6 @@ import { useClipboard, Heading, Image, - useMediaQuery, Spacer, Spinner, chakra, @@ -18,7 +17,6 @@ import { IconButton, useDisclosure, } from "@chakra-ui/react"; -import UIContext from "../../core/providers/UIProvider/context"; import { useToast } from "../../core/hooks"; import { useSubscriptions } from "../../core/hooks"; import moment from "moment"; @@ -33,7 +31,6 @@ const EthereumWhalewatchCard_ = ({ const [newSubscriptionWhaleType, setNewSubscriptionWhaleType] = useState(); const { isOpen, onOpen, onClose } = useDisclosure(); const { subscriptionsCache, subscriptionTypeIcons } = useSubscriptions(); - const ui = useContext(UIContext); const [copyString, setCopyString] = useState(false); const [icon, setIcon] = useState(null); const { onCopy, hasCopied } = useClipboard(copyString, 1); @@ -53,8 +50,6 @@ const EthereumWhalewatchCard_ = ({ setIcon(subscriptionTypeIcons.ethereum_whalewatch); } }, [subscriptionTypeIcons, setIcon]); - - const [showFullView] = useMediaQuery(["(min-width: 420px)"]); if (subscriptionsCache.isLoading) return ; const whales = { From 2594fcdfed9e2e1f9a2d81958c8a85b97b6b3426 Mon Sep 17 00:00:00 2001 From: Tim Pechersky Date: Wed, 25 Aug 2021 14:52:20 +0200 Subject: [PATCH 4/6] more space to address --- .../components/stream-cards/EthereumWhalewatch.js | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/frontend/src/components/stream-cards/EthereumWhalewatch.js b/frontend/src/components/stream-cards/EthereumWhalewatch.js index 5b641e86..c412a8d0 100644 --- a/frontend/src/components/stream-cards/EthereumWhalewatch.js +++ b/frontend/src/components/stream-cards/EthereumWhalewatch.js @@ -146,12 +146,11 @@ const EthereumWhalewatchCard_ = ({ fontWeight="600" // w={showFullView ? null : "120px"} justifyContent="flex-start" - columnS > Whale {rowLabels[whaleType]} @@ -228,7 +226,7 @@ const EthereumWhalewatchCard_ = ({ )} Date: Wed, 25 Aug 2021 15:11:48 +0200 Subject: [PATCH 5/6] welcome new subscription type fix --- frontend/src/components/NewSubscription.js | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/frontend/src/components/NewSubscription.js b/frontend/src/components/NewSubscription.js index 8acd08b2..230ea755 100644 --- a/frontend/src/components/NewSubscription.js +++ b/frontend/src/components/NewSubscription.js @@ -21,12 +21,20 @@ import { CirclePicker } from "react-color"; import { BiRefresh } from "react-icons/bi"; import { makeColor } from "../core/utils/makeColor"; import { useForm } from "react-hook-form"; -const _NewSubscription = ({ isFreeOption, onClose, setIsLoading }) => { +const _NewSubscription = ({ + isFreeOption, + onClose, + setIsLoading, + initialAddress, + initialType, +}) => { const [color, setColor] = useState(makeColor()); const { handleSubmit, errors, register } = useForm({}); const { typesCache, createSubscription } = useSubscriptions(); // const { handleSubmit, errors, register } = useForm({}); - const [radioState, setRadioState] = useState("ethereum_blockchain"); + const [radioState, setRadioState] = useState( + initialType ?? "ethereum_blockchain" + ); let { getRootProps, getRadioProps } = useRadioGroup({ name: "type", defaultValue: radioState, @@ -52,7 +60,7 @@ const _NewSubscription = ({ isFreeOption, onClose, setIsLoading }) => { createSubscription.mutate({ ...props, color: color, - type: isFreeOption ? 0 : radioState, + type: isFreeOption ? "ethereum_blockchain" : radioState, }); }, [createSubscription, isFreeOption, color, radioState] @@ -107,6 +115,7 @@ const _NewSubscription = ({ isFreeOption, onClose, setIsLoading }) => { const radio = getRadioProps({ value: type.id, isDisabled: + (initialAddress && initialType) || !type.active || (isFreeOption && type.id !== "ethereum_blockchain"), }); From 12f590a19abdfde3d2d047c1e6f5a3d930601f3f Mon Sep 17 00:00:00 2001 From: Tim Pechersky Date: Wed, 25 Aug 2021 15:21:38 +0200 Subject: [PATCH 6/6] disable details button on whale whatch card --- frontend/src/components/StreamEntry.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/frontend/src/components/StreamEntry.js b/frontend/src/components/StreamEntry.js index 30972b0d..36604f10 100644 --- a/frontend/src/components/StreamEntry.js +++ b/frontend/src/components/StreamEntry.js @@ -53,6 +53,9 @@ const StreamEntry_ = ({ entry, showOnboardingTooltips, className }) => { maxW="150px" > ui.setCurrentTransaction(entry)} h="full"