git/TokenizeRWATemplate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: copy addr, hyperlinks to ALGO/USDC dispenser

Browse Source
This commit is contained in:
SaraJane
2026-01-15 13:01:22 +00:00
parent c11daa5aff
commit f6f24257d5
2 changed files with 77 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
projects/TokenizeRWATemplate-frontend/src/components/Account.tsx
View File

@ -1,4 +1,4 @@
import { useMemo } from 'react'
import { useMemo, useState } from 'react'
import { useUnifiedWallet } from '../hooks/useUnifiedWallet'
import { ellipseAddress } from '../utils/ellipseAddress'
import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClientConfigs'
@ -18,6 +18,7 @@ import { getAlgodConfigFromViteEnvironment } from '../utils/network/getAlgoClien
const Account = () => {
const { activeAddress } = useUnifiedWallet()
const algoConfig = getAlgodConfigFromViteEnvironment()
const [copied, setCopied] = useState(false)
// Normalize network name for Lora
const networkName = useMemo(() => {
@ -33,8 +34,19 @@ const Account = () => {
const loraUrl = `https://lora.algokit.io/${networkName}/account/${address}/`
const handleCopy = async () => {
try {
await navigator.clipboard.writeText(address)
setCopied(true)
setTimeout(() => setCopied(false), 1500)
} catch (e) {
console.error('Failed to copy address', e)
}
}
return (
<div>
<div className="flex items-center gap-2">
<a
href={loraUrl}
target="_blank"
@ -44,6 +56,21 @@ const Account = () => {
Address: {ellipseAddress(address)}
</a>
{/* Copy button */}
<button
type="button"
onClick={(e) => {
e.preventDefault()
e.stopPropagation()
handleCopy()
}}
className="inline-flex items-center rounded-md border border-slate-300 dark:border-slate-600 bg-white dark:bg-slate-800 px-2 py-1 text-xs font-medium text-slate-700 dark:text-slate-200 hover:bg-slate-100 dark:hover:bg-slate-700 transition"
title={copied ? 'Copied!' : 'Copy address'}
>
{copied ? 'Copied' : 'Copy'}
</button>
</div>
<div className="text-xl text-gray-900 dark:text-slate-100 mt-2">Network: {networkName}</div>
</div>
)

41
projects/TokenizeRWATemplate-frontend/src/components/TokenizeAsset.tsx
View File

@ -649,6 +649,27 @@ export default function TokenizeAsset() {
<div>
<h2 className="text-xl sm:text-2xl font-bold tracking-tight text-slate-900 dark:text-white">Tokenize on Algorand</h2>
<p className="text-sm text-slate-600 dark:text-slate-400 mt-1">Mint standard ASAs or mint an NFT-style ASA on TestNet.</p>
{/* TestNet funding helper */}
<div className="mt-4 rounded-xl border border-slate-200 dark:border-slate-700 bg-slate-50 dark:bg-slate-800/40 p-4">
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
<div className="text-sm text-slate-700 dark:text-slate-200">
Need TestNet ALGO to get started? Use the Algorand TestNet Dispenser.
<span className="block text-xs text-slate-500 dark:text-slate-400 mt-1">
Tip: fund the connected address, then refresh your balance.
</span>
</div>
<a
href="https://bank.testnet.algorand.network/"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center px-4 py-2 rounded-lg font-semibold bg-teal-600 hover:bg-teal-700 text-white shadow-md transition"
>
Open Dispenser ↗
</a>
</div>
</div>
</div>
</div>
</div>
@ -1143,6 +1164,26 @@ export default function TokenizeAsset() {
<div className="mt-12 bg-white dark:bg-slate-900 rounded-2xl border border-slate-200 dark:border-slate-700 shadow-lg p-6 sm:p-8">
<h3 className="text-lg font-bold text-slate-900 dark:text-white mb-2">Transfer</h3>
<p className="text-sm text-slate-600 dark:text-slate-400 mb-6">Send ALGO, USDC, or any ASA (including NFTs) to another wallet.</p>
{/* TestNet USDC helper */}
<div className="mb-6 rounded-xl border border-slate-200 dark:border-slate-700 bg-slate-50 dark:bg-slate-800/40 p-4">
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-3">
<div className="text-sm text-slate-700 dark:text-slate-200">
Need TestNet USDC? Use Circle’s faucet, then transfer it like any ASA.
<span className="block text-xs text-slate-500 dark:text-slate-400 mt-1">
Note: you may need to opt-in to the USDC asset before receiving it.
</span>
</div>
<a
href="https://faucet.circle.com/"
target="_blank"
rel="noopener noreferrer"
className="inline-flex items-center justify-center px-4 py-2 rounded-lg font-semibold bg-teal-600 hover:bg-teal-700 text-white shadow-md transition"
>
Open USDC Faucet ↗
</a>
</div>
</div>
{/* Mode selector */}
<div className="mb-5">