Prevent maintenance issues when adding new faucet hosts, and fix the loader which broke during a past migration

Author: jonathanirvin

@theme/components/XRPLoader.tsx

@@ -6,7 +6,7 @@ export interface XRPLoaderProps {
 
 export default function XRPLoader(props: XRPLoaderProps) {
   return (
-  <div className="loader collapse">
+  <div className="loader">
     <img alt="(loading)" className="throbber" src="/img/xrp-loader-96.png" />
     {props.message}
   </div>);

resources/dev-tools/faucets.json

@@ -4,39 +4,39 @@
             "id": "faucet-select-testnet",
             "wsUrl": "wss://s.altnet.rippletest.net:51233/",
             "jsonRpcUrl": "https://s.altnet.rippletest.net:51234/",
-            "faucetUrl": "faucet.altnet.rippletest.net",
+            "faucetHost": "faucet.altnet.rippletest.net",
             "shortName": "Testnet",
             "desc": "Mainnet-like network for testing applications."
         },
         {
             "id": "faucet-select-devnet",
             "wsUrl": "wss://s.devnet.rippletest.net:51233/",
             "jsonRpcUrl": "https://s.devnet.rippletest.net:51234/",
-            "faucetUrl": "faucet.devnet.rippletest.net",
+            "faucetHost": "faucet.devnet.rippletest.net",
             "shortName": "Devnet",
             "desc": "Preview of upcoming amendments."
         },
         {
             "id": "faucet-select-xahau",
             "wsUrl": "wss://xahau-test.net/",
             "jsonRpcUrl": "https://xahau-test.net/",
-            "faucetUrl": "xahau-test.net",
+            "faucetHost": "xahau-test.net",
             "shortName": "Xahau-Testnet",
             "desc": "Hooks (L1 smart contracts) enabled Xahau testnet."
         },
         {
             "id": "faucet-select-mpt-devnet",
             "wsUrl": "wss://mpt.devnet.rippletest.net:51233/",
             "jsonRpcUrl": "https://mpt.devnet.rippletest.net:51234/",
-            "faucetUrl": "mptfaucet.devnet.rippletest.net",
+            "faucetHost": "mptfaucet.devnet.rippletest.net",
             "shortName": "MPT-Devnet",
             "desc": "Preview of XLS-33d Multi-Purpose Tokens amendment."
         },
         {
             "id": "faucet-select-batch-devnet",
             "wsUrl": "wss://batch.nerdnest.xyz",
             "jsonRpcUrl": "https://batch.rpc.nerdnest.xyz",
-            "faucetUrl": "batch.faucet.nerdnest.xyz",
+            "faucetHost": "batch.faucet.nerdnest.xyz",
             "shortName": "Batch-Devnet",
             "desc": "Preview of XLS-56d Batch transactions."
         }   

resources/dev-tools/xrp-faucets.page.tsx

@@ -1,10 +1,10 @@
-import * as React from 'react';
-import { useThemeHooks } from '@redocly/theme/core/hooks';
 import { Link } from "@redocly/theme/components/Link/Link";
+import { useThemeHooks } from '@redocly/theme/core/hooks';
+import * as React from 'react';
 import { useState } from 'react';
-import { Client, dropsToXrp, Wallet } from 'xrpl'; 
-import * as faucetData from './faucets.json'
+import { Client, dropsToXrp, Wallet } from 'xrpl';
 import XRPLoader from '../../@theme/components/XRPLoader';
+import * as faucetData from './faucets.json';
 
 export const frontmatter = {
   seo: {
@@ -17,7 +17,7 @@ interface FaucetInfo {
   id: string,
   wsUrl: string,
   jsonRpcUrl: string,
-  faucetUrl: string,
+  faucetHost: string,
   shortName: string,
   desc: string,
 }
@@ -139,7 +139,7 @@ async function generateFaucetCredentialsAndUpdateUI(
     setAddress(wallet.address)
     setSecret(wallet.seed)
 
-    await client.fundWallet(wallet, { faucetHost: selectedFaucet.faucetUrl, usageContext: "xrpl.org-faucet" })
+    await client.fundWallet(wallet, { faucetHost: selectedFaucet.faucetHost, usageContext: "xrpl.org-faucet" })
 
     const response = await waitForSequence(client, wallet.address)