diff --git a/.env.example b/.env.example index 6d9331a..5218f16 100644 --- a/.env.example +++ b/.env.example @@ -23,10 +23,10 @@ NEXT_PUBLIC_REGISTRY_GQL_ENDPOINT=https://laconicd-mainnet-1.laconic.com/graphql NEXT_PUBLIC_ALNT_COST_LRN=lrn://laconic/pricing/alnt NEXT_PUBLIC_DEPLOYMENT_COST_LRN=lrn://laconic/pricing/webapp-deployment REGISTRY_GAS_PRICE=0.001 -REGISTRY_BOND_ID=5d82586d156fb6671a9170d92f930a72a49a29afb45e30e16fff2100e30776e2 REGISTRY_AUTHORITY=laconic-deploy +REGISTRY_BOND_ID=5d82586d156fb6671a9170d92f930a72a49a29afb45e30e16fff2100e30776e2 REGISTRY_USER_KEY= # Application Configuration -DEPLOYER_LRN= -NEXT_PUBLIC_DOMAIN_SUFFIX= +DEPLOYER_LRN=lrn://vaasl-provider/deployers/webapp-deployer-api.apps.vaasl.io +NEXT_PUBLIC_DOMAIN_SUFFIX=apps.vaasl.io diff --git a/src/app/page.tsx b/src/app/page.tsx index 994cec7..046f55b 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useCallback, useEffect, useState, useRef } from 'react'; +import { useCallback, useEffect, useState, useRef, useMemo } from 'react'; import dynamic from 'next/dynamic'; import { WalletMultiButton } from '@solana/wallet-adapter-react-ui'; @@ -51,6 +51,7 @@ export default function Home() { const [repoUrl, setRepoUrl] = useState(null); const [error, setError] = useState(null); const [incorrectChainWarning, setIncorrectChainWarning] = useState(null); + const [isFetchingChainGenesisHash, setIsFetchingChainGenesisHash] = useState(false); useEffect(() => { if (!IS_NAT_GOR_TRANSFER_ENABLED) { @@ -65,21 +66,27 @@ export default function Home() { } const warnOnIncorrectChain = async () => { - // @ts-expect-error: backpack exists on window object - const genesisHash = await window.backpack.solana.connection.getGenesisHash(); + setIsFetchingChainGenesisHash(true); - const expectedGenesisHash = selectedPaymentMethod === PaymentMethod.NAT_GOR - ? GORBAGANA_GENESIS_HASH - : SOLANA_GENESIS_HASH; - - const expectedChainName = selectedPaymentMethod === PaymentMethod.NAT_GOR - ? "Gorbagana" - : "Solana"; - - if (genesisHash !== expectedGenesisHash) { - setIncorrectChainWarning( - `WARNING: Unsupported chain selected in wallet. Please switch to ${expectedChainName} chain and reconnect the wallet.` - ); + try { + // @ts-expect-error: backpack exists on window object + const genesisHash = await window.backpack.solana.connection.getGenesisHash(); + + const expectedGenesisHash = selectedPaymentMethod === PaymentMethod.NAT_GOR + ? GORBAGANA_GENESIS_HASH + : SOLANA_GENESIS_HASH; + + const expectedChainName = selectedPaymentMethod === PaymentMethod.NAT_GOR + ? "Gorbagana" + : "Solana"; + + if (genesisHash !== expectedGenesisHash) { + setIncorrectChainWarning( + `Unsupported network selected in wallet. Please switch to network for ${expectedChainName} chain and reconnect the wallet.` + ); + } + } finally { + setIsFetchingChainGenesisHash(false); } } @@ -110,7 +117,7 @@ export default function Home() { }; // Helper function to check if current wallet is compatible with selected payment method - const isWalletCompatible = () => { + const isWalletCompatible = useMemo(() => { if (!selectedPaymentMethod || !wallet) return false; const walletName = wallet.adapter.name.toLowerCase(); @@ -121,7 +128,7 @@ export default function Home() { } else { return true; // Only non-Backpack wallets for SPL tokens } - }; + }, [selectedPaymentMethod, wallet]); const handlePaymentComplete = useCallback(async (hash: string, paymentMethod: PaymentMethod) => { if (!publicKey || !url) { @@ -245,20 +252,25 @@ export default function Home() {

- {isWalletCompatible() ? 'Compatible' : 'Incompatible'} Wallet ({wallet?.adapter.name}) + {isWalletCompatible ? 'Compatible' : 'Incompatible'} Wallet ({wallet?.adapter.name})

- {!isWalletCompatible() && ( + {!isWalletCompatible && (

This wallet is not compatible with {PAYMENT_METHOD_LABELS[selectedPaymentMethod]} payments. Please select a different wallet or payment method.

)} + { isFetchingChainGenesisHash && ( +

+ Checking wallet network compatibility... +

+ )} {incorrectChainWarning && (

{incorrectChainWarning} @@ -296,18 +308,19 @@ export default function Home() {

)} + {/* Step 3: URL Input */}

Enter URL to Deploy