42 lines
No EOL
1.5 KiB
TypeScript
42 lines
No EOL
1.5 KiB
TypeScript
import shortlinkLogo from '../assets/trx-shortlink-orange.png'
|
|
import '../App.css'
|
|
import { useParams } from 'react-router-dom';
|
|
|
|
const Copylink = () => {
|
|
|
|
const { id } = useParams<{ id: string }>();
|
|
|
|
return (
|
|
<>
|
|
<header>
|
|
<div className="nav">
|
|
<nav id="main-nav">
|
|
<ul id="centerlist">
|
|
<li id="home"> <a draggable="false" href="/home">Home</a> </li>
|
|
|
|
|
|
</ul>
|
|
<ul id="rightlist">
|
|
<li id="login"> <a draggable="false" href='/login'>Login</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<div id="logoname">
|
|
<a href="/home" >
|
|
<img src={shortlinkLogo} draggable="false" className="logo" alt="trx shortlink logo" />
|
|
</a>
|
|
<h1>trx shortlink</h1>
|
|
</div>
|
|
<div className="card">
|
|
<input className="input" id="shorturl" readOnly value={`http://localhost:3000/${id}`}></input>
|
|
<button id="button_copy" onClick={() => navigator.clipboard.writeText((document.getElementById("shorturl") as HTMLInputElement).value) && alert("The shortlink was copied!")}>
|
|
Copy!
|
|
</button>
|
|
</div>
|
|
</>
|
|
)
|
|
|
|
};
|
|
|
|
export default Copylink; |