Files
hope-events/frontend/src/app/events/[id]/ClientActions.tsx
T
joshua 3d381944d2 Initial commit
Next.js + Express event management app for Hope Family Church.
2026-07-23 15:26:47 +02:00

49 lines
1.8 KiB
TypeScript

"use client";
import { Share2, QrCode } from "lucide-react";
import QRCode from "qrcode";
export default function ClientActions({ event }: { event: any }) {
return (
<div className="flex gap-2">
<button
onClick={async () => {
try {
await navigator.share({
title: event.title,
text: event.description,
url: window.location.href,
});
} catch (err) {
console.error("Error sharing:", err);
}
}}
className="flex items-center gap-2 px-4 py-2 bg-gray-100 rounded hover:bg-gray-200"
>
<Share2 className="w-4 h-4" />
Share
</button>
<button
onClick={async () => {
try {
const url = window.location.href;
const qrDataUrl = await QRCode.toDataURL(url);
const link = document.createElement("a");
link.href = qrDataUrl;
link.download = `${event.title}-qr.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} catch (err) {
console.error("Error generating QR code:", err);
}
}}
className="flex items-center gap-2 px-4 py-2 bg-gray-100 rounded hover:bg-gray-200"
>
<QrCode className="w-4 h-4" />
Save QR
</button>
</div>
);
}