"use client";
import Image from "next/image";
import type { ReactNode } from "react";
import { useEffect, useRef, useState } from "react";
import {
dispatchStorefrontWishlistAdded,
dispatchStorefrontWishlistUpdated,
} from "@/lib/storefront-events";
import { detonexFigmaAssets } from "@/lib/detonex-figma";
import { buildWishlistItemFromProductDetail } from "@/lib/storefront-wishlist-item";
import type { StorefrontProductDetail, StorefrontWishlist } from "@/types/storefront";
function ShareIcon({
children,
}: {
children: ReactNode;
}) {
return (
{children}
);
}
export function ProductHeaderActions({
product,
}: {
product: StorefrontProductDetail;
}) {
const [isShareMenuOpen, setIsShareMenuOpen] = useState(false);
const shareMenuRef = useRef(null);
const shareUrl =
typeof window !== "undefined" ? window.location.href : product.href;
const shareText = `${product.name} ${shareUrl}`;
useEffect(() => {
if (!isShareMenuOpen) {
return undefined;
}
function handlePointerDown(event: MouseEvent) {
if (!shareMenuRef.current?.contains(event.target as Node)) {
setIsShareMenuOpen(false);
}
}
function handleEscape(event: KeyboardEvent) {
if (event.key === "Escape") {
setIsShareMenuOpen(false);
}
}
document.addEventListener("mousedown", handlePointerDown);
document.addEventListener("keydown", handleEscape);
return () => {
document.removeEventListener("mousedown", handlePointerDown);
document.removeEventListener("keydown", handleEscape);
};
}, [isShareMenuOpen]);
async function handleAddToWishlist() {
try {
const response = await fetch("/api/wishlist/items", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(buildWishlistItemFromProductDetail(product)),
});
const payload = (await response.json()) as StorefrontWishlist | { message?: string };
if (!response.ok) {
throw new Error(
"message" in payload && payload.message
? payload.message
: "Dodavanje u listu želja nije uspjelo.",
);
}
dispatchStorefrontWishlistUpdated(payload as StorefrontWishlist);
dispatchStorefrontWishlistAdded(buildWishlistItemFromProductDetail(product));
} catch {}
}
function handleShareTrigger() {
setIsShareMenuOpen((current) => !current);
}
async function handleCopyLink() {
try {
await navigator.clipboard.writeText(shareUrl);
setIsShareMenuOpen(false);
} catch {}
}
return (
{isShareMenuOpen ? (
) : null}
);
}