Address table refresh

src/App.tsx

@@ -24,7 +24,7 @@ import Nft from './pages/Nft';
 import { NftList } from './pages/NftList';
 import { Offers } from './pages/Offers';
 import PeerList from './pages/PeerList';
-import Receive from './pages/Receive';
+import Addresses from './pages/Addresses';
 import Send from './pages/Send';
 import Settings from './pages/Settings';
 import Token from './pages/Token';
@@ -58,7 +58,7 @@ const router = createHashRouter(
         <Route path='token/:asset_id' element={<Token />} />
         <Route path='issue-token' element={<IssueToken />} />
         <Route path='send/:asset_id' element={<Send />} />
-        <Route path='receive' element={<Receive />} />
+        <Route path='addresses' element={<Addresses />} />
       </Route>
       <Route path='/nfts' element={<Wallet />}>
         <Route path='' element={<NftList />} />

src/components/AddressList.tsx

@@ -16,6 +16,7 @@ import {
 import { ChevronLeft, ChevronRight } from 'lucide-react';
 import { useMemo } from 'react';
 import { Button } from './ui/button';
+import { CopyButton } from './CopyButton';
 
 export interface AddressListProps {
   addresses: string[];
@@ -46,6 +47,18 @@ export default function AddressList(props: AddressListProps) {
       cell: (info) => (
         <div className='truncate'>{info.getValue() as string}</div>
       ),
+      size: 140,
+    },
+    {
+      header: 'Actions',
+      cell: (info) => (
+        <div>
+          <CopyButton
+            value={info.row.original.address}
+            className='flex-shrink-0'
+          />
+        </div>
+      ),
     },
   ];
 
@@ -85,9 +98,12 @@ export default function AddressList(props: AddressListProps) {
             <TableBody>
               {table.getRowModel().rows?.length ? (
                 table.getRowModel().rows.map((row) => (
-                  <TableRow key={row.id} className='h-[52px]'>
+                  <TableRow key={row.id} className='-inset-x-2/40px]'>
                     {row.getVisibleCells().map((cell) => (
-                      <TableCell key={cell.id}>
+                      <TableCell
+                        key={cell.id}
+                        style={{ maxWidth: `${cell.column.getSize()}px` }}
+                      >
                         {flexRender(
                           cell.column.columnDef.cell,
                           cell.getContext(),

src/components/Nav.tsx

@@ -27,7 +27,7 @@ export function Nav() {
         <ArrowLeftRight className='h-4 w-4' />
         Offers
       </NavLink>
-      <NavLink url={'/wallet/receive'}>
+      <NavLink url={'/wallet/addresses'}>
         <BookUser className='h-4 w-4' />
         Addresses
       </NavLink>

src/pages/Receive.tsx → src/pages/Addresses.tsx

@@ -13,7 +13,7 @@ import { commands, events } from '../bindings';
 import AddressList from '../components/AddressList';
 import { useWalletState } from '../state';
 
-export default function Receive() {
+export default function Addresses() {
   const walletState = useWalletState();
 
   const [addresses, setAddresses] = useState<string[]>([]);

src/pages/Token.tsx

@@ -225,7 +225,7 @@ export default function Token() {
                     <Send className='mr-2 h-4 w-4' /> Send
                   </Button>
                 </Link>
-                <Link to='/wallet/receive'>
+                <Link to='/wallet/addresses'>
                   <Button variant={'outline'}>
                     <HandHelping className='mr-2 h-4 w-4' /> Receive
                   </Button>