feat: add copy button next to registry number in table
Copies "nr. BTG-0042/2026 din 11.03.2026" to clipboard on click. Small icon, subtle until hover, green check feedback on copy. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -12,6 +12,8 @@ import {
|
|||||||
Paperclip,
|
Paperclip,
|
||||||
Reply,
|
Reply,
|
||||||
CheckCircle2,
|
CheckCircle2,
|
||||||
|
Copy,
|
||||||
|
Check,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { Button } from "@/shared/components/ui/button";
|
import { Button } from "@/shared/components/ui/button";
|
||||||
import { Badge } from "@/shared/components/ui/badge";
|
import { Badge } from "@/shared/components/ui/badge";
|
||||||
@@ -312,7 +314,10 @@ export function RegistryTable({
|
|||||||
>
|
>
|
||||||
{visibleCols.has("number") && (
|
{visibleCols.has("number") && (
|
||||||
<td className="px-3 py-2 font-mono text-xs whitespace-nowrap">
|
<td className="px-3 py-2 font-mono text-xs whitespace-nowrap">
|
||||||
{entry.number}
|
<span className="inline-flex items-center gap-1">
|
||||||
|
{entry.number}
|
||||||
|
<CopyNumberButton entry={entry} />
|
||||||
|
</span>
|
||||||
</td>
|
</td>
|
||||||
)}
|
)}
|
||||||
{visibleCols.has("date") && (
|
{visibleCols.has("date") && (
|
||||||
@@ -514,6 +519,37 @@ export function RegistryTable({
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function CopyNumberButton({ entry }: { entry: RegistryEntry }) {
|
||||||
|
const [copied, setCopied] = useState(false);
|
||||||
|
|
||||||
|
const handleCopy = (e: React.MouseEvent) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
const text = `nr. ${entry.number} din ${formatDate(entry.date)}`;
|
||||||
|
void navigator.clipboard.writeText(text).then(() => {
|
||||||
|
setCopied(true);
|
||||||
|
setTimeout(() => setCopied(false), 1500);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const Icon = copied ? Check : Copy;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={handleCopy}
|
||||||
|
className={cn(
|
||||||
|
"inline-flex items-center justify-center h-4 w-4 rounded transition-colors",
|
||||||
|
copied
|
||||||
|
? "text-green-600"
|
||||||
|
: "text-muted-foreground/40 hover:text-muted-foreground",
|
||||||
|
)}
|
||||||
|
title="Copiaza nr. din data de..."
|
||||||
|
>
|
||||||
|
<Icon className="h-3 w-3" />
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
function formatDate(iso: string): string {
|
function formatDate(iso: string): string {
|
||||||
try {
|
try {
|
||||||
return new Date(iso).toLocaleDateString("ro-RO", {
|
return new Date(iso).toLocaleDateString("ro-RO", {
|
||||||
|
|||||||
Reference in New Issue
Block a user