39 lines
925 B
TypeScript
39 lines
925 B
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
|
|
interface TipProductImageProps {
|
|
alt: string;
|
|
className: string;
|
|
priority?: boolean;
|
|
sources: readonly string[];
|
|
}
|
|
|
|
export function TipProductImage({
|
|
alt,
|
|
className,
|
|
priority = false,
|
|
sources,
|
|
}: TipProductImageProps) {
|
|
const [sourceIndex, setSourceIndex] = useState(0);
|
|
const source = sources[sourceIndex] ?? sources[sources.length - 1];
|
|
if (!source) return null;
|
|
|
|
return (
|
|
// Gift hosts are managed by the backend and cannot be safely enumerated in Next remotePatterns.
|
|
// eslint-disable-next-line @next/next/no-img-element
|
|
<img
|
|
src={source}
|
|
alt={alt}
|
|
className={className}
|
|
loading={priority ? "eager" : "lazy"}
|
|
fetchPriority={priority ? "high" : "auto"}
|
|
onError={() => {
|
|
if (sourceIndex < sources.length - 1) {
|
|
setSourceIndex((index) => index + 1);
|
|
}
|
|
}}
|
|
/>
|
|
);
|
|
}
|