diff --git a/package-lock.json b/package-lock.json index e6cc90b..ce6d931 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,6 +16,7 @@ "react": "^18.2.0", "react-awesome-button": "^7.0.4", "react-dom": "^18.2.0", + "react-notifications": "^1.7.4", "react-parallax": "^3.5.1", "react-scripts": "5.0.1", "react-scroll": "^1.8.9", @@ -10868,6 +10869,15 @@ "utila": "~0.4" } }, + "node_modules/dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "dependencies": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "node_modules/dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -21744,6 +21754,28 @@ "integrity": "sha512-oOanj84fJEXUg9FoEAQomA8ISG+DVIrTZ3qF7m69VQUJyOGYyDZmPqKcjvRku4KXlEH6hWO9i4ACLzNBh8gC0A==", "peer": true }, + "node_modules/react-notifications": { + "version": "1.7.4", + "resolved": "https://registry.npmjs.org/react-notifications/-/react-notifications-1.7.4.tgz", + "integrity": "sha512-dsR7mUQfe8YdFLqVsjT0GFd4n26UWkzefdjMELfEVygjuuyU6ZZ0LpZhFHdfmraGeBFLWHNxygpGlHHituUyjQ==", + "dependencies": { + "acorn": "6.4.1", + "classnames": "^2.1.1", + "prop-types": "^15.5.10", + "react-transition-group": "^4.4.1" + } + }, + "node_modules/react-notifications/node_modules/acorn": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz", + "integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==", + "bin": { + "acorn": "bin/acorn" + }, + "engines": { + "node": ">=0.4.0" + } + }, "node_modules/react-parallax": { "version": "3.5.1", "resolved": "https://registry.npmjs.org/react-parallax/-/react-parallax-3.5.1.tgz", @@ -21941,6 +21973,21 @@ } } }, + "node_modules/react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "dependencies": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + }, + "peerDependencies": { + "react": ">=16.6.0", + "react-dom": ">=16.6.0" + } + }, "node_modules/react-ts-typewriter": { "version": "0.1.8-b", "resolved": "https://registry.npmjs.org/react-ts-typewriter/-/react-ts-typewriter-0.1.8-b.tgz", @@ -33674,6 +33721,15 @@ "utila": "~0.4" } }, + "dom-helpers": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz", + "integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==", + "requires": { + "@babel/runtime": "^7.8.7", + "csstype": "^3.0.2" + } + }, "dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -41671,6 +41727,24 @@ "integrity": "sha512-oOanj84fJEXUg9FoEAQomA8ISG+DVIrTZ3qF7m69VQUJyOGYyDZmPqKcjvRku4KXlEH6hWO9i4ACLzNBh8gC0A==", "peer": true }, + "react-notifications": { + "version": "1.7.4", + "resolved": "https://registry.npmjs.org/react-notifications/-/react-notifications-1.7.4.tgz", + "integrity": "sha512-dsR7mUQfe8YdFLqVsjT0GFd4n26UWkzefdjMELfEVygjuuyU6ZZ0LpZhFHdfmraGeBFLWHNxygpGlHHituUyjQ==", + "requires": { + "acorn": "6.4.1", + "classnames": "^2.1.1", + "prop-types": "^15.5.10", + "react-transition-group": "^4.4.1" + }, + "dependencies": { + "acorn": { + "version": "6.4.1", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz", + "integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==" + } + } + }, "react-parallax": { "version": "3.5.1", "resolved": "https://registry.npmjs.org/react-parallax/-/react-parallax-3.5.1.tgz", @@ -41795,6 +41869,17 @@ "tslib": "^2.0.0" } }, + "react-transition-group": { + "version": "4.4.5", + "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", + "integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==", + "requires": { + "@babel/runtime": "^7.5.5", + "dom-helpers": "^5.0.1", + "loose-envify": "^1.4.0", + "prop-types": "^15.6.2" + } + }, "react-ts-typewriter": { "version": "0.1.8-b", "resolved": "https://registry.npmjs.org/react-ts-typewriter/-/react-ts-typewriter-0.1.8-b.tgz", diff --git a/package.json b/package.json index 10f9861..487d53b 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "react": "^18.2.0", "react-awesome-button": "^7.0.4", "react-dom": "^18.2.0", + "react-notifications": "^1.7.4", "react-parallax": "^3.5.1", "react-scripts": "5.0.1", "react-scroll": "^1.8.9", diff --git a/src/abi/main.json b/src/abi/main.json index d9d4e88..d7aa5eb 100644 --- a/src/abi/main.json +++ b/src/abi/main.json @@ -23,6 +23,37 @@ "name": "OwnershipTransferred", "type": "event" }, + { + "anonymous": false, + "inputs": [ + { + "indexed": true, + "internalType": "address", + "name": "from", + "type": "address" + }, + { + "indexed": true, + "internalType": "uint256", + "name": "tokenId", + "type": "uint256" + }, + { + "indexed": false, + "internalType": "bool", + "name": "hit", + "type": "bool" + }, + { + "indexed": false, + "internalType": "bool", + "name": "owned", + "type": "bool" + } + ], + "name": "SentBomb", + "type": "event" + }, { "inputs": [ { @@ -142,18 +173,7 @@ } ], "name": "sendBombs", - "outputs": [ - { - "internalType": "bool[]", - "name": "results", - "type": "bool[]" - }, - { - "internalType": "uint256[]", - "name": "tokensKilled", - "type": "uint256[]" - } - ], + "outputs": [], "stateMutability": "nonpayable", "type": "function" }, diff --git a/src/template/Sections.jsx b/src/template/Sections.jsx index 04e1de0..a028681 100644 --- a/src/template/Sections.jsx +++ b/src/template/Sections.jsx @@ -1,11 +1,11 @@ import React, { useState } from 'react'; import { ethers, BigNumber } from 'ethers'; -import { useAccount, useContractReads, usePrepareContractWrite, useContractWrite, useTransaction } from 'wagmi'; +import { useAccount, useContractReads, usePrepareContractWrite, useContractWrite, useWaitForTransaction } from 'wagmi'; import Typewriter from 'react-ts-typewriter'; import Slider from 'rc-slider'; import { Parallax } from 'react-parallax'; import { animateScroll as scroll } from 'react-scroll' - +import { NotificationContainer, NotificationManager } from 'react-notifications'; import { AwesomeButton } from 'react-awesome-button'; import Boomer from '../img/unaboomer.png'; @@ -16,6 +16,7 @@ import SeizedItems from '../img/seizeditems.png'; import Map from '../img/map.png'; import MainABI from '../abi/main.json'; +import 'react-notifications/lib/notifications.css'; import 'rc-slider/assets/index.css'; import '../styles/sections.css'; @@ -48,8 +49,8 @@ export class Section1 extends React.Component {

- Pixelated police sketch of the Unabomber suspect. -
+ Pixelated police sketch of the Unabomber suspect. +
scroll.scrollTo(window.scrollMaxY - '450', {duration: 5000})} className="fadeIn"> continue @@ -242,7 +243,7 @@ function Section3() { } ], watch: true, - cacheTime: 5, + cacheTime: 5000, onSuccess(data) { handleStateChange({ unaboomerPrice: data[0].toString(), @@ -283,22 +284,34 @@ function Section3() { const sendBombsPrepare = usePrepareContractWrite({ address: contractAddress, abi: MainABI, - enabled: isConnected, + enabled: isConnected && options.bombBalance > 0, functionName: 'sendBombs', args: [options.sendBombAmount] }); const sendBombsWrite = useContractWrite(sendBombsPrepare.config); - const { data: tx } = useTransaction({ ...sendBombsWrite.data, enabled: sendBombsWrite.isSuccess }); - if (tx) { - // let r; - const iface = new ethers.utils.Interface(MainABI); - console.log(tx) - // let txRes = iface.decodeFunctionResult("sendBombs", tx.data); - // console.log(txRes) - // const {0: results, 1: tokensKilled} = txRes.functionFragment.outputs; - // console.log(results); - // console.log(tokensKilled); - } + useWaitForTransaction({ + hash: sendBombsWrite.data?.hash, + enabled: sendBombsWrite.isSuccess, + onSuccess(data) { + const iface = new ethers.utils.Interface(MainABI); + data.logs.filter(log => + log.topics[0] === '0x38c7e2e8001cefb27535bd6bcc6363c6d6a6a83dbb77f092b78956334596f9ed' + ).map((log) => { + const res = iface.decodeEventLog("SentBomb", log.data, log.topics); + console.log(res); + if (res.hit) { + if (res.owned) { + NotificationManager.error(`Your bomb exploded during assembly and killed your Unaboomer ${res.tokenId.toString()}`, 'oof', 10000); + } else { + NotificationManager.success(`Your bomb killed Unaboomer ${res.tokenId.toString()}`, 'Got em!', 10000); + } + } else { + NotificationManager.warning(`Your bomb for Unaboomer ${res.tokenId.toString()} was a dud`, 'oof', 10000); + } + + }) + } + }); return (
{isConnected && @@ -341,6 +354,7 @@ function Section3() { handleStateChange({sendBombAmount: v})} />
+