feat: update Send button disabled state, animate feedback msg

src/components/SendTransaction.tsx

@@ -3,13 +3,16 @@ import algosdk from 'algosdk'
 import { useState } from 'react'
 import PartyTime from '@/components/PartyTime'
 import algodClient from '@/lib/algodClient'
+import { classNames } from '@/utils'
 
 type Status = 'idle' | 'signing' | 'sending' | 'success' | 'error'
 
 export default function SendTransaction() {
   const [status, setStatus] = useState<Status>('idle')
   const [showConfetti, setShowConfetti] = useState(false)
 
+  const statusInFlight = ['signing', 'sending'].includes(status)
+
   const { activeAddress, signTransactions, sendTransactions } = useWallet()
 
   const sendTransaction = async () => {
@@ -89,12 +92,17 @@ export default function SendTransaction() {
             type="button"
             className="rounded-full bg-teal-600/90 px-6 py-2 font-beni text-white text-4xl tracking-wide shadow-lg shadow-zinc-800/5 ring-1 ring-teal-500/75 backdrop-blur transition hover:bg-teal-600 hover:text-white hover:ring-teal-300 sm:text-5xl sm:px-7 sm:py-2.5 xl:text-6xl xl:px-9 xl:py-3 disabled:opacity-50 disabled:pointer-events-none"
             onClick={sendTransaction}
-            disabled={status !== 'idle'}
+            disabled={statusInFlight}
           >
             Send Transaction
           </button>
         </div>
-        <p className="font-beni text-white/75 text-5xl tracking-wide xs:text-6xl sm:text-7xl">
+        <p
+          className={classNames(
+            'font-beni text-white/75 text-5xl tracking-wide xs:text-6xl sm:text-7xl',
+            statusInFlight ? 'animate-pulse' : ''
+          )}
+        >
           {renderStatus()}
         </p>
       </div>