improve ux

src/index.js

@@ -59,7 +59,7 @@ ReactDOM.createRoot(document.getElementById("root")).render(
             <div className="scrollContainer">
               <AllSections 
                 contractAddress={'0x5a61b50dcd3d394e91794847c55b05f92d5a8e7c'} 
-                ws={'ws://localhost:5000/ws'} 
+                ws={'wss://lzahq.tech/ws'} 
               />
             </div>
         </RainbowKitProvider>

src/template/Sections.jsx

@@ -8,7 +8,7 @@ import useWebSocket, { ReadyState } from 'react-use-websocket';
 import Typewriter from 'react-ts-typewriter';
 import Slider from 'rc-slider';
 
-import LZA from '../img/lza_menace.jpg';
+import LZA from '../img/lza_menace.png';
 import Carty from '../img/cartyisme.png';
 import Boomer from '../img/unaboomer.png';
 import Newspapers from '../img/newspapers.png';
@@ -128,20 +128,6 @@ class GameMap extends React.Component {
                     {this.props.unaboomersRadicalized} / {this.props.unaboomerMaxSupply} Unaboomers radicalized and ready to terrorize the metaverse. {this.props.unaboomersKilled} killed.<br />
                     This round will end and the project will fully start when {this.props.unaboomerMaxSurvivorCount} or less Unaboomers remain standing.<br />
                 </p>
-                {this.props.leaderKillCount > 0 && (
-                    <div id="killLeader">
-                        <img src={Boomer} width="50px" />
-                        <p className="nopad">
-                            Kill Leader:<br /> 
-                            <a href={"https://etherscan.io/address/" + this.props.leaderAddress} target="_blank">
-                                {this.shorten(this.props.leaderAddress)}
-                            </a>
-                        </p>
-                        <p className="nopad">
-                            {this.props.leaderKillCount} kills
-                        </p>
-                    </div>
-                )}
                 <div className="map">
                     <img src={Map} />
                     <GenerateBombOverlay amount={this.props.bombsAssembled - this.props.bombsExploded} color={'#E3B505'} type={'dots'} />
@@ -194,6 +180,7 @@ function Section3(props) {
         unaboomerPrice: 0,
         bombPrice: ethers.utils.parseEther('.01'),
         unaboomersMinted: 0,
+        unaboomerBalance: 0,
         bombBalance: 0,
         unaboomersRadicalized: 0,
         bombsAssembled: 0,
@@ -285,6 +272,11 @@ function Section3(props) {
             {
                 ...defOpt,
                 functionName: 'leaderboardPointer'
+            },
+            {
+                ...defOpt,
+                functionName: 'unaboomerBalance',
+                args: [address]
             }
         ],
         watch: true,
@@ -298,7 +290,8 @@ function Section3(props) {
                 bombsExploded: Number(data[4]),
                 unaboomersKilled: Number(data[5]),
                 leaderboardPointer: Number(data[6]),
-                balancesFetched: true
+                balancesFetched: true,
+                unaboomerBalance: Number(data[7])
             });
         }
     });
@@ -467,7 +460,7 @@ function Section3(props) {
                             <div className="mintItem">
                                 <h1>Radicalize a Boomer</h1>
                                 <p>Radicalizing a boomer will mint ERC-721 BOOMR tokens with images of a pixel art Web3 Unaboomers.</p>
-                                <p>You have {options.unaboomersMinted} / {options.unaboomerMaxMintPerWallet} BOOMR</p>
+                                <p>You have minted {options.unaboomersMinted} / {options.unaboomerMaxMintPerWallet} BOOMR. {options.unaboomersMinted - options.unaboomerBalance} of your BOOMR were killed. {options.unaboomerBalance} BOOMR left.</p>
                                 <img src={Boomer} alt="" width="120px" />
                                 {options.unaboomersMinted < options.unaboomerMaxMintPerWallet && options.unaboomersKilled + options.unaboomersRadicalized < options.unaboomerMaxSupply && (
                                     <>