damjan_savicandClaude Opus 4.5
b1ec7b4d61
- Replace Vite + React Router with Next.js 15 App Router - Implement i18n with next-intl (URL-based: /de, /en, /sr) - Add SSR/SSG for all pages (48 static pages generated) - Setup Supabase SSR client for auth - Migrate all pages: Home, About, Portfolio, Blog, Contact, Login, Dashboard, Imprint, Privacy, Terms - Add Docker support with standalone output - Replace i18next with next-intl JSON translations - Use next/image for optimized images Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
45 lines
1.2 KiB
TypeScript
45 lines
1.2 KiB
TypeScript
interface ResponsiveImageProps {
|
|
src: string;
|
|
alt: string;
|
|
className?: string;
|
|
sizes?: string;
|
|
loading?: 'lazy' | 'eager';
|
|
fetchpriority?: 'high' | 'low' | 'auto';
|
|
}
|
|
|
|
export default function ResponsiveImage({
|
|
src,
|
|
alt,
|
|
className = '',
|
|
sizes = '100vw',
|
|
loading = 'lazy',
|
|
fetchpriority = 'auto'
|
|
}: ResponsiveImageProps) {
|
|
// Generate Unsplash responsive URLs
|
|
const generateSrcSet = (url: string) => {
|
|
if (!url.includes('unsplash.com')) return undefined;
|
|
|
|
const widths = [640, 750, 828, 1080, 1200, 1920, 2048, 3840];
|
|
return widths
|
|
.map((w) => {
|
|
const modifiedUrl = url.replace(/w=\d+/, `w=${w}`);
|
|
return `${modifiedUrl} ${w}w`;
|
|
})
|
|
.join(', ');
|
|
};
|
|
|
|
const srcSet = generateSrcSet(src);
|
|
|
|
return (
|
|
<img
|
|
src={src}
|
|
alt={alt}
|
|
className={className}
|
|
loading={loading}
|
|
fetchpriority={fetchpriority}
|
|
sizes={sizes}
|
|
srcSet={srcSet}
|
|
/>
|
|
);
|
|
}
|