From 33c33974f5b4c699009f95718d19bb10ac664119 Mon Sep 17 00:00:00 2001
From: Mekjah <believeinsomething2421@gmail.com>
Date: Wed, 5 Aug 2026 17:18:43 +1000
Subject: [PATCH] feat: add clipboard paste button to destination address
 inputs

---
 apps/src/components/AddressInput.tsx | 48 ++++++++++++++++++++++++++++
 apps/src/pages/SchedulePage.tsx      |  3 +-
 apps/src/pages/SendPage.tsx          | 36 +++++++++------------
 3 files changed, 65 insertions(+), 22 deletions(-)
 create mode 100644 apps/src/components/AddressInput.tsx

diff --git a/apps/src/components/AddressInput.tsx b/apps/src/components/AddressInput.tsx
new file mode 100644
index 0000000..a90721c
--- /dev/null
+++ b/apps/src/components/AddressInput.tsx
@@ -0,0 +1,48 @@
+import { ClipboardPaste } from 'lucide-react';
+import toast from 'react-hot-toast';
+
+interface Props {
+  value: string;
+  onChange: (val: string) => void;
+  placeholder?: string;
+  error?: string;
+}
+
+export default function AddressInput({ value, onChange, placeholder = 'G...', error }: Props) {
+  async function handlePaste() {
+    try {
+      const text = await navigator.clipboard.readText();
+      const trimmed = text.trim();
+      if (trimmed.startsWith('G') && trimmed.length === 56) {
+        onChange(trimmed);
+        toast.success('Address pasted');
+      } else {
+        toast.error('Clipboard does not contain a valid Stellar address');
+      }
+    } catch {
+      toast.error('Clipboard access denied — paste manually');
+    }
+  }
+
+  return (
+    <div>
+      <div className="relative">
+        <input
+          className={`input-field font-mono text-sm pr-12 ${error ? 'border-red-500' : ''}`}
+          placeholder={placeholder}
+          value={value}
+          onChange={e => onChange(e.target.value)}
+        />
+        <button
+          type="button"
+          onClick={handlePaste}
+          className="absolute right-3 top-1/2 -translate-y-1/2 text-stellar-600 hover:text-stellar-400 transition-colors"
+          title="Paste from clipboard"
+        >
+          <ClipboardPaste size={16} />
+        </button>
+      </div>
+      {error && <p className="text-red-400 text-xs mt-1 font-body">{error}</p>}
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/apps/src/pages/SchedulePage.tsx b/apps/src/pages/SchedulePage.tsx
index 30e4638..a768f59 100644
--- a/apps/src/pages/SchedulePage.tsx
+++ b/apps/src/pages/SchedulePage.tsx
@@ -13,6 +13,7 @@ import {
   XCircle, ChevronDown, ChevronUp, Loader2,
 } from 'lucide-react';
 import type { ScheduledPayment } from '../types';
+import AddressInput from '../components/AddressInput';
 
 const FREQUENCIES: ScheduledPayment['frequency'][] = ['daily', 'weekly', 'monthly'];
 const ASSETS = ['XLM', 'USDC'];
@@ -104,7 +105,7 @@ export default function SchedulePage() {
 
             <div>
               <label className="text-stellar-600 text-xs font-display uppercase tracking-widest block mb-1">To Address</label>
-              <input className="input-field font-mono text-sm" placeholder="G..." value={destination} onChange={e => setDestination(e.target.value)} />
+              <AddressInput value={destination} onChange={setDestination} />
             </div>
 
             <div className="flex gap-2">
diff --git a/apps/src/pages/SendPage.tsx b/apps/src/pages/SendPage.tsx
index bc277d6..f1317b1 100644
--- a/apps/src/pages/SendPage.tsx
+++ b/apps/src/pages/SendPage.tsx
@@ -5,6 +5,7 @@ import { buildSendTx, submitTx, USDC_ASSET } from '../lib/stellar';
 import AssetBadge from '../components/AssetBadge';
 import toast from 'react-hot-toast';
 import { CheckCircle, ArrowRight } from 'lucide-react';
+import AddressInput from '../components/AddressInput';
 
 const ASSETS = [
   { code: 'XLM', label: 'Stellar Lumens' },
@@ -109,28 +110,21 @@ export default function SendPage() {
       </div>
 
       {/* Destination */}
-      <div className="mb-4">
-        <label className="text-stellar-600 text-xs font-display font-600 uppercase tracking-widest block mb-2">
-          Destination Address
+       <div className="mb-4">
+       <label className="text-stellar-600 text-xs font-display font-600 uppercase tracking-widest block mb-2">
+        Destination Address
         </label>
-        <input
-          className="input-field font-mono text-sm"
-          placeholder="G..."
-          value={destination}
-          onChange={e => {
-          const val = e.target.value;
-          setDestination(val);
-          if (val.length === 0) {
-          setDestError('');
-          } else if (!val.startsWith('G') || val.length !== 56) {
-          setDestError('Invalid Stellar address — must start with G and be 56 characters');
-          } else {
-          setDestError('');
-         }
-          }}
-        />
-        {destError && <p className="text-red-500 text-xs mt-1">{destError}</p>}
-      </div>
+        <AddressInput
+        value={destination}
+        onChange={val => {
+        setDestination(val);
+        if (val.length === 0) setDestError('');
+        else if (!val.startsWith('G') || val.length !== 56) setDestError('Invalid Stellar address');
+        else setDestError('');
+       }}
+       error={destError}
+       />
+       </div>
 
       {/* Amount */}
       <div className="mb-4">