Merge pull request #6 from ava-labs/fixes

Small fixes

client/public/index.html

@@ -6,13 +6,13 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
 
 
-    <meta name="description" content="Avalanche Faucet is a place where you can get free test tokens to play with, on the Avalanche's Fuji Network.">
+    <meta name="description" content="Avalanche Faucet is a place where you can get free test tokens to play with, on the Avalanche's Fuji Network and other Subnets">
     <meta name="keywords" content="Avalanche, AVAX, Faucet, Fuji, Testnet">
 
     <meta property="og:title" content="Faucet for the Avalanche Testnet">
     <meta property="og:site_name" content="Faucet | Avalanche">
     <meta property="og:url" content="https://faucet.avax-test.network/">
-    <meta property="og:description" content="Avalanche Faucet is a place where you can get free test tokens to play with, on the Avalanche's Fuji Network.">
+    <meta property="og:description" content="Avalanche Faucet is a place where you can get free test tokens to play with, on the Avalanche's Fuji Network and other Subnets">
     <meta property="og:type" content="website">
 
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

client/src/App.tsx

@@ -1,4 +1,5 @@
 import FaucetForm from './components/FaucetForm'
+import Contribute from './components/Contribute'
 
 import axios, { config } from './configure';
 import './App.css';
@@ -7,6 +8,8 @@ function App() {
   return (
     <div className="app">
       <FaucetForm axios = {axios} config = {config}/>
+
+      <Contribute/>
     </div>
   );
 }

client/src/components/Contribute.tsx

@@ -0,0 +1,12 @@
+import './styles/Contribute.css'
+
+const Contribute = () => {
+    return (
+        <div className="contribute-button" onClick={() => {window.open('https://github.com/ava-labs/avalanche-faucet', '_blank')}}>
+            <img style={{width: "25px", height: "25px", marginRight: "10px"}} src="/github.png"/>
+            Contribute on Github
+        </div>
+    )
+}
+
+export default Contribute;

client/src/components/FaucetForm.tsx

@@ -48,7 +48,7 @@ const FaucetForm = (props: any) => {
     useEffect(() => {
         let newOptions: any = []
 
-        chainConfigs.forEach((chain: any, i: number) => {
+        chainConfigs?.forEach((chain: any, i: number) => {
             let item =  <div className='select-dropdown'>
                 <img src = { chain.IMAGE } />
                 { chain.NAME }
@@ -84,7 +84,7 @@ const FaucetForm = (props: any) => {
     }
 
     async function updateBalance() {
-        if(chain || chain == 0) {
+        if((chain || chain == 0) && chainConfigs.length > 0) {
             const response = await props.axios.get(props.config.api.getBalance, {params: {chain: chainConfigs[chain!]?.ID}});
 
             if(response?.data || response?.data == 0) {
@@ -94,7 +94,7 @@ const FaucetForm = (props: any) => {
     }
 
     async function updateFaucetAddress() {
-        if(chain || chain == 0) {
+        if((chain || chain == 0) && chainConfigs.length > 0) {
             const response = await props.axios.get(props.config.api.faucetAddress, {params: {chain: chainConfigs[chain!]?.ID}});
 
             if(response?.data) {
@@ -258,7 +258,7 @@ const FaucetForm = (props: any) => {
                 <div className='box-content'>
                     <div className='box-header'>
                         <span>
-                            <span style={{color: "grey"}}>Select chain</span>
+                            <span style={{color: "grey"}}>Select Network</span>
                             <span style={{color: "grey"}}>Faucet balance: {Math.round(balance/1e9 * 100) / 100} {chainConfigs[chain!]?.TOKEN}</span>
                         </span>
 

client/src/components/styles/Contribute.css

@@ -0,0 +1,19 @@
+.contribute-button {
+    position: absolute;
+    top: 30px;
+    right: 20px;
+    padding: 10px;
+    cursor: pointer;
+    width: max-content;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 15px;
+    background-color: #333;
+    color: rgba(255, 255, 255, 0.7);
+}
+
+.contribute-button:hover {
+    background-color: black;
+    color: white;
+}

config.json

@@ -17,7 +17,7 @@
             "RPC": "https://api.avax-test.network/ext/C/rpc",
             "CHAINID": 43113,
             "EXPLORER": "https://testnet.snowtrace.io",
-            "IMAGE": "https://raw.githubusercontent.com/ava-labs/avalanche-faucet/main/client/public/avax.webp",
+            "IMAGE": "/avaxred.png",
             "MAX_PRIORITY_FEE": "2000000000",
             "MAX_FEE": "100000000000",
             "DRIP_AMOUNT": 2000000000,
@@ -34,7 +34,7 @@
             "RPC": "https://subnets.avax.network/wagmi/wagmi-chain-testnet/rpc",
             "CHAINID": 11111,
             "EXPLORER": "https://subnets.avax.network/wagmi/wagmi-chain-testnet/explorer",
-            "IMAGE": "https://raw.githubusercontent.com/ava-labs/avalanche-faucet/main/client/public/wagmi.png",
+            "IMAGE": "/wagmi.png",
             "MAX_PRIORITY_FEE": "2000000000",
             "MAX_FEE": "100000000000",
             "DRIP_AMOUNT": 2000000000,