diff --git a/package.json b/package.json index 4beee7f9..540d1cc2 100755 --- a/package.json +++ b/package.json @@ -52,7 +52,7 @@ "react-pro-sidebar": "1.1.0", "react-responsive-carousel": "3.2.23", "react-select": "5.8.0", - "react-share": "5.1.0", + "react-share": "^5.1.0", "sharp": "0.33.4", "starknet": "6.4.1", "starknetkit": "1.1.9", diff --git a/public/x_logo.png b/public/x_logo.png new file mode 100644 index 00000000..dae2b91f Binary files /dev/null and b/public/x_logo.png differ diff --git a/src/components/TxButton.tsx b/src/components/TxButton.tsx index 5d0c8173..f05a7379 100755 --- a/src/components/TxButton.tsx +++ b/src/components/TxButton.tsx @@ -1,11 +1,25 @@ import CONSTANTS from '@/constants'; import { StrategyTxProps, monitorNewTxAtom } from '@/store/transactions.atom'; -import { Box, Button, ButtonProps, Spinner } from '@chakra-ui/react'; +import { + Box, + Button, + ButtonProps, + Modal, + ModalBody, + ModalCloseButton, + ModalContent, + ModalOverlay, + Spinner, + Text, + useDisclosure, +} from '@chakra-ui/react'; import { useAccount, useContractWrite } from '@starknet-react/core'; import { useSetAtom } from 'jotai'; import mixpanel from 'mixpanel-browser'; +import Image from 'next/image'; import { useEffect, useMemo } from 'react'; import { isMobile } from 'react-device-detect'; +import { TwitterShareButton } from 'react-share'; import { Call } from 'starknet'; interface TxButtonProps { @@ -19,6 +33,8 @@ interface TxButtonProps { export default function TxButton(props: TxButtonProps) { const { address } = useAccount(); const monitorNewTx = useSetAtom(monitorNewTxAtom); + const { isOpen, onOpen, onClose } = useDisclosure(); + const disabledStyle = { bg: 'var(--chakra-colors-disabled_bg)', color: 'var(--chakra-colors-disabled_text)', @@ -105,34 +121,91 @@ export default function TxButton(props: TxButtonProps) { } return ( - - - + writeAsync().then((tx) => { + onOpen(); + mixpanel.track('Submitted tx', { + txHash: tx.transaction_hash, + address, + }); + }); + }} + {...props.buttonProps} + > + {isPending && }{' '} + {props.text} + + + ); } diff --git a/yarn.lock b/yarn.lock index 781b69b6..a368d846 100755 --- a/yarn.lock +++ b/yarn.lock @@ -5521,7 +5521,7 @@ react-select@5.8.0: react-transition-group "^4.3.0" use-isomorphic-layout-effect "^1.1.2" -react-share@5.1.0: +react-share@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/react-share/-/react-share-5.1.0.tgz#27eff763e5c233c8765cacf595b039093cb9b408" integrity sha512-OvyfMtj/0UzH1wi90OdHhZVJ6WUC/+IeWvBwppeZozwIGyAjQgyR0QXlHOrxVHVECqnGvcpBaFTXVrqouTieaw==